Сибирикс сделал сайт для российского производителя штукатурок, грунтовок и красок марки Farbe, чье производство находится в Тюмени.
Современному и прогрессивному производству, резиденту «Сколково», понадобился обновленный сайт.
Задачи
• Разработать сайт, соответствующий имиджу компании. Рассказать о бренде и его преимуществах. Подготовить его к дальнейшему продвижению.
• Увеличить количество заказов, сделанных на сайте.
• Разработать сайт, который корректно отображается на всех устройствах.
Дизайн
На этапе аналитики выяснилось, что хороший эффект Farbe получает от раздачи пробников. Производители уверены, что их продукт — самый лучший. И готовы отправлять образцы продукции всем желающим, чтобы пользователи сами убедились в качестве. Это в «Сибирикс» решили сделать одним из конкурентных преимуществ, и учли при проектировании структуры сайта.
С дизайном сразу стало понятно, что будет вау, красота, и в центре — банка с продукцией Farbe. Осталось только правильно эту идею упаковать в макете.
Было несколько вариантов промоблока и внутренних страниц.
Долго и дотошно разрабатывали страницу товара. У Farbe немного товаров, но каждый нужно было презентовать сильно, с фейерверком и оркестром.
Заходишь на страницу товара — и тебя встречает промоблок, который рассказывает о преимуществах продукта. Здесь нужен был вау-эффект.
Варианта было два: или делать более стандартную для ecommerce страницу с блоком «Купить» в верхней части, или же сначала долго рассказывать пользователю, чем хороша продукция, и показывать ему красивые картинки. В итоге сделали оба варианта: галочкой в админке можно вывести тот или иной блок наверх. Конверсия покажет, какое решение популярнее.
Заказчик был готов к креативу — и это очень хорошо. Вон, какая 404 страница получилась!
Разработка
В промоблоке на главной странице цвета фона плавно перетекают один в другой. В изначальной концепции был бегунок, которым пользователь мог сам переключать цвета. Но на сборке от него решили отказаться.
Следующий блок на главной — с предложением заказать образцы продукции. Для анимации движения предметов здесь использовали parralax.js. Немного доработали его и «научили» не только перемещать предметы вверх и вниз, но и поворачивать их.
Одна из самых больших и трудоемких страниц сайта — страница товара. Она состоит из десяти блоков, в которых есть обычные списки новостей, а еще не совсем обычные калькулятор, цветовая палитра, галерея, табы, параллакс и особенно крутой слайдер с погодными явлениями. Можно залить слайд дождем, напустить тумана или осветить лучами солнца.
И, как и планировалось с самого начала, сайт сделали адаптивным.
Готовый проект: myfarbe.ru.
Поделиться мнением можно в нашем ТГ канале