Кейс: как мы переосмыслили дизайн сайта корейского бренда, чтобы подчеркнуть его философию

Существующий дизайн интернет-магазина корейского бренда мыла и аксессуаров Binu-Binu нуждался в обновлении. Мы переосмыслили его, чтобы максимально точно отразить философию бренда в визуальном решении. Кейс о том, как создать гармоничный и функциональный дизайн.

Редизайн интернет-магазина Binu-Binu

Привет! Мы веб-студия BAR. Мы делаем креативные сайты на Тильда и Вебфлоу: придумываем концепты, дизайним, верстаем, а еще делаем айдентику, иллюстрации и моушн видео для бизнеса. Недавно мы делали редизайн сайта для корейского бренда мыла и аксессуаров Binu-Binu. Рассказываем, как мы переосмыслили бренд и подчеркнули уникальность философии Binu-Binu с помощью дизайна.

Корейский бренд Binu-Binu производит мыло ручной работы и различные аксессуары. Философия бренда основана на глубокой связи с корейскими традициями и культурой, идеей очищения через ритуалы бани.

Исходный сайт был выполнен в простом стиле и имел ряд недостатков — сложная структура, перегруженность информацией, отсутствие фильтров и возможностей персонализации. Это не позволяло полноценно раскрыть особенности и философию бренда Binu-Binu.

Цель нового проекта заключалась в масштабном рестайлинге сайта для повышения узнаваемости бренда, конверсии и лояльности аудитории.

Подготовительный этап

На подготовительном этапе занялись исследовательский работой и собрали доступные материалы об имидже и философии бренда.

Мы проанализировали основных конкурентов нашего проекта. Один из них — интернет-магазин натурального мыла, который позиционирует себя как премиальный бренд, делает акцент на ручной работе и имеет сеть офлайн-магазинов. Еще один конкурент — интернет-магазин, продающий авторское мыло ручной работы по доступным ценам, половину прибыли тратит на благотворительность. Наш проект также позиционируется как премиальный бренд ручной работы, делающий акцент на натуральности и оригинальности продукта. Мы выигрываем у конкурентов более эстетичным дизайном, отражающим философию бренда.

Проанализировали конкурентов
Проанализировали конкурентов

На основе анализа мы разработали информационную архитектуру. Туда мы добавили такие атрибуты товаров, как название, цена, фотографии, описание, категория. Для удобства пользователей предусмотрены фильтрация по категориям и сортировка. В карточке товара отображается название, цена, фото. На странице товара — подробное описание, характеристики, фотографии. И реализовали на сайте перекрестные продажи, показ рекомендуемых и сопутствующих товаров.

Собрали информационную архитектуру
Собрали информационную архитектуру

Разработка функционала

Изначально главная страница включала лишь три блока демонстрации товаров. Теперь она выполняет роль агрегатора, позволяя пользователю ознакомиться с философией бренда и его историей, узнать адреса магазинов, ознакомиться с категориями товаров и увидеть новинки, которые появились на сайте. При необходимости можно перейти на отдельные тематические страницы.

Категории
Категории

Страница «О нас» структурирована — выделены ключевые преимущества бренда, благодаря этому текст читается легче. Добавлена навигация по категориям товаров, фильтрация, сортировка, избранное. Реализован поиск и личный кабинет пользователя, объединена вся информация о товаре на одном экране, так бренду проще делать рассылки и держать покупателей в курсе новых поступлений.

Добавили личный кабинет
Добавили личный кабинет

В оригинальном сайте дополнительная информация о товаре располагалась внизу страницы. Чтобы пользователю не приходилось делать лишних действий для поиска информации о товаре, мы собрали все важные данные в пределах одного экрана.

Карточка товара
Карточка товара

Визуальная концепция

При разработке визуальной концепции для сайта Binu-Binu был проведен анализ типичных решений в индустрии натуральной косметики — пастельные тона, воздушность, сочетание антиквы и гротеска, 2-4 колоночная сетка.

Для того, чтобы сделать проект уникальным, мы собрали большое количество референсов не только интернет-магазинов, но и плакатов, новостных и корпоративных сайтов. Были проанализированы примеры хороших функциональных решений. Такой тип референсов помогает выстроить грамотную систему в макете и сделать сайт удобным для пользователя.

Подбор референсов для проекта
Подбор референсов для проекта

Результат

В итоге мы создали макет, который сочетает в себе удобство, понятность функционала и хорошие стилистические решения — интересную работой с сеткой, композицией, отрицательным пространством. Каждый блок имеет эстетичный дизайн, а цветовая гамма гармонично дополняет контент.

Каталог натурального мыла

Для передачи макета разработчику разработан подробный UI-kit со всеми элементами, выполнены адаптивные версии страниц, добавлены пояснения в комментариях и продумана логика интерактива, чтобы проект был полностью готов к технической реализации.

Адаптивные версии страниц
Адаптивные версии страниц

Если вам понравился наш кейс, и вы хотите, чтобы мы сделали крутой сайт с аналитикой, хорошей конверсии и красивым дизайном — пишите в телеграм. А здесь презентация Bar Agency.

1818
6 комментариев

Очень прикольно сделали =)) а корейские заказчики прямо просили минималистичный дизайн? 0_о насколько я знаю, в Корее и Японии пользователи любят перегруженные информацией сайты, где чёрт ногу сломит - ничего не понятно)))))))))))))) ситуация меняется?

1
Ответить

Спасибо, Кристина! Да — ситуация меняется 😊
Всё больше людей в мире начинают понимать смысл качественного дизайна. Всё больше азиатских брендов отдают предпочтение минимализму. Самые яркие примеры вы знаете:
https://www.muji.eu/uk/
https://www.uniqlo.com/us/en/

2
Ответить

большая работа проделана была ,но результат огонь

1
Ответить

Спасибо! ☺️

Ответить

Узнаю корейский сайт - унылый мрачный цвет и черти какая навигация )))

Ответить