Стадион ПРО

Разработка интернет-магазина на 10 000 sku.

Дизайн-макеты в Figma

Смотреть подробнее

Дизайн-система в Figma

Смотреть подробнее
О проекте
«Стадион ПРО» — это интернет-магазин спортивных товаров с широким ассортиментом: от профессиональной экипировки до стильной одежды для фитнеса.
Весной 2024 года к нам обратился владелец офлайн-точки спортивных товаров. До этого он уже имел небольшой сайт на Tilda, через который осуществлялись онлайн-продажи, однако из-за ограниченных возможностей и отсутствия развитого функционала сайт не мог масштабироваться под растущие потребности бизнеса.
Задача
Заказчик поставил задачу — создать крупный федеральный интернет-магазин «Стадион ПРО» с каталогом более 10 000 товаров, охватывающим различные виды спорта и объединить все каналы взаимодействия с клиентом в единую цепочку, то есть перейти к омниканальности.
Он хотел, чтобы новый магазин был сопоставим по уровню с крупными игроками рынка, такими как «Спортмастер», Кант», «Декатлон», «Триал-спорт».
Проектирование и аналитика
Совместно с командой клиента мы спроектировали архитектуру интернет магазина.
При проектировании мы учитывали большой каталог товаров (163 разделов), интеграции с сервисами доставки, оплаты, СМС-оповещения.
Распределили пользователей по ролям: посетители, покупатели, администраторы. Каждая роль обладает разными уровнями доступа и ограничениями.
Прямые конкуренты
Спортмастер
Кант
Триал-спорт
Декатлон
Cхожие по функционалу
Lamoda
Золотое яблоко
ВсеИнструменты
Анализ конкурентов
Я проанализировал прямых конкурентов и сайты со схожими механизмами выбор товара и оформление заказа, выделив их преимущества и недостатки.
Навигация и визуальная ясность
Конкуренты стремятся минимизировать когнитивную нагрузку и упростить путь пользователя:
  • Трёхколоночные меню с визуальными иконками помогают быстро переходить от категории к бренду.
  • В карточках товаров размещены быстрые ссылки на подкатегории и бренды.
  • Пользователь может выбрать цвет и размер прямо в каталоге без перехода в карточку.
  • Фильтры интуитивны: результаты обновляются автоматически, а активные фильтры вынесены в отдельную зону «Ваш выбор».
Каталог и листинг
Каталог адаптируется под разные предпочтения и сценарии использования:
  • Пользователь может менять вид каталога (сеткой или крупными карточками).
  • Система показывает количество найденных товаров и наличие в конкретных магазинах.
  • Отображаются недавние и популярные поиски, что ускоряет повторные визиты.
  • Для экономии времени в некоторых решениях результаты поиска сразу отображаются в карточках, без отдельной страницы.
Работа с доверием и барьерами покупки
UX-решения конкурентов активно снижают тревоги пользователей:
  • В карточках отображаются гарантии подлинности и описание процесса проверки оригинальности.
  • Если товар маломерит или большемерит, это отмечается на основе собранного фидбэка.
  • Возможность оплатить товар после примерки снижает страх перед ошибкой в размере.
  • Для неуверенных пользователей предусмотрены подсказки по измерению стопы.
Доставка и карта пунктов выдачи
Доставка реализована максимально удобно:
  • Адрес можно выбирать вручную или из сохранённых, а также сортировать по категориям (дом, офис, пункт выдачи).
  • Отображаются пункты самовывоза с примеркой, сроком доставки и требованием предоплаты.
  • Карта и список пунктов показаны на одном экране — не нужно переключаться.
  • Можно увеличивать и уменьшать карту, видеть маршрут до ПВЗ и время работы.
  • Сайт определяет геолокацию, подставляя ближайшие варианты автоматически.
Взаимодействие с корзиной и оплатой
  • Пользователь получает уведомление о добавлении товара в корзину.
  • Сразу отображается бесплатная доставка и возможная экономия при авторизации.
  • Есть возможность выбрать получателя, добавить подарочную карту и оплатить через неё.
  • Промокоды подсвечиваются рядом с полем ввода — пользователь не забывает их применить.
Контент и вовлечение
  • В карточках доступны обзоры товаров в формате мини-лендингов, что позволяет глубже погрузиться в ценностное предложение.
  • В разделе “Вопросы о товаре” пользователи могут задать уточнения и получить ответ эксперта.
  • Добавлены блоки “С чем носить” и “Образы от стилистов”, помогающие подобрать комплект и повысить средний чек.
  • Новости, акции и рекомендации реализованы в формате сторис, что делает интерфейс живым и эмоциональным.
Персонализация и лояльность
  • Авторизация через соцсети (VK ID, Яндекс ID) и бонусы за отзывы делают взаимодействие комфортным.
  • Пользователям предлагают персональные скидки при входе в аккаунт или регистрации.
  • Некоторые сайты объясняют, почему бонусы не применяются к конкретному товару — повышая прозрачность и доверие.
Проработка сценариев
На основе анализа был разработан детализированный пользовательский сценарий, включающий ключевые этапы взаимодействия.
Для каждого этапа я определил метрики, чтобы в будущем можно было измерить эффективность внедренных решений.
Дизайн-концепция
При разработке дизайн концепции использовали подход Mobile First. Согласно исследованию компании Adindex, 79% пользователей в России делают покупки при помощи смартфонов.
Дизайн концепция построена на ярких цветах (зелёный и оранжевый), которые вдохновляют пользователей на новые рекорды и достижения.
Главная страница
С акцентом на пользовательский опыт. Страница имеет интуитивно понятную навигацию и чистый макет с достаточным количеством белого пространства, что облегчает пользователям поиск и открытие релевантных товаров.
Динамический поиск показывает результаты в реальном времени, персонализированные предложения повышают вовлеченность и конверсии.
Ранее просмотренные товары и история поиска помогают пользователям быстро возвращаться к интересующим их товарам.
Каталог товаров
Разработали удобную категоризацию товаров, чтобы сделать путь покупателя логичным и комфортным.
Пользователи могут выбрать цвет, размер и количество прямо в каталоге, не открывая страницу товара. Это экономит время и делает покупки еще проще.
Карточка товара
Проанализировали карточки товаров в популярных магазинах и выбрали удобный формат: основное фото + карусель дополнительных изображений.
Корзина
В корзине можно изменить параметры товара, например, выбрать другой размер, цвет, увеличить кол-во товаров, добавить в избранное и удалить.
Оформление заказа
Легкий выбор адреса и множество способов оплаты обеспечивают быстрый и удобный процесс заказа.
Сохраненные адреса
Пользователи могут мгновенно выбрать адрес доставки из своего Личного кабинета, не вводя его заново при оформлении заказа.
Гибкая доставка
Если товары не могут быть доставлены в один день, мы уведомляем пользователя и разбиваем заказ. Они могут выбрать получение части заказа раньше или дождаться единой доставки.
Личный кабинет
Создали удобный центр управления покупками, где пользователь может отслеживать бонусы, управлять личными данными, заказами и адресами доставки.
Дизайн система
Каждый компонент включает в себя руководство с характеристиками, использованием и поведением для упрощения сотрудничества между дизайнерами и разработчиками