LightLogo
Проект

Интерфейс мобильного приложения для кофейни в Дубае

Проектирование и создание макетов мобильного приложения для HoReCa
Дата
2024
Экспертизы
Аналитика
Проектирование
Дизайн
Тип продукта
Мобильные приложения
Интерфейсы и дашборды
Веб дизайн
Отрасль
HoReCa

Задача

Заказчик обратился к нам за дизайном экранов мобильного приложения для кофейни в Дубае.
В условиях высокой конкуренции нужно предложить покупателям удобный способ заказать и быстро забрать любимый напиток. Один из таких способов — заказ через мобильное приложение. Именно его решил использовать наш клиент.
Нас попросили создать приложение, в котором гость сможет выбрать продукт, указать предпочтения (объем и добавки) и оформить заказ онлайн. При этом оплата происходит на кассе во время получения напитка — картой или наличными. Так приложение помогает клиентам экономить время, а кофейне — выстраивать быстрый и удобный процесс взаимодействия с гостями.
Главная цель — создать комфортное пространство для заказа, чтобы пользователи могли легко взаимодействовать с кофейней. Приложение должно наладить прямую связь с гостями, обеспечить положительный опыт и вызвать желание вернуться.
разработка приложения для кофейни
Задачи: 
  • На основе концепции бренда спроектировать user flow и создать дизайн приложения.
  • Сделать экран с онбордингом, чтобы познакомить пользователя с интерфейсом приложения.
  • Добавить регистрацию по номеру телефона.
  • Оформить каталог с продукцией кофейни и добавить возможность заказа.
  • Разработать две версии приложения — на английском и арабском языках.
  • Предложить варианты оформления акций для пользователей.

Решение

Мы разработали минималистичную концепцию на основе референсов заказчика и фирменного стиля кофейни, включая дизайн стаканчиков, а также уже существующих идей по продвижению продукта.
Интерфейс с узнаваемым фирменным стилем облегчает пользователям работу с приложением и поддерживает имидж бренда.
разработка приложения для кофейни
Интерфейс приложения
Также собрали UI kit с основными элементами приложения: цветовая гамма, шрифты, иконки, карточки товаров, лого и другие повторяющиеся блоки. Так как кофейня была стартапом, было важно учесть, что в будущем понадобятся доработки интерфейса. Эти артефакты нужно было передать заказчику.
разработка приложения для кофейни
В интерфейсе реализовали все функции и экраны, необходимые для пути клиента: от регистрации до оформления заказа и бонусной системы.

Приветственный экран

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

Регистрация

Для прохождения регистрации пользователю нужно подтвердить свой номер телефона. Он может выбрать любую страну, заполнить данные, получить код верификации — и перейти к основному функционалу.
В кофейне действует акция «Приведи друга», поэтому в окне регистрации можно указать его или ее номер и получить напиток в подарок. Это не только мотивирует новую аудиторию к установке приложения, но и способствует органическому росту клиентской базы за счет рекомендаций от лояльных пользователей.
разработка приложения для кофейни
Экран регистрации в приложении

Меню с карточками товаров и оформление заказа

В меню даны карточки товаров с изображением продукта, названием, стоимостью и его весом и объемом.
разработка приложения для кофейни
Меню товаров в приложении
Когда пользователь открывает карточку — он выбирает объем напитка и добавки к нему: сиропы, сахар или мед, растительное или коровье молоко и так далее. Затем добавляет кофе и переходит в корзину. Клиент может сделать заказ, но оплата происходит непосредственно в кофейне во время выдачи товара. 
Покупка отображается на домашнем экране — пользователь видит место, где забирать напиток. А если нажать на кнопку «Просмотр заказа» — можно получить полную информацию.
Гибкий интерфейс настроен с учетом специфики продукта: кофе — напиток, который требует индивидуальных опций, особенно для искушенной публики. Возможность выбора подчеркивает заботу о клиентах и высокий уровень сервиса.
разработка приложения для кофейни
Оформление заказа
После получения напитка на домашнем экране будет отображаться выполненный заказ и товары, которые в нем были. Для удобства мы добавили функцию повторения покупки. 
Новые заказы отображаются сверху, а прошлые — под ними.
разработка приложения для кофейни

Бонусы и акции

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

Пользовательские настройки

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

Английская и арабская версии приложения

Приложением в Дубае будет пользоваться разная аудитория — сейчас город является точкой притяжения для людей со всего мира. Поэтому мы сделали две версии — английскую для иностранцев и арабскую для местных жителей. 
разработка приложения для кофейни
Английская и арабская версии приложения

Результаты

У нас получился удобный интерфейс с минималистичным дизайном. Мы проработали пользовательский путь, что позволяет аудитории лучше ориентироваться в приложении и оформлять заказы всего за несколько кликов. 
Итоги проекта: 
  • Улучшение пользовательского опыта. Минималистичный дизайн и интерактивный онбординг помогают пользователям быстро ознакомиться с приложением и начать с ним работать.
  • Две версии приложения. Внедрение двух языков (английского и арабского) расширяет потенциальную аудиторию приложения, делая его доступным для разных групп пользователей в регионе.
  • Повышение лояльности. Бонусные программы, акции и возможность быстро повторить заказ стимулируют частые визиты и участие пользователей. Это укрепляет лояльность к бренду.
  • Взаимодействие с клиентом. Возможность регистрироваться по номеру телефона, а также выбирать точку выдачи и состав заказа значительно упрощает процесс взаимодействия с кофейней и способствует росту клиентской базы.
Простой функционал. Проработанная структура интерфейса, включающая интуитивно понятные карточки товаров и гибкость настроек, делает приложение удобным инструментом для заказа и навигации.
Robot