MultiMart
Импульсная покупка, которой мешал сам сайт
Задача
Импульсная покупка, которой мешал сам сайт.
Средний чек невысокий, покупка импульсная: человек заходит за одним, добирает ещё два. Старый сайт работал против этого сценария.
MultiMart — интернет-магазин электроники и товаров для дома. Бренд менять не требовалось: нужно было убрать лишнее, а не переизобрести магазин.
Что мешало:
- карточки в сетке мелкие: на первый экран помещалось много товаров, но ни один не выделялся;
- навигация дублировалась — часть категорий в верхнем меню, часть в боковом, часть только на главной;
- корзина открывалась отдельной страницей: добавив товар, человек терял позицию в каталоге и чаще всего не возвращался.
Решения
Вход, регистрация и корзина — каждый сценарий на своём месте.
Прошла весь путь от главной до оплаты и записала каждую точку, где приходилось думать или возвращаться назад.
Посмотрела, как те же задачи решают Ozon, Wildberries и зарубежные магазины — не чтобы копировать, а чтобы понять, к какому поведению покупатель уже привык. В интернет-магазине оригинальная навигация почти всегда вредит.
Вход — модальным окном поверх страницы: человек авторизуется, не теряя позицию в каталоге и не сбрасывая фильтры.
Регистрация — наоборот, отдельной страницей. Это осознанный шаг, и здесь есть место объяснить, зачем вообще заводить аккаунт: история заказов, сохранённые адреса, бонусы.
Корзина закреплена на всех страницах, сумма видна всегда. При импульсной покупке человек должен видеть, сколько уже набрал, — именно это доводит до оформления.
Структура и вайрфреймы
Главный экран магазина — карточка товара.
Составила новую структуру каталога и нарисовала вайрфреймы: главная, листинг, карточка, корзина.
Карточку переделывала трижды. В финальной версии цена, наличие и кнопка «В корзину» помещаются в зону первого экрана на самом маленьком поддерживаемом телефоне.
Фирменный стиль
Монограмма для любого размера и жёсткое правило для жёлтого.
Знак — монограмма «M» из двух плоскостей: чёрной и жёлтой. Она читается и на билборде, и в размере фавикона, поэтому в ней нет мелких деталей.
Жёлтый в системе работает только как акцент: им выделены цена и целевое действие. Всё остальное держит чёрно-белая основа. Правило простое — если на экране больше одного жёлтого пятна, ни одно из них не работает.
Тот же контраст перенесён на остальные носители: билборд, шоппер, визитки.
Результат
Что изменилось в каталоге и что уехало в разработку.
Крупная сетка товаров, фильтры в боковой панели, карточка с ценой и кнопкой в зоне первого экрана, корзина видна с любой страницы.
Клиент получил макеты в Figma с компонентной структурой: каждый элемент — компонент с вариантами, новые категории собираются из готового без участия дизайнера.