реклама
разместить

Мобильное приложение Даблби: от исследования до запуска и поддержки

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

Любопытный нюанс

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

Это интерфейс нового приложения:

Мобильное приложение Даблби: от исследования до запуска и поддержки

А это — старого:

Мобильное приложение Даблби: от исследования до запуска и поддержки

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

В работе мы опираемся на собственный опыт проектирования, отраслевую экспертизу заказчика и практики конкурентов. Но самое важное в понимании продукта — мнение пользователей, клиентов бизнеса. Поэтому в самом начале работы мы всегда предлагаем провести пользовательское исследование и составить Customer Journey Map (CJM).

CJM и персоны
CJM и персоны

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

MVP

Мы проанализировали опыт взаимодействия пользователей с бизнесом на каждом этапе, изучили рынок конкурентов и собрали список функций для нового приложения. А чтобы решить, какие из них попадут в MVP (Minimum Viable Prоduct), составили опросник по модели Кано и попросили реальных пользователей его заполнить. В число самых нужных функций попали Apple Pay/Google Pay, возможность отслеживать статус заказа и писать сообщения бариста, список избранных кофеен, программа лояльности, информация об акциях и описание напитков.

Результирующая таблица по модели Кано
Результирующая таблица по модели Кано

Разработка интерфейса

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

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

Фотографии

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

Съемки в Даблби на Новодевичьем
Съемки в Даблби на Новодевичьем

Техническая инфраструктура

Клиентское приложение мы сделали на платформе React Native. Она позволяет использовать одинаковый код для приложений iOS и Android с минимальными отличиями. Так мы сократили Time To Market, ресурсы разработки и поддержки и общую стоимость проекта.

Бэкенд реализовали на GraphQL. Вносим мелкие исправления незаметно для пользователя, а мучительную проверку App Store проходим только для объемных обновлений фронтэнда.

Для админки и приложений для внутреннего пользования, где объем операций гораздо больше, выбрали REST API. Теперь можно не волноваться за обратную совместимость и выпускать обновления в любой момент.

Админку сделали на Next.js. Мы взяли только компоненты, нужные для управления торговлей именно Даблби. Такую систему легко поддерживать и можно оперативно расширять функционал по мере запросов бизнеса. А еще она красивая!

Админка не обязательно должна быть уродская
Админка не обязательно должна быть уродская

Новые вводные: карантин

Релиз приложения мы панировали на 1 апреля 2020 года. Но в конце марта в стране ввели карантин и все кафе закрылись. Функция доставки кофе не была в приоритете, но в новых условиях стала совершенно необходима. И мы ее сделали! Зону доставки ограничили 800 метрами от кофейни, чтобы один бариста мог доставить заказ, пока второй остается за стойкой.

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

Приложение бариста

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

Мобильное приложение Даблби: от исследования до запуска и поддержки

Подключение франчайзи

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

Новый канал продаж

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

Спустя три месяца

С момента запуска приложения в апреле 2020 года:

  • подключилось более 30 кофеен
  • в которых делается до 100 заказов в день
  • у 99,9% пользователей приложение работает стабильно
  • разработали программу лояльности и тестируем ее
  • научили внутреннюю команду обновлять контент и передали подробный гид по фотосъемке
  • средняя оценка приложения в сторе – 4,2.
2222
реклама
разместить
16 комментариев

Молодцы! Даже то, что меня назвали Сергеем на 3 скриншоте, картину не портит:) Вот так бывает: сделаешь несколько открытых примеров CJM, а тебя потом вместо стоковых фото в качестве персоны в CJM ставят :)

5

Станислав, у вас фото красивое ) Спасибо за примеры шаблонов, Это один из самых ярких примеров) А я, в свою очередь, могу показать, как я его доработала) 

1

Приложение классное и приятное!
Скачал во время пандемии и приятно удивился.

Было бы интересно узнать чуть больше чисел.
- Сколько времени потратили на исследования?
- Сколько потратили на дизайн, сколько на разработку?
- Какой был состав команды?
- Сколько делало разработчиков?

1

— исследования заняли около 5 недель, тут было качественно (интервью) + количественное (рассылка с опросником) исследования
— дизайн с конца ноября по начало февраля, там из за праздников подольше, чем рассчитывали получилось, разработка: начало февраля-первые числа апреля
— один исследователь с помощником, проджект, дизайнер, артдиректор
— техническая команда: CTO, бек, фронт на react native, фронт на простом реакт (админка), девопс

1

Очень приятные и приложение, и статья :)

1

спасибо! нам до кул-стори еще далеко, но мы стараемся)

1

Класс! Все просто и лаконично вышло, круто поработали с карантинной историей!

1
Раскрывать всегда
Apple представила MacBook Air на чипе M4 и по цене от $999

У него обновлённая камера Center Stage на 12 Мп.

Источник здесь и далее: Apple
5151
1515
55
11
На лет 10 точно хватит, говорю как пользователь про версии 2014 года - до сих пор юзаю
реклама
разместить
ЦБ начал обсуждать идею ввести «разумное» ограничение на количество оформленных на человека банковских карт

Например — до пяти карт в одном банке.

2525
1313
99
22
Думаю, нужен реестр
Нейросеть Kling: как правильно написать промт для видеоконтента на русском языке

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

Нейросеть Kling: как правильно написать промт для видеоконтента на русском языке
11
Telegram-каналы рассказали про «Учёт надоя» — это замаскированное iOS-приложение «Россельхозбанка»

Официально в банке информацию не комментировали.

Обновлено в 16:00 мск. В пресс-службе «Россельхозбанка» подтвердили vc.ru, что «Учёт надоя» — новое iOS-приложение банка. Ранее установленные iOS-приложения работают как обычно — банк рекомендует отключить автообновления и не удалять их.

3535
33
11
Что-то на сверхдержавном...
В Telegram-каналах распространили информацию о закрытии действующей кредитной карты клиента «Т-Банка» из-за подключения самозапрета на кредиты — в банке это опровергли

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

Скриншот из Telegram-канала «Банкста» 
2020
Здравствуйте. Мы не закрываем кредитные карты, если клиент активно ей пользуется. Можем это сделать, если клиент подписал документы, а затем установил самозапрет. В соответствии с Условиями обслуживания, кредитный договор заключаем не во время подписания документов, а в момент активации кредитной карты или совершения первой операций по ней.
Власти не будут использовать геолокацию, чтобы автоматически определять налоговое резидентство россиян

Но данные могут стать поводом для проверки.

2525
11
Когда с VPN стал резидентом всех стран 😎
Как ставить задачи, чтобы команда работала, а не ждала указаний

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

Как ставить задачи, чтобы команда работала, а не ждала указаний
11
За какой кэшбек с рекламы можно присесть на 6 лет

Все пароли и явки сдали в статье.

За какой кэшбек с рекламы можно присесть на 6 лет
4141
1616
44
[]