Команда scrum-студии Сибирикс запустила очень девчачий интернет-магазин со сменой цветов и милыми анимациями — Lakk&Roll.
В интернет-магазине Lakk&Roll есть всё для красоты и здоровья ногтей: уходовые средства, декоративные лаки, базовые покрытия и гель-лаки. Заказчик планировал обновить корпоративный портал, но в ходе работы над проектом появились новые возможности для бизнеса, отчего проект перерос в полноценный е-коммерс, для которого мы не только создали удобный и мимимишный сайт, но и придумали логотип и название.
Задачи
— Создать оптимальную структуру интернет-магазина, чтобы посетители легко могли найти нужную информацию.
— Сделать акцент на брендах и их преимуществах.
— Создать современный свежий дизайн, который бы подчёркивал достоинства продукции.
— Заманивать пользователей на сайт индивидуальными предложениями и рекомендациями.
— Сделать адаптивную версию максимально крутой и удобной, ведь сейчас потребители часто заказывают в интернет-магазинах именно с телефонов.
Дизайн
Основные посетители сайта — начинающие мастера и профессионалы в поисках идей, салоны красоты, ищущие выгодное сотрудничество и расширяющие ассортимент, и конечные потребители их услуг.
Мы предусмотрели промо-блок, популярные категории из каталога и интересное из блога — чтобы удовлетворить интересы пользователей всех групп.
Мы предложили два цветовых варианта — более смелый и пастельный. И хотя пастельная гамма была ближе заказчику, оба варианта получились настолько классными, что клиенту было сложно определиться. В рассуждениях на демо вместе с ним мы придумали фишку — возможность полностью менять цвета в промо-блоке в зависимости от сезона и трендов. И на этапе разработки мы взяли и запилили смену цветов вообще ВЕЗДЕ :)
Для кого-то из посетителей сайта важен объём бутылочки, для кого-то бренд, но всё-таки огромное значение для всех в лаковой индустрии имеет цветовая палитра. Поэтому на главной в промо-блоке появилась переключалка для смены цветов, а в самом каталоге при наведении на продукт появляется капелька лака — так легче выбирать средство по цвету.
Внутри карточки товара есть раздел с инструкцией по применению — он пригодится и начинающим мастерам, и тем, кто делает маникюр в домашних условиях. Также есть видео, на котором показано, как ложится покрытие.
Ещё в карточке товара есть вкладка «награды», где указываются премии и награждения от профессиональных и авторитетных СМИ. Отзывы покупателей в блоке слева помогут пользователям сложить полноценное впечатление о продукте.
Разработка
В проекте много приятной микроанимации: это и цветной прелоадер, и наплывающие друг на друга блоки на главной, и появляющиеся капельки при наведении на товар в каталоге. Из мимимишных мелочей также есть бьющиеся сердечки «в избранное», закрашивающиеся кнопки, прыгающий контент и всплывающее окно с номером телефона.
Для профессионалов очень важен объём бутылька, как и цена, поэтому мы настроили фильтр по этим параметрам.
Сайт имеет версию для телефонов и планшетов — адаптив получился приятным и без ущерба юзабилити.
В итоге сайт получился очень «девчачьим». Залипательная анимация, кнопочки и капельки лака — прям вау :)
Готовый проект: https://lakkroll.ru/
Подробнее о процессе разработки читайте в блоге scrum-студии «Сибирикс» — https://blog.sibirix.ru/2018/03/22/lakkroll/