Найти тему

Мой первый полноценный кейс по созданию сайта

Ранее я уже писала, что начала учиться в направлении UX/UI дизайна и вот я создала свой первый сайт, в рамках курса обучения в Логомашине.

Задачей было создать landing и его мобильную адаптированную версию. В качестве клиента я выбрала клининг-сервис Сияние. Согласно поставленной задаче, сайт должен был быть простой для пользователя и без визуального перегруза.

Кейс делился на несколько этапов, первые из которых были исследовательские: обзор конкурентов, создание портретов пользователей и гипотез.

В период обзора конкурентов я поняла, что многие клининговые компании не уделяют много внимания своим сайтам и многие из сайтов выглядели откровенно плохо. Я очень хотела, чтобы сайт созданный мной был не только информационно доступный, но и визуально красивый.

После проведения исследовательской работы я приступила к созданию прототипа сайта с продумыванием техничексих вопросов. На этом этапе я несколько раз перерабатывала весь прототип, так как не смогла сразу найти решения, которые выполняли бы технические задачи.

-2

После создания прототипа я наконец-то приступила к созданию макета лендинга. Прежде, чем прийти к итоговому варианту макет прошел несколько переработок, включая цветовую гамму от насыщенно синего до небесно голубого, Очень большое внимание я уделила выравниваниям и созданию аккуратного вида в едином стиле.

Экран с услугами
Экран с услугами

Работа над созданием удобного калькулятора стоимости проходила в несколько этапов, и в итоге была доведена до максимального локаничного вида, но в тоже время со своей стилистичексой особенностью. Как оказалось очень сложно создать красивый калькулятор, но при этом, который бы выполнял свою функцию максимально удобно. Я долго крутила разные варианты и в итоге нашла максимально близкий вариант к желаемому.

-4

Отдельный этап работы это создание адаптированной мобильной версии лендинга. Когда создаешь мобильную версию сайта, надо обязательно учитывать, что на смартфонах мы работаем пальцем, а не мышкой. А это значит все элементы должны быть удобны для нажатия пальцем, что надо максимально продумать все кнопки и кликабельные элементы, чтоб они не выглядели громоздкими, но и не были мелкими и не заметными.

подбор экранов мобильной версии
подбор экранов мобильной версии

В итоге была проделана большая и очень интересная работа.

Визуальную концепцию лендинга можно посмотреть по ссылке в моем портфолио на Behance.