Редизайн интернет-магазина итальянской плитки: конверсия выросла на 18%
- Конверсия 0,58% при 7000 визитов — владелец платил за трафик, который не превращался в заказы.
- Готовый шаблон не был рассчитан на продажу плитки: описание занимало место, которое должна занимать фотография.
- 90% посетителей не пользовались фильтром товаров — навигация не совпадала с тем, как покупатель ищет плитку.
- 40% заходов приходилось на телефоны, а отдельной мобильной версии не было.
- Категории дублировали друг друга: покупателю была непонятна разница между «напольной плиткой» и «плиткой для пола».
Мы начали не с макетов, а с аудита: карты кликов в Яндекс.Метрике и опрос менеджеров магазина показали три разных сценария покупки. Под них пересобрали структуру каталога и порядок блоков на главной, затем нарисовали прототипы и дизайн — отдельно для desktop- и мобильной версии. Фотография плитки заняла всю ширину экрана, характеристики ушли во всплывающее окно. Перенос на новый дизайн сделали ночью, со старой копией наготове, чтобы магазин ни минуты не стоял.
Работу начали с аудита текущего сайта и опроса менеджеров магазина. Карты кликов показали картину, которая не совпадала с логикой шаблона: 70% визитов приходится на главную и страницы коллекций, 15% покупателей ищут плитку по артикулу через поиск, а фильтром не пользуются 90% посетителей. При этом посетители кликали по фотографиям — пытались рассмотреть плитку, а размер изображений этого не позволял. Мобильные посетители, а это 40% трафика, вели себя так же, как посетители с компьютера: пролистывали все фотографии до одной.
По результатам аудита покупатели разделились на три группы: одни начинают визит с главной или страницы категории, другие приходят за конкретным брендом или коллекцией и точно знают, что хотят, третьи ищут товар по артикулу через поиск. Шаблонный дизайн обслуживал только первую группу. Новый должен был работать для всех трёх — это и стало главным требованием к прототипу.
Перед разработкой прототипа мы разобрали сайты конкурентов и свели находки в короткий список требований: фотография получает приоритет над текстом, потому что покупатель хочет увидеть будущую ванную или кухню; изображение плитки показывается во всю ширину экрана; характеристики убираются во всплывающее окно как вторичная информация; верхняя часть страницы проектируется заново; мобильная версия рисуется отдельно, а не сжимается из desktop-версии.
Задача главной — довести покупателя до нужной коллекции за минимум шагов. Мы пересмотрели категории: например, из каталога ушло дублирование «напольная плитка» и «плитка для пола». По картам кликов определили, что покупатели ищут чаще всего, и выстроили блоки в порядке спроса: категории, бренды, коллекции, акции, информация о магазине.
После согласования прототипа нарисовали главную и страницу каталога. Заранее предусмотрели все всплывающие окна и активные состояния элементов, показали, как они раскрываются по клику, — чтобы разработчикам не пришлось додумывать поведение интерфейса. Дизайн интернет-магазина занял неделю.
Мобильную версию проектировали как самостоятельный интерфейс. Фотография коллекции занимает весь экран, под ней — карточка с фабрикой, наличием и датой обновления склада, кнопка скачивания PDF и условия доставки. Кнопка расчёта закреплена внизу, чтобы покупатель мог оставить заявку с любого места страницы.
Действующий сайт продолжал приводить клиентов, поэтому вёрстку и программирование вели на отдельном сервере для разработки. Новую версию проверили целиком и перенесли ночью, в часы минимального трафика. Старую копию оставили на сервере, чтобы в любой момент вернуться к ней за минуты. Переключение прошло без простоя магазина.
- Конверсия выросла с 0,58% до 0,68% — на 18% относительно прежнего уровня.
- Глубина просмотра страниц выросла на 30%.
- Отказы сократились на 22%.
- Время на сайте увеличилось на 5%.
- Мобильная версия спроектирована отдельно — под 40% трафика с телефонов.
- Переход на новый дизайн прошёл ночью, без остановки продаж и с возможностью мгновенного отката.
технологий