NAOS: перезапуск d2c интернет‑магазина бьюти‑брендов

NAOS — французская косметическая компания с 100% производством во Франции и единым научным подходом к уходу за кожей. В портфель NAOS входят три бренда: BIODERMA, Institut Esthederm и Etat Pur — от клинически ориентированного ухода до премиального и персонализированного.

Требовалось обновить интернет-магазин NAOS: существующее решение имело устаревший UI, не соответствовало современным UX-паттернам и накладывало технологические ограничения на развитие продукта.

Перед командой стояли задачи:

- повысить удобство и конверсионность пользовательских сценариев;

- устранить точки трения в ключевых шагах покупки;

- переосмыслить навигацию и каталог с точки зрения реальных пользовательских задач;

- объединить три бренда в единую цифровую экосистему, сохранив их индивидуальность;

- заложить технологическую основу для масштабирования.

В рамках реплатформинга реализован headless-подход на связке Magento + React.

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

Интеграции:

- 1С — ERP и источник мастер-данных по ценам, остаткам и товарам;

- Mindbox — персонализация, скидки и триггерные коммуникации;

- AnyQuery — быстрый поиск с устойчивостью к опечаткам;

- Мир лечебной косметики (MLK) — фулфилмент и доставка;

- Ю.Kassa и Яндекс Сплит — платежи и рассрочка;

- DaData — автозаполнение и валидация адресов.

Архитектура спроектирована с запасом по производительности и готова к масштабированию.

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

Сессии пользовательского тестирования «под запись» проходили в специализированной среде Fabuza и охватывали основные сценарии: поиск, диагностику, изучение лояльности, добавление в корзину и оформление заказа.

Ключевым инсайтом стало то, что каталог, построенный по логике «сначала бренд», запутывал пользователей — людям удобнее начинать путь с задачи кожи.

Дополнительно фокус-группа отметила:

- перегруженную навигацию;

- недостаток доказательной базы в карточках товаров;

- нехватку социального подтверждения и UGC-контента;

- необходимость структурировать образовательный контент по медицинским принципам.

После проработки пользовательских сценариев команда перешла к визуалу. Ключевой задачей стало объединение BIODERMA, Etat Pur и Institut Esthederm в единую экосистему NAOS без потери характера каждого бренда и с соблюдением глобальных бренд-гайдлайнов.

Смысловым якорем стала медицинская экспертиза:

- чистая, строгая и минималистичная палитра;

- преобладание белого и светлых акцентов;

- отсутствие визуального шума;

- сдержанная, легко читаемая типографика;

- упрощённая навигация, в которой интерфейс сам ведёт пользователя к следующему шагу.

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

На основе инсайтов команда приняла ряд принципиальных решений:

- Каталог: от brand-first к need-first. Пользователь начинает путь с выбора потребности кожи и получает подборку средств от всех брендов NAOS.

- «Подобрать уход». Короткий опросник из четырёх вопросов формирует персональную рутину ухода с возможностью дальнейшей донастройки через фильтры.

- Карточка товара как центр информации. В карточках появились рейтинги, отзывы с фото, блок «вопрос–ответ», экспертные видео и отображение баллов лояльности. Это повысило доверие, усилило UGC и снизило нагрузку на поддержку.

- Навигация по брендам. Кликабельные лейблы в карточках товаров позволяют быстро переходить к линейкам BIODERMA, Etat Pur и Institut Esthederm, усиливая кросс-продажи.

- Корзина. Информер «осталось до подарка» мотивирует пользователей добирать заказ до нужной суммы.

- Контент. Запущен журнал «О коже» с медицинским рубрикатором (атопический дерматит, розацеа, пигментация и др.), разделами «Новости» и «Видео с экспертами».

- Личный кабинет. Реализованы гибкие настройки подписок и каналов коммуникации, что позволило очистить базу и повысить релевантность рассылок.

- Интернет-магазин получил современный UX, основанный на реальных пользовательских инсайтах. 

- Каталог и навигация стали ориентированы на задачи кожи, а не на внутреннюю логику брендов.

- Карточка товара превратилась в ключевую точку доверия и принятия решения.

- Усилены кросс-продажи и вовлечённость за счёт персонализации и контента.

- Заложена масштабируемая технологическая и дизайн-основа для дальнейшего развития e-commerce NAOS.