По-моему, вам пора освежиться

Как и зачем мы делали редизайн сайта Divan.ru

В августе наш новый сайт (релиз состоялся в январе 2022 года) победил в конкурсе «Рейтинг рунета». Рассказываем, как мы работали над новым сайтом и, главное, зачем, если и предыдущий продавал.

По-моему, вам пора освежиться

Зачем интернет-магазину редизайн

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

Наш предыдущий сайт сделан московским агентством «Супрематика» в 2017 году. Для своего времени он был свежим и новаторским. Например, меню сайта было не горизонтальным, а вертикальным. Никто из крупных мебельщиков не использовал такой UX, но потом его применил и Hoff, и остальные.

Вертикальное меню стало мейнстримом для ритейлеров, однако в 2017 году такой UX смотрелся свежо
Вертикальное меню стало мейнстримом для ритейлеров, однако в 2017 году такой UX смотрелся свежо

Мы не могли себе позволить быть как все, и чтобы снова подкрепить свой имидж дизайнерской компании, приняли решение обновить сайт. Роста конверсии после релиза не произошло. Главная причина обновления сайта — проявление амбиций. Мы считаем, что этого достаточно.

Что такое концепция Product First

С самого начала мы всегда ориентировались на британский мебельный проект Made.com и заимствовали у него много с точки зрения продуктовой концепции. В какой-то момент он сделал редизайн сайта, и он нам вначале не понравился, а потом мы прониклись.

Специфика дизайна Made.com — максимальный фокус на продукте. Там минимум элементов интерфейса — всех этих «палочек», «полосочек» и крупные продуктовые карточки. Задача крупным планом показать продукт (диван или другой предмет мебели), чтобы посетитель сайта получил как можно более реалистичное представление о нем без посещения шоу-рума.

Название этого стиля, Product First, мы придумали сами, для внутреннего употребления. Стиль характеризуется вниманием на продукте и обилием свободного пространства вокруг.

Если говорить не просто о дизайне, но и о маркетинге в целом, то в центре нашего внимания даже не продукт, а пользовательский опыт взаимодействия с ним, который возможно получить и на сайте. Хороший пример – технология компании Zeekit, недавно реализованная в приложении Choose my model от Walmart. Пользователи выбирают изображения моделей, схожего с ними телосложения, и «примеряют» на них одежду, чтобы увидеть, как она сядет на них в реальности.

3D-визаулизация - единственный элемент сайта, который мы не делаем сами. Хорошо, что есть Cylindo
3D-визаулизация - единственный элемент сайта, который мы не делаем сами. Хорошо, что есть Cylindo

На нашем сайте похожая идея работает на основе платформы 3D-визуализации изображений Cylindo. В карточке товара на диван можно «примерить» разные виды обивки и детально осмотреть его со всех сторон (кстати, мы единственные в России, кто работает с Cylindo).

Как ускорить разработку

В работе над сайтом принимали участие две команды — агентство «Супрематика» и наши разработчики. «Супрематика» разработала новый стиль на примере десяти ключевых страниц. Наши разработчики отрисовали остальные 40 типов страниц, шаблонных и уникальных.

В команде агентства было четверо: дизайнер, менеджер и, подключавшиеся время от времени, руководитель по работе с клиентами и основатель агентства Владимир Лифанов. С нашей стороны - три дизайнера, по два бэкенд, два фронденд-разработчика и тимлид.

Когда мы поняли, что срываем сроки (открытие было запланировано к новому году), мы наняли команду программистов на аутсорсе, но это не сработало. На согласования и верификацию кода уходило столько времени, что проще было обойтись своими силами.

Для составления дорожной карты подойдут Miro, Notion, диаграммы Ганта или, как в нашем случае, Google Таблицы
Для составления дорожной карты подойдут Miro, Notion, диаграммы Ганта или, как в нашем случае, Google Таблицы

Что нам по-настоящему помогло, так это составление дорожной карты. Без лишних слов, по ссылке подробная инструкция от Андрея Логинова, руководителя продуктового маркетинга Divan.ru.

Какая польза от конкурсов

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

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

Награды помогают нам получать объективную оценку дизайнерского сообщества и поддерживать имидж
Награды помогают нам получать объективную оценку дизайнерского сообщества и поддерживать имидж

«Рейтинг рунета» был задуман как конкурс дизайн-агентств. Победа в нем влияла на место в одноименном рейтинге. Но со временем заявки на участие в «Рейтинге Рунета» стали подавать и компании, которые делали сайт «инхаус». При этом заявок от профессиональных участников рынка по-прежнему много, и в жюри тоже сидят профессионалы: руководители агентств, креативные и арт-директора и маркетологи из компаний, победивших в конкурсах прошлых лет.

Таким образом, побеждая в конкурсе, мы понимаем, что наша команда работает не хуже дизайн-агентства. По словам основателя «Рейтинга Рунета» Анатолия Денисова, мы укладываемся в тренд. Уровень корпоративных разработчиков и агентств сейчас сравнялся, с поправкой на то, что агентства сильнее в дизайне, а компании — в интерфейсе.

44
Начать дискуссию