бренд
Кейс · Ecommerce · Tilda / Low-code
USIZE
Ecommerce-платформа для бренда женской одежды plus size.
Контекст · 01 | 12
Контекст
USIZE — бренд женской одежды plus size в ценовом сегменте выше среднего. Бренду нужен был сайт с нуля: не просто витрина, а полноценный интернет-магазин, который презентует бренд и проводит пользователя от выбора товара до покупки.
каталог
быстрый вход в ассортимент и категории
размер
снятие сомнений перед покупкой
покупка
понятный путь от выбора до оплаты
CRM/1C
передача заказа в бизнес-системы
аналитика
события и данные по ecommerce-воронке
Задача
Запустить ecommerce-канал: каталог, карточки товаров, корзина, онлайн-оплата, передача заказов в Bitrix24, синхронизация с 1C, Telegram-коммуникации и аналитика ключевых действий.
Как я понял задачу · 03 | 12
Как я понял задачу
Для plus size ecommerce важно не только показать красивую одежду. Пользовательнице нужно снять сомнения по размеру, посадке, наличию, оплате и возможности быстро задать вопрос. Поэтому фокус был не только на визуале, но и на карточке товара, выборе размера, состояниях интерфейса, mobile-сценарии и аналитике.
Размер и посадка
важно быстро снять сомнение перед покупкой.
Наличие
пользователь должен понимать, доступен ли товар и размер.
Mobile-покупка
основной сценарий должен работать удобно с телефона.
Быстрый вопрос
Telegram нужен как быстрый контакт без потери контекста.
Варианты · 04 | 12
Какие варианты рассматривал
Вариант 1. Самописный ecommerce-сайт
Плюс: максимальная гибкость по UX, логике каталога, карточке товара и аналитике. Минус: дольше и дороже в реализации.
Вариант 2. Стандартный Tilda-каталог
Плюс: быстро запускается. Минус: без UX/UI-доработок получается слишком базовый ecommerce-сценарий.
Выбранный подход
Вариант 3. Tilda Store + кастомизация UX/UI
Плюс: позволяет сэкономить бюджет, быстро запустить магазин и при этом доработать пользовательский путь, оплату, CRM, 1C и аналитику.
Выбрал третий вариант, потому что изначально рассматривался самописный подход, но в итоге был выбран более экономичный сценарий на Tilda с UX/UI-кастомизацией.
Что сделал · 05 | 12
Что сделал
Спроектировал и реализовал:
Состояния интерфейса · 06 | 12
Состояния интерфейса
Продумал состояния, чтобы каждое действие пользователя получало понятную обратную связь.
товар доступен
нет в наличии
размер не выбран
ошибка оформления
добавлено в избранное
добавлено в корзину
перейти в корзину
Принцип
каждое действие пользователя должно получать понятную обратную связь.
UI и Figma · 07 | 12
UI и Figma
Ecommerce UI
Product actions
System
Figma как система
Для дальнейшего развития можно добавить variables и токены для цветов, типографики, отступов и статусов.
Проверка · 08 | 12
Как проверял
Основной ecommerce-flow
Перед запуском проверял каталог, карточку товара, выбор размера, корзину, оплату, mobile-сценарий, передачу заказа в Bitrix24, цели в Метрике и клики по Telegram.
Edge cases
Размер и наличие
- размер не выбран
- товар нет в наличии
- добавление в избранное
Заказ и CRM
- добавление в корзину
- передача заказа в Bitrix24
- цели в Метрике
Контакты и каналы
- клики по Telegram
- mobile checkout
- корректность статусов после оплаты
Метрики · 09 | 12
Метрики
Я отслеживал:
Результат · 10 | 12
Результат
Было
у бренда не было полноценного интернет-магазина с каталогом, оплатой, CRM, 1C и аналитикой.
Стало