Задача
Необходимо разработать сайт с нуля для компании, которая не была представлена на рынке ранее. Нам предстояла работа «по полной программе», поскольку помимо самого сайта в наши задачи входил поиск имени, создание логотипа и фирменного стиля.
Структура
Начали мы с построения структуры сайта. Проанализировав сайты компаний-конкурентов, и приняв во внимание требования заказчика, мы составили список самых необходимых страниц.
Сформировав страницы нужным образом, мы получили итоговую струтуру сайта. Которая, тем не менее, еще будет доработана на этапе прототипирования.
Прототипы
Мы довольно подробно проработали прототипы, хотя в процессе у нас возникали трудности с готовностью текста. Мы взяли на себя проектирование контента, и решили этот вопрос. Проработали все страницы, особое внимание уделив подаче информации и каталогу.
Оформление
Начали мы с эскизов. У нас было две основные концепции, для каждой из которых мы создали несколько вариантов.
Цвета
Цвета выбрали довольно разнообразные, но они хорошо сочетаются и интересно смотрятся вместе.
Дизайн
Итоговый дизайн включил в себя решения от обеих концепций.
Меню каталога мы повесили на одну кнопку, чтобы после добавления новых разделов не потребовалось каких-то глобальных переделок интерфейса.
Отличительной чертой оформления также стали градиенты, позаимствованные из логотипа. С их помощью мы выделили самые активные и яркие элементы, как например иконки преимуществ:
Каталог
В каталоге меню разделов уже развернуто в левой части страницы в виде списка.
Под списком разделов расположился фильтр, помогающий в подборе оборудования.
Список товаров может быть представлен в трех разных форматах:
- сетка;
- список;
- таблица
Карточка товара содержит не только фото и название товара, но и его основные характеристики:
Объект каталога
На странице товара основное место занимают фото и технические характеристики.
Справа расположены различные активные элементы, отвечающие за отправку заказа, добавление в избранное и сравнение.
Ниже находится более подробное описание, а также несколько других вкладок с комплектующими и сопутствующими товарами. Отдельная вкладка предназначена для документации.
Страница подготовлена к печати:
