Редизайн сайта для торговой сети Командор (Kopilkago.ru) и верстка на Next.js

«Командор» — красноярский ритейл-холдинг и крупнейшая торговая сеть Восточной Сибири. Компания входит в РБК-ТОП-500 крупнейших по выручке и объему реализации продукции (RAEX-600) компаний России, а также в ТОП-100 ведущих ритейлеров страны по версии INFOLine. Сеть объединяет несколько брендов и развивает единую цифровую экосистему, изначально запущенную как программа лояльности «Копилка». В рамках этого направления формировалась и онлайн-платформа. Наша команда подключилась к проекту, когда онлайн-часть уже находилась в разработке. Сервис выполнял базовые функции, но пользовательские сценарии работали нестабильно, интерфейс был перегружен, а часть архитектуры мешала пользователям пройти ключевые этапы покупки.

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

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

Мы начали с разработки обновленной дизайн-концепции. На ее основе собрали библиотеку компонентов: кнопки, поля ввода, состояния элементов и так далее. Таким образом мы смогли задать единый визуальный язык и упростить дальнейшее развитие продукта.

Далее переработали ключевые пользовательские сценарии.

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

• Авторизация и регистрация. Были устранены технические и логические проблемы при входе в сервис — процесс стал быстрее и понятнее.

• Выбор города и магазина. Появилась более прозрачная логика выбора локации. Пользователь сразу видит, из какого магазина сети — «Командор», «Аллея» или «Хороший» — он оформляет заказ и какие условия доставки или самовывоза для него доступны.

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

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

Мы провели анализ пользовательского опыта сайта и переработали ключевые сценарии взаимодействия с сервисом.

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

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