Как мы обновили интернет-магазин Dantone Home: редизайн и выход на международный рынок
- Заказчик
- Dantone Home — российский бренд мебели и предметов интерьера. Компания имеет своё производство, поэтому покупатели могут кастомизировать выбранные модели, заказать индивидуально разработанные для них.
- Задача
- С 2014 года компания выросла и трансформировалась, прежний сайт перестал отражать стиль бренда. Команда Dantone обратилась к нам за аудитом, редизайном и техническим обновлением интернет-магазина.
О компании
Dantone Home — российский бренд мебели и предметов интерьера. В каталогах компании можно найти образцы современной классики, mid-century, ар-деко и contemporary, но выбор не ограничивается готовыми вариантами. У Dantone Home своё производство, поэтому покупатели могут кастомизировать выбранные модели, заказать индивидуально разработанные для них кухни или гардеробные.
В эко-систему бренда также входят Dantone Design Buro и B2B направление Dantone Contract, предлагающее решения по комплектации жилых домов и коммерческих пространств — офисов, ресторанов, отелей, апартаментов. Среди партнёров бренда — Hilton, Ibis, Holiday Inn, Mercure.
Шоурумы компании расположены в восьми городах России, а в 2022 году Dantone Home вышли на международный рынок и открыли шоурум в Дубае. Компания выросла и трансформировалась — прежний сайт перестал отражать стиль бренда, поэтому команда Dantone Home обратилась к нам за аудитом и редизайном интернет-магазина.
Какие задачи решали
Бренд Dantone Home — синтез классики и contemporary, дизайнерских элементов и уюта. У компании уже был сформирован фирменный стиль. Нашей задачей было придать современный вид сайту, поддерживая целостность бренда.
Кроме этого, нужно было обновить техническую часть. Архитектура интернет-магазина не позволяла масштабировать его под новые задачи, а контент не отражал всех особенностей бренда.
До сотрудничества с ONY у нас был неплохо работающий интернет-магазин с ограниченным функционалом. Он не был адаптирован для дальнейшего масштабирования, нельзя было выбрать товар в конкретном цвете. Все проекты и лендинги отличались по дизайну и управлялись в разных админках, а раздел «Новости» был очень примитивным по функционалу и визуальному оформлению.
Марат Михтифидинов Руководитель интернет-магазина Dantone Home
Вместе с командой Dantone Home мы провели дизайн-аудит бренда, чтобы выделить основные направления работы:
Сделать современный дизайн, сохранив фирменный стиль, особенности и дух бренда. Расширить функциональность сайта: сделать гибкую архитектуру и удобную навигацию по направлениям, а также добавить конструктор, который поможет клиенту менять сайт под свои задачи. Как доработали визуальную часть Работу над дизайном мы начали с самого большого направления Home – мебель и аксессуары для дома. Так как стиль Dantone Home — традиционный и респектабельный, в первом варианте дизайна мы ушли в журнальную концепцию. Однако она не отражала ещё одну важную черту бренда — уют. Несмотря на то, что интерьеры компании сдержанные, они не кажутся холодными и бездушными.
Тогда мы решили сместить акцент на продуманные и красивые фотографии интерьеров, которые уже были у Dantone Home. Они наглядно демонстрируют, как строгие формы могут гармонично вписываться в уютное жилое пространство.
Чтобы не зашумлять фотографии, текст на баннерах сделали кратким и ёмким. В итоге получилась слегка швейцарская вёрстка, разбавленная большим количеством изображений, которые отражают особенность бренда.
Чтобы подчеркнуть ноты нео-классики, выбрали антиквенный шрифт William в паре с рубленным Futura New.
Особое внимание мы уделили карточкам товара. Так как Dantone Home продают мебель в премиальном ценовом сегменте, клиенты часто приезжают в шоурумы, чтобы посмотреть образцы.
Задача была оформить карточку товара так, чтобы через сайт человек мог в подробностях рассмотреть все аспекты мебели: ткань, фурнитуру, материалы, размер. Нам было сложно понять, на что целевая аудитория обращает внимание больше, а на что — меньше, поэтому мы провели интервью с покупателями. В том числе, с дизайнерами, которые часто покупают мебель под заказ.
Саша Бородин
Digital Designer в ONY
В первую очередь целевой аудитории было важно видеть:
мебель на белом, изолированном фоне, чтобы можно было быстро вырезать объект и добавить в свой проект; размеры мебели и ткань; сроки доставки.
А ещё у компании есть два способа доставки и четыре способа оплаты, о которых тоже нужно было рассказать.
Было сложно собрать все особенности и не перегрузить карточку, поэтому сначала у нас получился очень громоздкий макет. Чтобы его облегчить, мы изучили подходы разных маркетплейсов. В итоге разделили информацию на слои, стало намного проще и лаконичнее.
Саша Бородин
Digital Designer в ONY
Блоки про доставку, оплату, гарантию и рассрочку оформили модальными окнами. Они позволяют быстро просмотреть важную информацию, не переключаясь между страницами. Когда пользователь добавляет товар в корзину, она также открывается в формате модального окна. Там покупателю предлагаются сопутствующие товары, которые он может добавить к своему заказу.
Большая доля коммуникации бренда с клиентами происходит через блог, который Dantone Home активно ведут. На прежнем сайте уже была большая база статей. Мы разобрали их и упаковали в современный вид.
Оформление блога получилось простым, но визуально насыщенным. Мы добавили теги и страницу подписки, а внутрь статей — конструктор, чтобы клиент мог сам выстраивать структуру. Например, дополнять текст галереей фотографий или блоком с разделами товаров.
Конструктор есть не только в блоге, но и в других разделах. С помощью него клиент может добавлять страницы на сайт без помощи разработчиков, например, создавать лендинги для новых услуг.
Кроме направления Home, у компании есть ещё три: Kitchen — мебель для кухни, Contract — мебель для бизнеса, Buro — дизайн-проекты. Мы структурировали эти направления в единое меню, чтобы пользователь мог легко переключаться между ними.
Что сделали в технической части
Мы сразу выбрали сложный технологический стек — фреймворк Laravel и отдельный фронтенд, который может работать на другом сервере и взаимодействовать с бэкендом через API. Благодаря этому мы к бэкенду можем наращивать большое количество контента. Это позволяет компании масштабироваться — в короткий срок запустить дополнительный сайт в другом регионе. Например, благодаря такому стеку мы быстро создали англоязычную версию сайта для шоурума в Дубае.
А ещё такая архитектура открывает возможность для подключения других фронтендов. Например, если компания решит запустить мобильное приложение, то сможет сделать его в связке с интернет-магазином и какой-нибудь программой лояльности — всё это будет работать на одном и том же бэкенде.
Такой подход экономит бюджет компании. Нужно поддерживать только один бэкенд (вместо четырёх), который работает со всеми необходимыми ему фронтендами.
Технические элементы, которые добавили на сайт:
Единую админ-панель на основе CMS Laravel Nova для всех направлений компании: русскоязычной и англоязычной версий сайта по продажам мебели для дома, страницы по продаже кухонь, сайта по комплектации отелей и ресторанов. Благодаря этому управлять контентом стало быстрее и проще. Также сделали разделение ролей в бэк-офисе на администратора и менеджера магазина. Конструктор лендингов. Сейчас Dantone Home используют его только для блога, но при необходимости могут создавать новые посадочные страницы внутри сайта без привлечения разработчиков. Это поможет компании сэкономить бюджет на дизайне и разработке. 3D-модели мебели в карточки товаров. Они передаются на сайт посредством технологии CDN. Файлы с моделями весят много, а CDN позволяет им быстро загружаться и отображаться в карточке. Авторесайз. Размер видео, изображений и картинок автоматически подстраивается под экран устройства. Интеграция с Битрикс24. Когда покупатель оставляет заявку на сайте, формируется лид в Битрикс24. Это помогает отделу продаж быстро обрабатывать заявки с сайта. 
Какой результат у нас получился
После проделанной работы мы получили современный сайт с обновленным дизайном. Теперь мы можем самостоятельно и оперативно создавать лендинги под разные задачи. Раздел «Новости» превратился в полноценный блог с интересным оформлением и продвинутыми возможностями конструктора.
Марат Михтифидинов Руководитель интернет-магазина Dantone Home
Результаты в течение года после запуска новой версии сайта:
Что дальше Мы продолжаем сотрудничать с брендом и внедрять новый функционал. Например, в планах:
добавить возможность кастомизации мебели в карточку: выбор материалов, фурнитуры, комплектации; сделать интеграцию с сервисами доставки и сервисом по работе с программой лояльности; настроить геозависимый контент — когда компьютер автоматически определяет местоположение пользователя, и в зависимости от локации показывает определённый контент, например, разный ассортимент товаров по регионам. С самого начала работы с Dantone Home мы придерживались подхода MVP с последующим масштабированием. Было придумано и отрисовано множество деталей и функций, на реализацию которых требуется время. Чтобы не растягивать релиз на много лет, год назад мы запустили первую версию сайта, а сейчас продолжаем доделывать крупные блоки и работаем над масштабированием компании в формате техподдержки.