ADPASS рекомендует материал к прочтению
MediaNation
24.10.2022, 12:00

Провели редизайн сайта и увеличили глубину просмотра — кейс MediaNation и КухниСити

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

О клиенте

КухниСити — сеть фирменных салонов производителя высококачественных кухонь, гостиных, гардеробных и другой мебели. Компания на рынке с 1999 года и насчитывает 23 салона — 22 в Москве и один в Казани. В 2021 году компания обратилась в агентство MediaNation за редизайном официального сайта.

Проблема

Прежний сайт клиента имел ряд неудобств, которые нам предстояло устранить:

  • сложная фильтрация товаров;

  • запутанная внутренняя структура карточек и неудобная галерея фото для просмотра товара с разных сторон;

  • недостаточное информационное наполнение некоторых разделов;

  • неудобная верстка главной страницы;

  • неадаптированность сайта для просмотра с мобильных устройств и планшетов;

  • сложный интерфейс управления контентом сайта;

  • размещение SEO-текстов по стилям (размеры, заголовки шрифты) отсутствовало;

  • нелогичное раскрытие меню второго уровня.

Задачи

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

  • провести редизайн: улучшить функционал и верстку десктопной версии;

  • увеличить скорость загрузки страниц;

  • адаптировать сайт под разные устройства.

Ход работ

Сложно сконвертировать каждого посетителя сайта в покупателя, но вполне возможно сделать пользователя на шаг ближе к покупке. Для этого мы разделили посетителей сайта по сценариям поведения на 3 категории:

Мы выбрали именно эти три категории пользователя, потому что они отвечают популярной маркетинговой методологи Customer Journey Map. Согласно CJM, любой пользователь, независимо от потребности и социально-демографических характеристик, проходит на пути к сделке несколько этапов:

  • Первичное осмысление.

  • Активная оценка.

  • Фаза сделки.

  • Опыт от сделки.

  • Формирование лояльности и стремление повторить сделку.

Первые три этапа коррелируют с выбранными нами сегментами целевой аудитории:

  • пользователь размышляет о выборе товара;

  • готов оформить сделку, но выбирает между несколькими предложениями;

  • готов совершить сделку, но для этого ему нужно посмотреть товар «вживую».

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

Поскольку среда высококонкурентная, нам было важно соблюсти баланс между оригинальностью и соответствием стандартам*, так как мы не могли уделить внимание только запоминаемости, например, и жертвовать удобством пользования.

* Эти стандарты-клише мы определили по итогам исследования сайтов компаний-конкурентов и опроса целевой аудитории «Что должно обязательно присутствовать на сайте мебельной компании?»

Верстка сайта

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

Добавили в хедер возможность выбрать город — Москву или Казань. С новым функционалом демонстрация товаров будет перестроена в зависимости от выбора города.

На странице «Адреса салонов» сделали подробный список салонов — с адресами, часами работы и большой интерактивной картой.

Также добавили кнопку «Записаться в салон» с формой для сбора контактных данных.

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

Подготовили страницу «Архитекторам и дизайнерам» для людей, которые хотят сотрудничать с мебельной сетью. Большинство крупных сетей прячут подобные разделы в подвал или не выкладывают вовсе — это большая ошибка. Задача страницы — не только привлечь внимание дизайнеров, но и показать скептически настроенным к компании пользователям, что сеть сотрудничает только с лучшими специалистами.

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

Таким образом, помимо заинтересованных в покупке пользователей, мы удовлетворили спрос сегмента ЦА, которые хотели бы ознакомиться с компанией или начать сотрудничество.

Главная страница

На первый экран мы поместили карусель с УТП, которые может менять сам владелец сайта.

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

Также на первом экране главной страницы пользователя встречает человек.

Только на следующем слайде в карусели появляется интерьер.

Далее в своей работе мы сделали акцент на комбинации эмоциональных и рациональных информационных блоков. Речь все еще идет об удержании внимания пользователя: вначале мы говорим о наших преимуществах (УТП — эмоциональный блок), потом показываем пользователю акции (говорим о выгоде — рациональный блок). Затем портфолио размещаем портфолио с работами (задействуем эмоции, показываем желанный товар), а потом снова рациональный блок — «Лучшая цена». Именно так мы строим продающую, а не просто информационную страницу.

Портфолио на главной странице — это «анонс», или «тизер» каталога. Мы поделили его на:

  • Новинки.

  • Лучшие предложения со скидкой.

  • Акции.

Под блоком с портфолио — информация о принципах работы компании: подход к работе, этапы сделки, преимущества и т.д. Финальной нотой в аккорде эмоциональных блоков стал блок с видеоотзывами покупателей.

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

Каталог товаров

При добавлении каталога в хедер мы придерживались принципа вложенности. Так мы сэкономили место на сайте и сократили путь пользователя к нужной товарной категории — такой метод структурирования информации делает прозрачным путь поиска и усиливает доверие к продавцу.

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

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

Далее на странице добавили лид-магнит — бесплатный 3D-проект с личным дизайнером. Такой почти уникальный в своей нише способ взаимодействия позволяет работать с сомневающимся клиентом и с большей вероятностью убедить его в покупке нужного товара именно в этой компании.

Чтобы у пользователей не оставалось вопросов, а отдел продаж занимался только продажами, мы подготовили раздел FAQ с ответами на вопросы.

Все дополнительные страницы вынесли в футер.

Адаптивность

Одной из главных проблем сайта была адаптированная под различный устройства верстка сайта. Мы разработали 5 адаптаций, и теперь сайт удобен в использовании как в десктопной версии, так и на мобильном устройстве или планшете.

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

SEO

Начинать работу над сайтом — будь то создание или редизайн — всегда лучше с ТЗ от SEO-специалиста. При совместной работе с SEO-отделом MediaNation нам удалось вывести большинство страниц сайта в «зеленую зону» — оптимизировать скорость их загрузки от 80% по меркам сервиса PageSpeed Insights от Google.

Что получил клиент?

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

Вам понравится

Иностудио
09.04.2024
Проще простого
30.03.2024
Логомашина
27.03.2024
Проще простого
18.03.2024
Как сделать спецпроект
в ВК мессенджере?