{"id":7297,"title":"\u0417\u0430\u043a\u0430\u0442\u0438\u043b\u0438 \u0432\u0435\u0447\u0435\u0440\u0438\u043d\u043a\u0443 vc.ru. \u0420\u0430\u0441\u0441\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0438 \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c, \u043a\u0430\u043a \u044d\u0442\u043e \u0431\u044b\u043b\u043e","url":"\/redirect?component=advertising&id=7297&url=https:\/\/vc.ru\/promo\/300923-proveli-vecherinku-vc-ru-i-sdelali-ofis-uyutney-s-pomoshchyu-novogo-servisa-ot-ozon&placeBit=1&hash=1786c9dcf11a3b054c8e53004e27074664313ed4055e24064ede059ebc186db8","isPaidAndBannersEnabled":false}
Genue

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

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

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

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

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

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

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

В работе мы опираемся на собственный опыт проектирования, отраслевую экспертизу заказчика и практики конкурентов. Но самое важное в понимании продукта — мнение пользователей, клиентов бизнеса. Поэтому в самом начале работы мы всегда предлагаем провести пользовательское исследование и составить Customer Journey Map (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.
{ "author_name": "Genue", "author_type": "self", "tags": [], "comments": 16, "likes": 18, "favorites": 33, "is_advertisement": false, "subsite_label": "unknown", "id": 147518, "is_wide": true, "is_ugc": true, "date": "Wed, 05 Aug 2020 12:00:07 +0300", "is_special": false }
0
16 комментариев
Популярные
По порядку
Написать комментарий...

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

4

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

1

Спасибо) Welcome, рад, что оказались полезными) Да, с радостью ознакомился бы) https://m.me/stan.khrustalev

0

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

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

1

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

1

Спасибо за ответ!

Интересно про реакт нейтив. Фронт сколько человек писали? И почему выбрали реакт, а не модный сейчас флаттер?

0

1,5) то есть сначала один фултайм, потом второй, и немного пересеклись по времени. мы проверили на других своих проектах и нам понравилось. кстати, может у вас есть под рукой примеры хороших приложений на flutter?

0

Из того что я знаю
медуза – https://meduza.io/feature/2020/06/01/novoe-prilozhenie-meduzy-pochemu-flutter
аптека ригла – https://surf.ru/rigla
таксомерт яндекс такси – https://kod.ru/istoria-iz-akademii-apple-v-yandex-taxi

Они хорошие, но нативные, мне лично, всё-таки приятнее использовать

0

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

1

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

1

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

1

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

0

Здравствуйте, Василий. 
Интервью были с текущими на тот момент клиентами Даблби, которые использовали приложение. Было несколько сегментов и всего 16 интервью. CJM — это инструмент визуализации, обычно карта помогает увидеть всю ‘’картину’’ целиком и рассказать о пути клиента всему бизнесу, увидеть гэпы и точки роста. Но в основе всегда лежат правильно проведённые  интервью, где можно дотянуться до глубинной потребности клиента и узнать их задачи (jobs). 

2

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

2

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

–5

Главное выполнить задачи клиента, а не убогие тени не всегда в этом помощники) 

2
Читать все 16 комментариев
Улыбнитесь, вас снимают: как биометрия меняет жизнь банковских клиентов

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

«Авито Доставка» — покупатель забрал товар, а деньги мне не перевели

Решила продать xBox, после нескольких дней бесплодных попыток в своем городе соблазнилась Авито Доставкой, которую предложил покупатель. До этого отправляла через доставку небольшой товар, все прошло идеально. У покупателя долгая история покупок и отличные отзывы. Что может пойти не так? - подумала я и решительно потащила коробку в пункт приема в…

Кикшеринг станет ещё доступнее, но для крупных игроков места больше нет: интервью с инвесторами кикшеринга «Юрент» Статьи редакции

Андрей Азаров и Михаил Гейшерик рассказали, зачем «Юрент» купил сервис аренды обычных велосипедов, продолжится ли бурный рост кикшеринга и что этому может помешать.

Михаил Гейшерик и Андрей Азаров
Как дайгоу может помочь наладить систему сбыта в Китай

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

У альфа-банка стоит ограничение на отображение баланса в пуше, его не видно полностью

Скорее всего, Альфа-банк провел свой аналог "Игры в Кальмара", где разыграл суперприз. Их версия отличается от корейской тем, что там не надо никого убивать и проходить испытания. Вы, как обычно, пользуетесь картой и получаете шанс выиграть супер приз! Когда мне пришел этот пуш, я сразу понял, что не зря был вашим клиентом столько лет! Вы…

Blue Origin Джеффа Безоса запланировала создать собственную космическую станцию «Орбитальный риф» Статьи редакции

Она начнёт работать во второй половине 2020-х годов.

Час в неделю — на помощь детям: как 303 учителя со всей России стали онлайн-волонтёрами для школьников

Движение «Педагоги-волонтеры России» учит ребят из детских домов и малоимущих семей. Их репетиторы уже помогли 1 350 детям наверстать знания по школьным предметам. Сейчас платформа ищет новых учителей по всей России. Особенно — математиков и программистов

Apple выпустила macOS Monterey и анонсировала запуск сервиса Fitness+ в России Статьи редакции

Он станет доступен 3 ноября.

Рыночная капитализация Tesla превысила $1 трлн Статьи редакции

На рост акций могли повлиять новости, связанные с компанией.

Предсказать и оптимизировать: плавим сталь с помощью Data Science

Как создавали программу, которая помогает металлургам экономить 3-5 млн долларов в год

МТС дополнила экосистему B2B-продуктов решениями МТТ

ПАО «МТС», ведущая российская компания по предоставлению цифровых, медийных и телекоммуникационных сервисов, дополнила экосистему продуктов для бизнеса новым решением – виртуальной АТС от своей 100% дочерней компании АО «Межрегиональный ТранзитТелеком» (МТТ), федерального провайдера интеллектуальных телеком- и ИТ-решений для бизнеса. Теперь…

null