Веб- и мобильное приложения ✶ для российского ресторана пиццы с доставкой по городу
Как я пересобрала UX доставки без поломки уже существующих пользовательских паттернов❞
Больше о проекте на Workspace
№1
Контекст
Сеть пиццерий Panam Pizza работает более 10 лет и хорошо известна в своём городе
Компания уже запустила веб-приложение доставки и регулярно собирала пользовательскую обратную связь
В какой-то момент список идей и запросов от пользователей вырос настолько, что Александру (владелец бизнеса) стало очевидно: продукту нужен системный пересмотр UX и ключевых сценариев, так как точечные правки больше не решали накопившиеся проблемы
Клиент ожидал продуктового подхода — не просто «освежить интерфейс», а выявить точки роста и улучшить пользовательский опыт на уровне сценариев.
№2
Задача и цели
Пересмотреть и улучшить ключевые пользовательские сценарии оформления заказа в веб-приложении доставки Panam Pizza, не меняя привычный для пользователей процесс заказа.
Выделенные цели:
Обновлённый UX и кликабельный прототип ключевых сценариев заказа, готовый для тестирования и дальнейшего масштабирования в мобильное приложение.
№3
Проблемы
Несмотря на готовый визуал, продукт сталкивался с рядом проблем:
№4
Редизайн и концепция
Перед началом UX-переработки Александр хотел увидеть концепцию обновлённой платформы и мобильного приложения
Я начала с редизайна существующего приложения с фокусом на поддержку обновлённых пользовательских сценариев и масштабирование продукта
В рамках концепции я:
№5
Анализ продукта
Исследования были ограничены по времени, поэтому мы опирались на: пользовательскую обратную связь, собранную рестораном; аналитику заказов и поведения; обсуждения с Александром (владелец и менеджеры его ресторанов выступали как proxy-пользователи); каждый созвон с заказчиком фактически выполнял роль мини-интервью.
Контекст
Заказывает еду 1–2 раза в неделю после работы или в выходные.
Цель
Быстро оформить заказ без лишних шагов.
Поведение
Знает меню и часто заказывает одно и то же; Ожидает предсказуемый и знакомый сценарий; Не хочет разбираться в изменениях в интерфейсе.
Боли
Нет ощущения контроля перед оплатой; Любые лишние шаги раздражают.
Контекст
Заказывает впервые по рекомендации или рекламе.
Цель
Понять, можно ли доверять сервису, и не ошибиться при заказе.
Поведение
Более внимательно читает состав и условия доставки; Может сомневаться перед оплатой; Легко уходит, если что-то непонятно.
Боли
Перегруженная корзина; Непонятно, можно ли изменить или отменить заказ; Страх ошибки перед оплатой.
№6
UX-гипотезы
Были сформированы гипотезы на основе пользовательской обратной связи, ранее собранной командой заказчика, а также совместных обсуждений с владельцем и менеджерами ресторана, которые хорошо знают поведение своих клиентов.
Дополнительно учитывался контекст delivery-сервисов и типовые пользовательские паттерны в подобных продуктах.
№7
UX ключевых сценариев
После утверждения концепции мы перешли к полноценной UX-проработке продукта
Основной фокус был на сценариях:
Оформление заказа (создание / редактирование / отмена) и отслеживание заказа.
Для этих сценариев были проработаны user flows, edge-кейсы, собраны прототипы и UI-решения
Навигация была пересобрана в соответствии с новыми сценариями, а акценты смещены на ключевые действия, чтобы снизить когнитивную нагрузку на этапе оформления заказа.
В итоге работы я пересобрала основные сценарии оформления заказа, сфокусировавшись на контроле пользователя и прозрачности действий. Работала по гипотезам, устранив критичные UX-пробелы, влияющие на финальный шаг заказа
Главная страница — это первый экран, где пользователь выбирает, что заказать. Проблема была в перегруженности контентом и слабой иерархии, что усложняло путь пользователя до быстрого принятия решения
Я упростила структуру, выделила ключевые сценарии (выбор категории, быстрый переход к популярным позициям, просмотр акций), расставила акценты и сделала экран более «сканируемым», чтобы пользователь мог быстро считать контент и перейти к заказу
Ранее карточка товара была перегружена, потому что информация была представлена неструктурировано. Пользователям приходилось тратить время на понимание состава, цены и опций
Я собрала карточку вокруг ключевых параметров (состав, размер, цена, доп. опции), усилила визуальный акцент на продукте и упростила сценарий добавления в корзину, чтобы сократить время принятия решения
Это был уже новый продуктовый сценарий. Ранее такой фичи не было — пользователь был ограничен выбором, что делало систему негибкой и некастомизируемой
Было решено добавить сценарий «половинки пиццы»: я внедрила комбо-наборы и спроектировала логику сборки, где пользователь может последовательно выбрать составляющие, не перегружаясь количеством опций за раз, и сразу видеть итоговую стоимость — это позволило добавить гибкость без усложнения интерфейса
Нужно было переработать корзину и оформление заказа, так как это был самый проблемный этап: много информации, высокая когнитивная нагрузка, ошибки при заполнении и тревожность перед оплатой
Я разбила процесс на три последовательных шага, сгруппировала информацию по смыслу, упростила форму и добавила возможность редактировать заказ без выхода из сценария. Это сделало процесс более управляемым и понятным
Нужно было упростить личный кабинет и сделать его полезным для повторных заказов. До этого он не поддерживал сценарии возврата: было сложно найти историю заказов и повторить покупку
Я пересобрала структуру, добавила историю заказов и быстрый повтор, чтобы сократить путь пользователя при следующем заказе и сделать продукт более удобным для регулярного использования
Нужно было добавить базовую управляемость заказа, так как пользователь не мог отменить или изменить его после оформления и не понимал, что происходит дальше
Я добавила возможность отмены, редактирования и отслеживания статуса заказа, чтобы пользователь чувствовал контроль над процессом и не испытывал лишнего напряжения после оплаты
№8
Дизайн-система и масштабирование
На старте проекта у продукта не было дизайн-системы.
После утверждения концепции и ключевых UX-решений я разработала дизайн-систему, которая объединила: основные UI-компоненты; типовые состояния; сетки, отступы и паттерны взаимодействия.
Дизайн-система стала основой для дальнейшего развития веб-продукта, подготовки к запуску мобильного приложения, более стабильной и быстрой работы команды разработки.
№9
Результаты