Есть задача?
Oops! Something went wrong while submitting the form.
Mobile App • UI/UX
Независимая экосистема
Cистема приложений, которая упрощает взаимодействие гостей ночных клубов с персоналом
О проекте
Mobile App
Project
Клиент
Профессиональный спортсмен, бывший игрокв американский футбол. У заказчика уже есть инвесторы и пул клиентов, которым он планирует продавать готовый продукт.
Идея
Главное идея приложения — минимизировать персональный контакт. У гостей нет необходимости стоять в очереди на баре, ждать свой заказ и потом нести все до своего столика. Все эти задачи закрываются мобильным приложением NoTab.
5 ролей
Mobile App
Challenge
2 админа
Супер-админ
Создает профили, видит все заведения
Админ
Добавляет персонал, еду и напитки для своего заведения
Кухня
Кухня
Принимают и отдают заказы — всё делается через веб-приложение
Клиент
Клиент
Покупает еду и напитки в клубе, заказывает приватные танцы
Стафф
Официант
Выбирает, где сегодня работает, управляет заказами
Танцовщица
Принимает заявки, оплата производится через QR код
Проект был действительно большим. Мы не могли сделать что-то одно и полноценно протестировать: чтобы сделать интеграционное тестирование, нужно было дождаться, когда кусочек функциональности будет готов во всех 5 приложениях.
Игорь Андреев, тестировщик
Верификация
Mobile App
ID
Я предложил внедрить возможность верифицироватьвозраст гостя по ID — есть ему 21 или нет. Это бы еще сильнее сокращало общение. Если тебе больше 21 — заказывай алкоголь, если нет — нельзя. По итогу решили выкатить первую версиюбез этой фичи, но положили ее в бэклог. Чтобы мы могли легкои быстро реализовать ее в будущем, я уже сейчас заложилэто в архитектуре — данные о возрасте сохраняются в JSON-базе.
Александр Пуртов, тимлид
QR-код
Mobile App
QR
Изначально планировалось, что QR-код будет привязан конкретно к заказу. С точки зрения пользовательского опыта — работало бы плохо, поэтому решили поменять флоу его генерации. Теперь код привязан к пользователю. Таким образом, в одном QR-коде спрятаны все заказы, который сделал гость — это помогло сэкономить время и его, и официанта.
Заказ танцев
Mobile App
01
Club
Есть два сценария заказа приватного танца
01
Гость заказывает танец. Выбирает танцовщицу, заказывает танец. Если заказ принимается, танцовщица приходит, гость генерирует QR-код — начинается танец.
Стоит отметить, что
Танцовщица не наемный работник. Она сама устанавливает цену за танец. Сама выбирает, будет танцевать для гостя или нет.
02
Танцовщица подходит сама.
Гость генерирует QR-код, танцовщицаего сканирует, танцует, выставляет счет — оплата происходит постфактум. Это важно, потому что танец может быть не 1.
Дизайн
Mobile App
Design
Все приложения NoTab выполнены в темных тонах, чтобы в клубах светлый интерфейс не бил по глазам. Акценты сделаны на самые важные для гостей заведений моменты — цену и фотографии.
Fonts
#050D1D
#0266FE
#FFFFFF
Logo
Логотип для NoTab разрабатывали тоже мы. В основе логотипа лежит кубик льда — обязательный атрибут большинства коктейлей.
Онбординг
Mobile App
Платежи
Mobile App
Payment
Деньги получают 4 роли: сам NoTab, владелец заведения, танцовщица и официанты.
Нам нужно было просчитать, сколько фактически должен будет платить гость, сколько за транзакции будет забирать Stripe, и сделать так, чтобы деньги уходили на нужный счет.
С платежами было сложно. Потому что детали о том, как все будет работать, мы получили только под конец проекта. Условно говоря, мы договорились об одном, а потом пришлось допиливать множество нюансов
Мария Волкова, проектный менеджер
Stripe
Поиск нужной библиотеки
Интегрировать Stripe с веб-приложением легко: под эту цель они написали библиотеку Stripe Elements. Для мобильных приложений на React Native ничего такого не было, поэтому нам пришлось искать обходной путь. Мы быстро пришли к решению — использовать стороннюю open-source библиотеку tipsi-stripe и написать оболочку для родного SDK.
App
На один билд в ручном режиме уходит примерно полчаса. Так как приложение у нас не одно, а в регулярном обновлении нуждаются все продукты — это было бы сильно времязатратно.
Чтобы ускорить процесс создания билдов мобильных приложений на React Native, использовали автоматизированную систему App Center.
Релиз
Mobile App
Release
Скачать NoTab можно в App Storeи Google Play Market. Если будетев США — обязательно попробуйте!
