Заказчик:
Двадцать лет назад, в 2003 году, основатели VELOCITY задались целью создать идеальные по цене и качеству джинсы. Тщательные поиски привели к работе с полирингом — джинсовой тканью с шелковой нитью. Благодаря мягкости и прочности вещи быстро стали хитом: за пять лет стартап превратился в бренд с широким ассортиментом и преданными покупателями.
Задача:
Создать новый интернет-магазин VELOCITY с адаптивным дизайном для мобильных устройств, интегрировать сайт с 1c системой, системой эквайринга, и модулями доставки. То есть, создать полноценный интернет магазин, работающий постоянно и требующий минимальную поддержку администратора.
Проектирование сайта:
Один из начальных этапов разработки, в ходе которого создается предварительный дизайн сайта, его структура со схематичным изображением основных элементов.
Разработка дизайн-концепции
- Вид и стилистика сайта
- Цветовая палитра
- Шрифтовые решения
- Стилеобразующие и структурные графические элементы
- Сетка вёрстки, расположение элементов в композиции
- Общее настроение, эмоциональный посыл
Главная страница
Главная работает как конструктор.
На ней можно разместить произвольное количество полноэкранных блоков, каждый из которых ведет на свой раздел сайта.
Собирается главная страница в админке сайта.
Каталог
Каталог представляет собой разводящую страницу, включающую в себя фильтр, сортировку, а также карточки товара.
На сайте VELOCITY разводящая представлена в двух видах: по 2 и 4 карточки в ряд. Пользователь может сам определить количество выводимой информации.
При добавлении товара в корзину пользователю можно сразу указать свой рост и размер.
Карточка товара
В карточке товара представлены все необходимые параметры:
- Наименование товара
- Цвет
- Цена
- Рост
- Размер
- Фотографии с разных ракурсов
- Товар в другом цвете
- Состав
- Страна производства
- Параметры изделия
- Информация о доставке, возврате и обмене
А также был добавлен блок с готовыми образами от стилиста.
На мобильной версии для удобства была добавлена зафиксированная снизу экрана плашка с ценой и кнопкой “Добавить в корзину”.
LOOKBOOK
В Lookbook собраны готовые образы от стилистов, в отличии от каталога, где представлен более детальный обзор коллекции.
При разработке страницы Lookbook была использована нестандартная сетка.
Готовые образы объединены по сериям.
UI kit
Для проекта была выбрана цветовая гамма в стиле денимColor
Button / Hover
Winston
Winston
Winston
Winston
Winston
Winston
Winston
Heading large
- *
- *
- *
- *
- *
42
Heading meduim
- *
- *
- *
- *
- *
36
Heading small
- *
- *
- *
- *
- *
22
Large
- *
- *
- *
- *
- *
18
Base
- *
- *
- *
- *
- *
16
Small 1
- *
- *
- *
- *
- *
14
Small 2
- *
- *
- *
- *
- *
12
Noah
Noah
Noah
Noah
Noah
Noah
Noah
grid
grid
grid
grid
grid
grid
grid
grid
grid
grid
grid
grid
Результат
Мы воплотили в новом сайте VELOCITY ключевые идеи создателей марки: актуальная информация о наличии товаров, нестандартный лукбук и крупные притягательные фотографии, из которых легко собрать собственный образ.
Интернет-магазин полноценно работает - на сайте можно оплатить товар, выбрать метод доставки и произвести оплату. Благодаря продуманной интеграции с 1С-системой сайт требует минимальной работы администратора.
