Этапы работы над проектом
Аналитический этап
Ассортиментная матрица небольшая, поэтому решили отказаться от модели классического Интернет-магазина с каталогом, онлайн-оплатой, личным кабинетом. Решили делать сайт в формате лендинга, но для вовлечения пользователя во взаимодействие с сайтом, реализовали возможность выбрать товарные позиции, добавить их в корзину и отправить заявку на приобретение.
Этап дизайна
Фирменный стиль у Заказчика отсутствовал, поэтому жестких ограничений по дизайну со стороны Заказчика не было.
Лендинг направлен не только на получение информации, но и на выполнение конкретных действий – добавление в корзину, оформление заказа. Поэтому решили выполнить дизайн в умеренно строгом стиле – острые углы, неяркие основные цвета. Чтобы не делать дизайн совсем скучным, разбавили цветовую гамму акцентным оранжевым цветом
Для удобства пользователей объединили корзину и оформление заказа в одно всплывающее окно.
Описание основных блоков
- в самом верхнем баннере говорим о позиционировании и для самых нетерпеливых предлагаем оставить заявку. Здесь же показываем, что если пролистать на следующий экран, можно увидеть сферы применения нашей продукции
- в следующем блоке приводим основные преимущества и сферы применения
Основные преимущества сделаны анимированными. При наведении, плашка с преимуществом немного увеличивается.
- далее идет блок «Наша продукция». Аналог каталога товаров. Здесь можно посмотреть виды ветоши и добавить понравившуюся в корзину
А при клике на название ветоши откроется подробная информация
- в следующих блоках, мы рассказываем о действующих акциях, и о том как упаковываем нашу продукцию
- как же можно обойти стороной оптовиков? Оптовикам особые условия!
- в блоке «Схема работы», выделили конверсионный этап акцентным цветом
- также предоставили возможность скачать оптовый прайс из любого места на сайте, разместив закрепленную кнопку «Скачать прайс» в плавающей шапке
Этап верстки и программирования
По разработанномумакет-дизайну осуществили адаптивную верстку. Чтобы немного оживить лендинг, добавили анимации появления отдельных блоков.
Привязали разработанную верстку к проверенной, надежной платформе 1С-Битрикс. Для удобства администрирования реализовали возможность изменения контента – фото товаров, цен, описаний, а также добавления баннеров с акциями.
Выводы
Разработали лендинг, с умеренно строгим дизайном, удобный для работы, как с настольного компьютера, так и со смартфона. На лендинге реализована возможность добавления товаров в корзину и оформления заказа.