Кейс: как Surf и «Ригла» сделали на одном коде мобильные приложения для трёх аптечных брендов

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

Кейс: как Surf и «Ригла» сделали на одном коде мобильные приложения для трёх аптечных брендов

Знакомимся с клиентом: это крупная сеть аптек «Ригла»

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

По данным MarketMedia, в рейтинге 2020 года «Ригла» занимает второе место по количеству торговых точек, открытых в России. На розничном рынке сеть работает под тремя брендами: «Ригла» — в дорогом сегменте, «Будь здоров» — в среднем и «Живика» — в дешёвом.

Изучаем рынок: зачем аптеке приложение

Дистанционная продажа лекарств была запрещена законом, поэтому аптечный e-commerce развивался не так стремительно, как остальные ритейлеры.

Слухи о снятии запрета ходили несколько лет: ещё в 2017-м Минздрав опубликовал проект постановления для легализации онлайн-продаж лекарств, но принятие поправок постоянно откладывали. Пандемия коронавируса вынудила действовать быстро: 1 апреля 2020 года закон всё-таки приняли.

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

  • Аптеки на каждом шагу. Проще зайти самому, чем ждать курьера и платить за доставку 150—300 рублей.
  • Заказать большую часть ассортимента аптеки с доставкой всё равно нельзя: курьер не привезёт рецептурные, наркотические, психотропные препараты или те, в которых больше 25% спирта.
  • Покупателям важно пообщаться с живым фармацевтом, спросить совета — и онлайн пока такую потребность не закрывает. Об этом мы подробнее писали в материале про цифровую трансформацию аптек.

Тогда зачем аптеке приложение? Исследования рынка интернет-аптек показывают, что спрос есть. Data Insight отмечает что количество онлайн-заказов в интернет-аптеках в 2019 году увеличилось на 98%. Доля интернет-аптек на всём рынке e-commerce — 12%. Конверсия — самая большая среди остальных сегментов рынка: 21,7%. Это выше, чем у онлайн-рынка продуктов питания.

Кейс: как Surf и «Ригла» сделали на одном коде мобильные приложения для трёх аптечных брендов

«Ригла» и другие игроки рынка поняли, что сейчас — идеальное время, чтобы выходить в онлайн и развивать мобильный e-commerce. Если вам интересно, какие достоинства и недостатки есть у приложений других аптечных сетей, прочитайте наш обзор мобильных приложений аптек «Максавит», «Горздрав», «Еаптека», «Планета Здоровья», АСНА и «36,6».

Находим решение: три бренда, шесть приложений — один код

У «Риглы» три аптечных бренда: «Ригла», «Живика», «Будь здоров». Объединять все аудитории в одном приложении неразумно с точки зрения маркетинга: у каждого бренда своя ЦА, география, ценовая политика, программа лояльности.

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

Кейс: как Surf и «Ригла» сделали на одном коде мобильные приложения для трёх аптечных брендов

Surf предложил заказчику решение:

  • Приложения сделать с единой кодовой базой.
  • Написать их на Flutter — кроссплатформенном решении от Google, которое позволяет писать один код для iOS и Android.

Это позволило сократить стоимость и время разработки. Весь продукт с учётом исследований и проектирования сделали за пять месяцев. Причём первое приложение — для «Риглы» — запустили за три месяца. Если вам интересно узнать больше про другие возможности Flutter, прочитайте нашу статью «Почему мобильное приложение на Flutter — хорошая идея для бизнеса в 2020 году».

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

Проектируем продукт: выясняем, почему покупатели аптек не спешат в онлайн и что с этим делать

Покупатели аптек достаточно консервативны: у них только формируется привычка приобретать лекарства онлайн.

Перед разработкой мы изучили, чего не хватает покупателям, чтобы стать активными пользователями мобильного приложения. За эту работу отвечает Surf Product Lab — наше консалтинг-подразделение. Мы проводим исследования, формируем и проверяем гипотезы, помогаем настроить работу продуктовых команд, строим roadmap развития мобильных продуктов.

На старте проектов мы проводим двухдневный CJM воркшоп с командой клиента: создаём Customer Journey Map — карту пути пользователя от возникновения потребности до закрытия. Для этого выделяем ключевые сегменты аудитории, наблюдаем за пользователем со стороны, рассматриваем, как он взаимодействует с продуктом.

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

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

Двухдневный CJM воркшоп с командой заказчика — обязательная практика в Surf. Это не просто часть дизайн-процесса, но и важная точка для командообразования. Это co-creation практика, обоюдное погружение в продукт: по итогу двух дней мы приходим к единому мнению и понимаем, как всё должно быть устроено.

Дмитрий Сидоров,

Арт-директор Surf и продуктолог Surf Product Lab

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

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

  • Первая группа покупает «планово» и знает, что купить: у человека может быть хроническое заболевание, и он давно принимает определенное лекарство. Либо просто пополняет запасы в аптечке: «Дай-ка зайду в аптеку, анальгин закончился».
  • Вторая группа — люди с реальной проблемой, например, с острой болью. Что им купить, они не знают.

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

Кейс: как Surf и «Ригла» сделали на одном коде мобильные приложения для трёх аптечных брендов

Готовим первый релиз: обходим ограничения складской логистики

Приложение важно было выпустить как можно скорее. Нужно было успеть к «высокому сезону»: это зима, начало весны — время, когда люди болеют сезонными заболеваниями типа ОРВИ. «Ригла» заказала разработку, когда пандемии COVID-19 ещё не было. Но к сезонным болезням в этом году добавился коронавирус, приложение стало суперактуальным, и ставки повысились.

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

Работая над приложением, мы столкнулись с ограничениями складской логистики и тем, что препараты неравномерно распределены по аптекам и не могут перемещаться между ними. Нам пришлось проработать десятки сценариев — логика оказалась в разы сложнее, чем в других категориях e-commerce.

Мы учли разные условия доставки лекарств и косметики, наличие в аптеках и разбивку заказов на партии. Получилось семь возможных сценариев при оформлении заказа. Самые распространëнные из них три:

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

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

С программой лояльности пришлось попотеть.

Бэкенд «Риглы» ничего не знает о картах лояльности, но хранит профиль пользователя. Бэкенд эмитента карты ничего не знает о пользователе «Риглы», но хранит номер телефона клиента и данные о карте лояльности.

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

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

Андрей Савостьянов, Flutter-разработчик Surf

Тестируем на реальных пользователях: даём сложную задачу, изучаем реакцию и следим, всё ли получается

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

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

Первые тесты пришлись на время самоизоляции, поэтому в этот раз мы их проводили полностью онлайн через Zoom. В Zoom есть возможность демонстрации экрана телефона: ведущий UX-теста видит, что происходит на экране устройства и куда пользователь нажимает.

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

Дорабатываем продукт: спецпредложение для охотников за скидками, плавные шторки и быстрая корзина

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

Анимация. В первом релизе мы пожертвовали микровзаимодействиями: переходы были немного топорные. Потом доработали: приложение стало симпатичнее.

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

Корзина. Улучшили процесс добавления товаров в корзину. На сайте «Риглы» процесс неоптимальный: чтобы добавить товар, нужно нажать плюсик, появится лоадер, придётся ждать, пока всё прогрузится. Продолжать покупки нельзя. В приложении мы от этого избавились: сначала собираем очередь, потом отправляем запрос на сервер. Можно хоть десять раз подряд тыкнуть — и соответственное количество товаров появится в корзине. Экран при этом не блокируется, ждать прогрузки не нужно.

Кейс: как Surf и «Ригла» сделали на одном коде мобильные приложения для трёх аптечных брендов

Строим планы: добавим умную рекомендательную систему и чат с фармацевтом

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

  • Эквайринг — оплата заказа в приложении.

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

  • Курьерская доставка в регионах. Пока что «Ригла» доставляет лекарства только по Москве. В планах запустить доставку в регионах. Да, это не связано напрямую с приложением: аптечной сети нужно найти надёжных подрядчиков и выстроить процессы. Но пользователи очень ждут эту услугу.
  • Рекомендательная система. Будем собирать персональные подборки, акции. Пользователь заходит в приложение, ему формируется спецпредложение по актуальным симптомам — например, на антигистаминное в сезон аллергий. Следующий этап — система будет анализировать заказы пользователя и формировать подборку специально под него.

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

Аптечный рынок меняется.

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

«Ригла» очень своевременно вышла в онлайн, запустила мобильное приложения, налаживает прямую коммуникацию с пользователем. И делает это успешно: у аптечной сети уже 70% мобильных клиентов, а средний чек в приложении — в разы выше, чем при покупках в офлайне.

Кейс «Риглы» участвует в конкурсе Summer Tagline Awards в номинации «Не выходя из дома»

2424
11
28 комментариев

Респект за Flutter!

11
Ответить

поставил бету Риглы, интересно смотреть как развивается приложение и вы избавляетесь от глюков. Это наверное первое что-то большое по серьезному на Flutter в России (разве только еще "Медуза"). 
Вообщем так держать, и побольше технической инфы, как реализовывали, с чем сталкивались.

8
Ответить

Андрей, спасибо. На vc.ru ждать технических материалов не стоит, лучше следить за ними на https://habr.com/ru/company/surfstudio/. А их там уже много и постоянно появляются новые.

4
Ответить

Самое большое - это "Лига ставок" :) из интересного еще - это Росбанк с приложением для юриков. Я свое тоже постепенно причесываю и скорость работы повышаю)

3
Ответить

Новая Медуза — победитель премии самый кошмарный ui/ux 2020.

Ответить

Flutter объясните выбор, у Surf просто нету разработчиков iOS и Android, а контракт уж очень хотелось ?

Мне просто не понятно, как можно сделать что-то качественное для такой крупной компании как "Протек" на языке который кросс платформенный и как это вообще пропустили в AppStore ?
там же персональные данные и всё такое, которые потом непонятно кто получает, анализирует и храниться всё должно в РФ.

А, я понял просто аймак дорого покупать, поэтому сварганили на чём было, хитрецы)

Ответить

Выбор был именно в пользу кроссплатформы исходя из бизнес-целей заказчика: стоимость и простота процессов при должном уровне качества. Последнее слово за выбором технологии на ЛПР, Surf - это подрядчик.

Второй вопрос непонятен вообще. Причем тут данные в РФ, AppStore? В AppStore лежат сотни тысяч кроссплатформенных приложений, написанных на самых разных технологиях.

Про аймак также без комментариев. Для адекватной разработки кроссплатформы без маков не обойтись.

6
Ответить