Москва
Кемерово

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

Проектирование и создание макетов мобильного приложения для HoReCa

Задача

Заказчик обратился к нам за дизайном экранов мобильного приложения для кофейни в Дубае.

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

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

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

Задачи: 

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

Решение

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

Интерфейс с узнаваемым фирменным стилем облегчает пользователям работу с приложением и поддерживает имидж бренда.

Интерфейс приложения

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

В интерфейсе реализовали все функции и экраны, необходимые для пути клиента: от регистрации до оформления заказа и бонусной системы.

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

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

Помимо приветствия есть краткий онбординг — как пользоваться приложением. Такой подход способствует успешной адаптации аудитории и снижает риск потери пользователей на этапе знакомства.

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

Регистрация

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

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

Экран регистрации в приложении

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

В меню даны карточки товаров с изображением продукта, названием, стоимостью и его весом и объемом.

Меню товаров в приложении

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

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

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

Оформление заказа

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

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

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

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

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

Акции на домашнем экране

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

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

Настройки приложения

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

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

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

Результаты

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

Итоги проекта: 

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

Смотрите также

Смотреть все работы
Модуль планировщика интерьера для ГК ФСК

Планировщик интерьера для ГК ФСК

Разработка модуля планировочных решений для топ-4 девелопера России

Туристический квест

Приложение «Юный турист» для Министерства образования Кузбасса

Туристический квест по местам родного края для школьников

Приложение для записи к врачу и оплаты услуг клиники

Приложение клиники «Энергетик»

Помощник пациента с онлайн-записью на прием, оплатой анализов и цифровой медкартой