UA

Про проєкт
Bon Bon понад 13 років продає професійну косметику для волосся, обличчя і тіла. У каталозі понад 10 000 товарів від 45+ брендів, серед них Keune, Paul Mitchell, Kemon і Subtil. Купують роздрібні покупці, а також майстри, салони й оптові партнери.
Основний виклик: у Bon Bon не було брендбука, що гальмувало масштабування, при цьому новий сайт мав зняти частину запитів з менеджерів і підготувати магазин до виходу на ринок ЄС.
Задачі
- Оновити логотип і створити фірмовий стиль.
- Спростити навігацію і структуру каталогу.
- Зробити розумний пошук і зручні фільтри.
- Додати на картку товару відгуки, спосіб застосування, склад, наявність і строки доставки.
- Спростити оформлення замовлення і закласти доставку за кордон.
- Закласти програму лояльності і механіку подарунків до замовлення.
- Розділити умови для роздрібних покупців і професіоналів.

Брендинг
Розробили новий логотип: напис і емблему, побудовану з літер назви бренду. Натхненням для дизайнерів стали хвилі волосся і стрічки, якими їх перев'язують.



Розглянули п'ять колірних варіантів і зупинилися на рожевій палітрі з пудровим, кремовим і лавандовим.

Створили UI-дизайн-систему з описом усіх станів елементів: типографіка, кнопки, поля, перемикачі, таби, іконки. Вона пришвидшує розробку і дозволяє додавати нові сторінки без втрати стилістики.
.png)
Головна і навігація
Спроєктували багаторівневе меню каталогу з окремими входами в «Бренди» і «Акції», на mobile меню відкривається покроково. На головній квіз «Знайди свій ідеальний засіб» підбирає догляд за типом шкіри чи кольором волосся і зберігає результат як beauty-код.




Пошук і каталог
Пошук підказує під час введення і показує результати із сортуванням. У каталозі покрокові фільтри на mobile, бренди «популярні + за алфавітом», теги обраних фільтрів і поп-ап «Повідомити про наявність».

.png)

.png)
No items found.
Картка товару
На картці зібрали галерею, наявність, рейтинг, вибір об'єму, активні інгредієнти, умови доставки й оплати. Додали підписку на регулярну доставку, розстрочку, бонуси за покупку і блок «Разом дешевше».

.png)
Кошик і чекаут
У кошику шкала до безкоштовної доставки і вибір подарунка до замовлення. У чекауті вибір відділення Нової пошти на карті, доставка за кордон, оплата частинами, сертифікати, промокоди і оплата бонусами.
.png)

.png)
Особистий кабінет і лояльність
У кабінеті замовлення з ТТН, обране, відгуки з фото, бонуси «Бонбонуси», керування підписками і запис на консультацію. Для майстрів і салонів проф. товари відкриваються після реєстрації як партнер.



Результати
- Розробили візуальний стиль бренду: логотип, колірну палітру та фірмові елементи.
- Створили дизайн-систему: UI Guide та бібліотеку компонентів для подальшого розвитку магазину.
- Розробили новий UX/UI-дизайн ключових сторінок: головної, каталогу з пошуком і фільтрами, картки товару, кошика й оформлення замовлення.
- Опрацювали сторінки додаткових можливостей для продажів: програму лояльності, підбір догляду через квіз beauty-коду, подарунки до замовлень та окремі умови для професійних покупців.
- Заклали в дизайн можливості для масштабування: міжнародну доставку та вихід на нові ринки.
- Дизайн реалізувала команда Linecore
