Anna Doronina

Menu&U

Веб-приложение для рестораторов и их клиентов

Задачи

1. Разработать веб-приложение для администраторов и официантов ресторанов для организации работы заведений, включая настройку столов, меню, блюд, взаимодействие с заказами, планирование

2. Разработать веб-приложение для клиентов ресторанов, в котором после сканирования QR-кода на столике видно меню, можно сделать заказ и оплатить его

Моя роль

UX/UI дизайнер в дизайн-команде

Реализовано мной

Настройки / Аналитика / Главная с календарем / Заказы / Столы / Вход для оператора / Профиль / прототип лендинга / дизайн-ревью / адаптивы

Реализовано совместно с дизайн-командой

Анализ референсов / user flow / вайрфреймы / иллюстрации

Дата

Июль — Сентябрь 2024

Основные метрики, на которые мы ориентировались при создании веб-приложения для владельцев и работников ресторана

Time to value

На старте нам важно понимать, насколько быстро пользователи получат первую ощутимую пользу от приложения (настроят основные параметры ресторана), чтобы измерить простоту и понятность UX. Будем отслеживать время, прошедшее с момента регистрации до первого целевого действия.

Целевой показатель: 10-15 мин

Customer Satisfaction Score

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

Целевой показатель: 4-4,5 из 5

Support Ticket Volume

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

Целевой показатель: <2 обращений на 10 активных пользователей в день

Веб-приложение находится в завершающей стадии разработки и продажи сервиса клиентам. Ожидаем результаты

Заказы

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

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

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

Раздел “Столы” — другой разрез отображения заказов, когда официант может просмотреть, какие столики на данный момент заняты, какой каждому из них присвоен статус, и если есть какие-либо сложности — разобраться с ними. Или закрыть стол. когда блюда вынесены, заказы оплачены и гости уходят.

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

Ограничения, требования и обратная связь от владельцев ресторанов

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

final

Экран “Домой”

Когда администратор заполнил все необходимые для своего ресторана данные, на домашнем экране он видит календарь, в котором может планировать встречи, вносить бронирования, инвентаризации и другие мероприятия, сортировать их по группам, устанавливать им напоминания и повторяемость.

Пользователь может видеть календарь в разрезе месяца, недели и дня, а также быстро перемещаться между соседними периодами или выбрать период в календаре.

Здесь же собраны все оповещения, которые можно скоупом помечать как прочитанные или удалять совсем.

Аналитика

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

Данные можно сравнить с предыдущим периодом или с тем же периодом год назад, посмотреть значения за последние 7, 14, 30, 90 дней.

Столы

Здесь администратор добавляет столы своего ресторана с названиями, количеством гостей и временем ожидания заказа. Это нужно для правильного отображения времени для посетителей, столиков во вкладке “Заказы” и при создании QR кодов для каждого стола.

Настройки

Набор различных настроек для администратора, где он может добавлять операторов (официантов, барменов и других работников), управлять подпиской, вводить данные компании, настраивать брендинг, генерировать QR коды для столиков и связываться с поддержкой.

Чтобы добавить нового сотрудника, администратор направляет ему на почту приглашение, по которому сотрудник регистрируется в системе в роли оператора. Он может отправить приглашение повторно, удалить сотрудника, изменить его имя и фамилию, а также сбросить пароль.

Страница управления подпиской, где администратор может продлить ее или добавить дополнительные функции в текущий пакет.

Чтобы настроить брендинг, нужно ввести название ресторана, выбрать основной цвет и логотип. Все изменения динамически отображаются на превью веб-приложения, чтобы администратор мог видеть, как будет выглядеть сервис глазами посетителей.

В поддержке пользователь может обратиться со своим вопросом к боту или выбрать из наиболее часто встречающихся, в процессе диалога появляются уточняющие направления вопроса, с которым обычно встречаются другие пользователи. Если ничто из предложенного не подходит, всегда можно обратиться к оператору напрямую.

На странице создания QR кода похожий механизм, как в брендинге — администратор выбирает текст, цвет и логотип, и сразу видит превью будущего кода. На следующих этапах он может заказать и оплатить печать кода для своих столиков с доставкой.