Как мы вдохнули новую жизнь в сайт «РОСМЭН»

Добрый день. Меня зовут Михаил Шрайбман, я — фаундер интегратора «Осьминожка». Моя команда специализируется на разработке web-продуктов, Al и Web 3.0 решениях.

Сегодня я расскажу, как мы разработали стильный сайт для «РОСМЭН», крупнейшего игрока на рынке детских книг и игрушек. Это отразило ребрендинг крупной компании и обеспечило для нее сильную IT-инфраструктуру.

В работе столкнулись со многими вызовами: так, потребовалось создать два независимых товарных раздела. Аудитория проекта включала не только покупателей книг и игрушек, но и партнеров, сотрудников, блогеров. Из статьи вы узнаете, как команда справилась с вызовами, и что в итоге получилось. Приятного прочтения!

«РОСМЭН» работает на рынке уже 30 лет. В этом году компания объявила о ребрендинге, который позволил обновиться бренду визуально и отразил развитие компании.

Бренд сохранил позиции одного из лучших российских издательств и стал крупным игроком на рынке детских товаров и игрушек. В портфеле компании свыше 20 популярных брендов, включая L. O.L, Baby Born, Cry Babies, Bratz, POP MART.

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

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

Полноценно отразить два направления работы — книги и игрушки

В прошлой версии сайта раздел игрушек освещался неполно. Тематические страницы нелогично встраивались в каталог сайта с книгами.

Разработать сайт, учитывающий потребности целевой аудитории бренда:

1) покупатели книг и игрушек разного возраста,

2) русские и международные партнеры,

3) текущие и потенциальные сотрудники компании,

4) авторы и блогеры,

5) производители детских товаров,

6) медиа и широкая общественность.

Организовать бесшовный переезд со старого сайта на новый с точки зрения SEO, сохранив трафик.

В работе над этой продуктовой задачей мы ответили на ряд вопросов:

Специалисты «РОСМЭН» пришли с четким видением сайта с концептуальной и маркетинговой точки зрения, но без понимания, каким ресурс должен быть с технической и визуальной точки зрения.

Мы стали продолжением команды клиента и учитывали в работе не только продуктовую аналитику от «Осьминожки», но и результаты исследования рынка от «РОСМЭН». Изучали, как работают маркетплейсы и сайты конкурентов.

Предложили клиенту обновить ТЗ для сайта, усилив его с технической точки зрения. Проанализировали, каким должен быть сайт, чтобы работать на HR-бренд, привлекать внимание покупателей к товарам и собирать аналитику.

Произошло кратное увеличение числа страниц. Появился карьерный раздел, карточки авторов, видео, раздел для партнеров, раздел «Случайная книга», «Вишлист». Разделы «Игрушки» и «Книги» отличаются по подаче, визуальным акцентам и принципу устройства.

Красочный раздел «Игрушки» со страницами брендов вовлекает пользователя в игру. Раздел «Книги» похож на уютную виртуальную библиотеку, показывающую тематические подборки. Можно листать страницы книг и наслаждаться иллюстрациями.

Английская версия сайта в форме сокращенного варианта для зарубежных b2b клиентов и партнеров отличается по контенту от основной версии.

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

Прямых продаж на сайте нет, ссылки ведут пользователей на маркетплейсы. Можно перейти на страницу «росмэн» и сравнить цены на книги и игрушки.

Сделана нестандартная интеграция с 1С: мы обеспечили выгрузку правил, по которым товары публикуются на сайте. Это зависит от акций, от того, вышел ли товар, или он скоро появится в продаже.

Карточки товаров интегрируются с маркетплейсами (Ozon, WB, Маркет) . Система проставляет ссылку на товары в маркетплейсах и проверяет, есть ли товар. Если он выкуплен, ссылка пропадет.

В карьерном разделе обеспечена интеграция с HeadHunter. API проверяет, есть вакансия на сайте или нет. Контент-менеджеру остаётся включить отображение вакансии.

Новый сайт собирает больше аналитики

Ранее компания теряла часть прибыли, не владея данными по категориям товаров. Аналитика не отслеживалась. На новом сайте можно увидеть ценность отдельных направлений в структуре доходов:

Реализация товара происходит на маркетплейсе. Трудно отследить, с какой страницы пользователь перешел в карточку товара и организовать сквозную аналитику между сайтом и маркетплейсом. Это два независимых контура. Если поставить метки на карточки товаров на тех маркетплейсах, где возможно (например, Ozon) , сотрудники смогут анализировать переходы на сайт.

Обеспечен бесшовный переезд пользователей на новый сайт. Сохранена идентичность ссылок, и сделан редирект на новые страницы. Трафик не просел в сравнении с показателями за прошлый месяц.

Каталог и карточки товаров оформлены, как на маркетплейсе

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

По игрушкам деталей еще больше: персонаж, серия, мультфильм и конкретный сезон, материал. Помогли родителям выбирать подарки детям. Учли, что игрушки ищут по типам (куклы, трансформеры), а не по названиям. Реализован и текстовый, и голосовой поиск.

В карточке товара доступна лента рекомендаций, связанных по смыслу. В 1С каждый товар принадлежит к серии или подборке.

Привлекательный дизайн с учетом обновленного бренда

У сайта сложная логика с т. з. UX/UI. Обеспечили броскую нестандартную подачу разделов и стилизовали страницы под страницы маркетплейсов. Пользователь должен чувствовать связь сайта с площадками, где он делает покупки.

Главный экран выполнен в двух версиях со сложной анимацией:

Главная страница раздела «Книги» сделана с акцентом на подборки и контент типа новостей по теме издательства. Пользователям доступен анимированный ТОП-10 книг. Они могут листать книги и любоваться книжными разворотами. Нажав на кнопку, читатели узнают об издании.

В разделе «Игрушки» сделан акцент на обзоры блогеров. Если нажать на видео, открывается поп-ап с возможностью посмотреть видео прямо на странице. Внимание пользователей привлекают слайдеры с хитами продаж.

Любой бренд можно представить на кастомной странице, оформив ее в конструкторе лендингов:

С помощью административной панели в Bitrix контент-менеджеры могут использовать 15 блоков и на их основе создать кастомное решение под бренд. В итоге в разделе «Игрушки» будут собраны непохожие друг на друга страницы, погружающие пользователей в мир любимых игрушек.

Геймификация обеспечит интерактивный показ продуктов на сайте:

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

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

Что еще интересного есть на сайте:

Сайт соединен с маркетплейсами и привлекательно представляет на рынке оба направления работы компании. Команда проекта может масштабировать проекты и добавлять новые фичи. Новый бренд вшит на страницы сайта и создает правильное впечатление о «РОСМЭН».

Рад отметить, что сотрудничество с командой «РОСМЭН» продолжается. Приятно быть частью прекрасного. Мы помогаем добрым умным книжкам и веселым игрушкам находить тех, кому они нужны.

Хочу сказать большое спасибо команде проекта, благодаря которой этот сайт увидел жизнь, а «РОСМЭН» получили стильный и функциональный портал для коллег, партнеров и клиентов:

Со стороны «РОСМЭН»:

Со стороны «Осьминожки»: