Обновленный интернет-магазин METRO: единая платформа вместо разрозненных сценариев

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

Исторически цифровая среда бренда росла не как единая платформа, а как набор отдельных решений под разные задачи. В итоге пользовательские сценарии оказались распределены по нескольким ресурсам, а логика переходов между ними была неочевидной. Пользователь мог прийти из поиска, попасть не на тот сайт, увидеть нерелевантные цены или сценарии и уйти. Особенно это касалось B2B-сегмента: бизнес-пользователь, уже работающий с METRO, мог попасть не в свой контур и потеряться в B2C-интерфейсе.

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

Перед командой АЭРО стояла задача пересобрать платформу: объединить сценарии, упростить навигацию и сделать так, чтобы любой пользователь — вне зависимости от сегмента — быстро попадал в нужный ему путь.

1. Новая логика платформы

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

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

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

2. От страниц к сценариям

По итогам первого этапа была собрана карта jobs-to-be-done — список задач, которые пользователи пытаются решить, и проблем, с которыми они сталкиваются. На ее основе переработали UX: определили ключевые сценарии для разных сегментов, сократили путь до целевых действий, выстроили понятные точки входа и задали логику переходов между разделами.

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

3. Визуальный язык и сегментация

Следующим шагом стало переосмысление визуальной коммуникации. На рынке e-commerce интерфейсы часто выглядят одинаково: баннеры, карточки товаров, акции. Это во многом связано с тем, что в сложных продуктах основной фокус сначала направлен на логику и удобство, а не на визуальную часть.

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

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

Это не только усилило визуальную часть, но и ускорило дальнейшую реализацию и развитие продукта без лишних ошибок.

4. Контент как инструмент продажи

Одним из ключевых и самых экспериментальных продуктовых решений стало внедрение нового контентного формата в e-commerce.

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

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

Компания METRO получила обновленную цифровую платформу, которая стала единой точкой входа в экосистему. Проект помог связать между собой разные пользовательские сценарии — от B2C-покупок до сложных B2B-процессов. Логика взаимодействия стала прозрачной, а сами сценарии — структурированными и понятными. 

Изменения напрямую отразились на метриках:

- после запуска сайт стал полноценным драйвером трафика в e-commerce — рост составил 64% 

- органический трафик из поисковых систем вырос на 183% 

- глубина просмотра увеличилась более чем в два раза — с 7 до 14,5 страниц за визит

- время на сайте выросло почти вдвое — с 6,8 до 12,5 минут

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