Не перегружайте дизайн лишними элементами. В данном случае сайт — это витрина, где акцентным является товар, и ничто не должно отвлекать посетителя от него.
Добавьте ховер при наведении на товар с предпросмотром и возможностью купить товар еще на странице выдачи. Косметика — это часто спонтанная покупка, по принципу «пришел, увидел, купил». Поэтому такое решение, как показывает практика, имеет положительный эффект.Применение ховера при наведении на товар в интернет-магазине MakeUp
Избегайте однообразия в структуре главной страницы. Используйте и слайдеры, и блоки, и плитки для переключения фокуса пользователя и для большего вовлечения его на сайт, как мы это реализовали в дизайне интернет-магазина косметики Mon Amie. Таким образом вы создаете больше различных точек входа и посетитель не будет уставать от однообразия, прокручивая только слайдеры или просматривая только блоки.Разнообразие вариантов подачи точек входа в интернет-магазине Mon Amie
Не бойтесь добавлять украшательства в дизайн интернет-магазина косметики. В сфере beauty это оправдано, так как ниша и инструменты должны пересекаться. Так, работая над проектом Mon Amie, мы добавили в дизайн акценты с помощью шрифтов, чтобы зацепить внимание посетителя и вовлечь его.Для того, чтобы акцентировать внимание на определенных элементах в интернет-магазине Mon Amie, мы добавили подписи, как бы выполненные губной помадой. Это добавило легкости и игривости интерфейсу.
2. Структурируйте каталог Ассортимент товаров интернет-магазина косметики довольно широкий. Поэтому хорошо структурированный каталог — это не рекомендация, а необходимость. Изучите потребности пользователей и проанализируйте запросы посетителей.
На основе полученных данных сформируйте многоуровневое меню и сделайте разбивку по ключевым категориям для упрощения поиска нужного товара. Для повышения микро-конверсии, стоит сделать акцент на часто запрашиваемых категориях и вынести их в отдельное горизонтальное меню.Пример хорошо структурированного каталога в интернет-магазине Mon Amie
Пример альтернативного варианта каталога на сайте Parfums
3. Продумайте поиск по сайту Строка поиска должна располагаться на видном месте, но при этом не забирать все внимание на себя. При помощи подсказок и автодополнения в строке поиска по сайту подскажите пользователю, что есть в ассортименте интернет-магазина по определенному запросу.
В интернет-магазине косметики также эффективен поиск с расширенными подсказками, где можно вывести не только конкретный товар, но и альтернативные или популярные товары из этой же категории, того же бренда, и прочее.Пример реализации расширенного поиска по сайту в интернет-магазине Mon Amie
4. Реализуйте фильтры на поисковой выдаче Дайте возможность пользователю сортировать и фильтровать товары на поисковой выдаче по определенным характеристикам и параметрам продукта, которые важны для них. Таким образом посетитель сможет сузить круг поиска, быстрее найти нужный товар и, возможно, быстрее совершит покупку.Различные фильтры для сортировки товаров в интернет-магазине косметики Mon Amie
5. Продумайте выдачу Выдача — это та же витрина, где главным является товар и на нем должен быть акцент. В дизайне интернет-магазина косметики на выдаче часто используют крупный баннер, который больше, чем в интернет-магазинах других ниш. Это сделано для того, чтобы максимально приблизить онлайн магазин к оффлайн.
Например, если речь идет о духах, то передать «настроение» аромата или образ, который он дополняет, помогает яркий и стильный баннер. Он создает атмосферу и завлекает пользователя пойти дальше на сайт.Баннер на выдаче категории женской парфюмерии в интернет-магазине Mon Amie
Добавьте фильтры для более быстрого поиска нужного товара. Часто покупатели ищут товары определенного бренда, поэтому обязательно дайте возможность отсортировать товары по марке.
Так, лидер ниши украинского e-commerce MakeUp, предлагает сортировку по буквам и скролл.Фильтр поиска по бренду в магазине MakeUp
Parfums, например, реализовал фильтр по брендам с помощью поиска и скролла, что работает намного эффективнее, чем просто скролл или поиск по буквам.Фильтр поиска по бренду в интернет-магазине Parfums
6. Персонализируйте сервис Зная свою целевую аудиторию, стоит персонализировать сервис с помощью обращений к пользователям. Так, например, магазин Sephora обращается к своим покупательницам «Hi, beautiful!».Пример персонализации сервиса в интернет-магазине косметики Sephora
В случае если пользователь зарегистрирован на сайте, то обращаться к нему стоит по имени. Таким образом, вы проявляете внимание к своим клиентам, что повышает их лояльность.Пример обращения к клиентам в интернет-магазине Parfums
7. Проработайте карточку товара Обязательно используйте большое и качественное фото товара. Добавьте инструмент увеличения, чтобы продемонстрировать структуру, текстуру или особенность товара.Инструмент увеличения в интернет-магазине косметики Parfums
Если товар предложен в нескольких цветах, то выводите не только кружочки с палитрой цветов, а демонстрируйте весь товар в новом цвете, чтобы пользователь мог понять как продукт выглядит в действительности.
В интернет-магазине косметики Parfums при наведении на палитру, меняется основное фото в карточке товара. Это завлекает пользователя походить по витрине и посмотреть на другой товар без клика и без перезагрузки страницы, что значительно упрощает процесс выбора и экономит время.Пример реализации палитры на сайте Parfums
Также стоит выводить бренд товара на видном месте, чтобы дать возможность быстро перейти на выдачу товаров по определенному производителю. Возможно пользователь захочет посмотреть другие продукты этой же фирмы в дополнение к своему товару. Карточка товара в интернет-магазине Mon Amie
Цикл сделки для товаров в нише beaty может быть довольно длинным, особенно если это не предмет первой необходимости. Поэтому как в карточке товара, так и на выдаче обязательно предоставьте пользователям возможность добавить товар в «Избранное» или в «Список желаний». Так вы повысите вероятность того, что этот товар по итогу окажется в корзине.В интернет-магазине косметики Parfums пользователь уже с выдачи может отложить товар в «Избранное»
При скролле основное фото товара можно сделать прилипающим, чтобы товар всегда оставался в фокусе пользователя. Как это реализовано в интернет-магазине Mon Amie.Реализация прилипающего фото товара в карточке товара интернет-магазина Mon Amie
Например, на MakeUp в карточке товара сохраняется идея центричности — это хорошее решение оставить товар в центре внимания. Дизайн карточки товара на MakeUp
8. Добавьте социальное доказательство Добавьте блоки с отзывами пользователей и на главной, и на выдаче, и в карточке товара. Этот инструмент не только может повлиять на принятие решения, но и помочь определиться с выбором или побудить пользователя посмотреть другой товар. Покупателям важно понять и перенять опыт других клиентов.
Также стоит добавить в карточке товара блок Вопрос-Ответ. Таким образом, пользователи смогут узнать о товаре больше, а также получить ответы на важные для них вопросы как от консультантов интернет-магазина, так и от других реальных пользователей.Отзывы и Вопросы в интернет-магазине MakeUp
9. Продумайте cross-sale и upsell инструменты Как показывает один из наших кейсов, правильное использование cross-sale и upsell инструментов может увеличить средний чек в 1,7 раз . Например, в карточке товара стоит добавить блок upsell с товарами того же бренда, но выше по классу, или cross-sale — с товарами из той же серии. В Корзине реализовать возможность покупки сертификатов, подарочной упаковки, и других cross-sale товаров.Пример cross-sale в интернет-магазине косметики MakeUp: к маске для волос пользователю предлагают шампуни, сыворотки и бальзамы из той же серии
Более подробно о том, как правильно использовать инструменты кросс сейла и апсейла можно почитать тут .
10. Создайте программу лояльности Бренд и причастность к бренду очень важно для beauty индустрии. Поэтому создавайте различные сообщества и клубы. Это хороший инструмент для удержания клиентов и повышения их лояльности, а также вовлечения новых пользователей.
Продемонстрируйте выгоду и преимущества вступления в клуб или сообщество. Для этого организуйте реферальную программу и систему лояльности с личными скидками, бонусами, промокодами. Это поможет повысить LTV. Ведь по статистике, ARPU лояльных клиентов в 3 раза выше , чем новых пользователей.Демонстрация преимуществ, которые доступны зарегистрированным пользователям в интернет-магазине Sephora
Каким должен быть дизайн интернет-магазина косметики? Ключевой характеристикой дизайна интернет-магазина косметики должен быть минимализм: все должно строиться вокруг товара и контента. Для сайтов beauty-индустрии дизайн должен играть сервисную функцию, поэтому важно не перегружать интерфейс дополнительными элементами.
Если вам нужна помощь в разработке дизайна интернет-магазина, команда Турум-бурум всегда готова вам помочь, провести экспертный юзабилити-аудит , улучшить текущий интерфейс по ESR подходу или разработать новый сайт для вашего бизнеса .