Master Climate Solutions
Задачи и концепция
Master - климатическое оборудование №1
Нужно было разработать удобный, функциональный интернет-магазин, который будет интуитивно понятен пользователю. В дизайне важно было соблюсти простоту, но при этом учесть уже существующий фирменный стиль бренда.
По задумке заказчика интернет-магазин должен быть ярким, запоминающимся, но без экстрима. Основной упор нужно было сделать на простоту и удобство.
Задача была интересная. Нам удалось гармонично сочетать в сайте простоту использования с ярким, необычным и запоминающимся дизайном.
За основу был выбран желтый цвет – один из ключевых цветов фирменного стиля торговой марки. Аккуратно играя с контрастом, мы реализовали насыщенный солнечный дизайн, приятный для глаз пользователя и привлекающий его внимание.
Отдельное внимание было уделено реализации каталога и карточек товара. Итоговый внешний вид этих страниц – это результат множества попыток эргономично расположить на экране большой объем технических характеристик.
- UX-дизайн
- Проектирование и дизайн
- Desktop- & Mobile-версии
- Интеграция каталога
- Работа с контентом
- Тестирование и релиз
Дизайн
«Яркий», «броский», «насыщенный» - именно так можно описать результат. Его удалось достичь за счёт использования в основе достаточно смелого решения в виде насыщенных контрастов.
Мы хотели, чтобы магазин выглядел привлекательно и запоминался посетителям, выбиваясь из привычного образа. Впрочем, при этом он вовсе не выбивается из общей концепции.
Типографика и цветовая схема
- Ab
- Black
- Bold
- Ab
- Regular
- Light
- #252525
- #f5f5f5
- #fdbb00
- #252525
- #f5f5f5
Каталог климатического оборудования
Самое важное в каталоге – простота навигации. Мы создали вложенную структуру разделов, объединив оборудование по ключевым типам. Нет лишних разделов, линейная структура понятна и чётка.
Фильтр подбора
Специфика климатического оборудования – множество технических характеристик. Для упрощения подбора товара был реализован сложный фильтр, учитывающий все основные параметры устройств: от количества потребляемого тока до скорости выдуваемого воздушного потока.
Карточка оборудования
Мы описали все данные о товаре и эргономично расположили их на странице. Для удобства использовали простую структуру подачи информации, избегали лишних элементов. Благодаря чему теперь каждая карточка предлагает крайне подробную информацию о своём товаре/
Всё – на виду
Товар абсолютно прозрачен – на странице представлена вся информация, характеристики, инструкция, а также другие варианты оборудования с разными мощностями.
Аккуратность и элегантность
Не смотря на большой объем данных, карточка не выглядит перегруженной. Грамотное расположение блоков позволило избежать неряшливости. Страница получилась легкой и легко воспринимается пользователем.
Mobile версия
Понимая, что сайт должен прекрасно выглядеть и работать на мобильном устройстве, мы проработали каждый элемент дизайна, чтобы сохранить все детали и нюансы.
Нами двигало осознание того, что крайне важное значение для пользователя имеет удобство работы с адаптивной версией. Важно было сохранить первоначальную идею, но сжать её, сохранив при этом все возможности.
Прототипы
Проектирование
На прототипах был отражен весь задуманный образ сайта – его внешний вид, функционал, структура каталога и карточки товаров. Среди десятков эскизов в итоге был выбран один: в нём идеально сочетались как креативность, так и сдержанность. Этот вариант и был воплощён нами в жизнь в образе яркого интернет-магазина “Master”.
Следующий проект
Смотреть проект