Все побежали, и Finch побежал: как мы придумывали свой суперапп с кэшбеком и ботами

Рассказывает соучредитель Дима Щипачев.

Все побежали, и Finch побежал: как мы придумывали свой суперапп с кэшбеком и ботами

Привет. Меня зовут Дима Щипачев, я один из основателей компании Finch. Мы создаем высоконагруженные проекты для крупных брендов вроде «Газпром-медиа», «Спартака» и «Столото».

Помимо основной работы, время от времени мы развлекаем сотрудников, запуская внутренние проекты разного масштаба — от собственной школы разработчиков до стартап-инкубатора. Без внимания не остается и отдел дизайна: мы активно продвигаем внутри компании наш собственный подход — в том числе и разрабатывая проекты по собственной инициативе.

Фото с одного из наших митапов​
Фото с одного из наших митапов​

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

Как мы вообще рисуем

  1. Первый этап — product vision. Обычно это презентация, в которой собраны примеры интерфейса приложения и описаны сценарии использования. Product vision — это не прототип, не дизайн, не ТЗ на разработку и не бизнес-план, но он сочетает элементы всех этих документов.
  2. Над созданием product vision у нас работает команда из дизайнера, одного из руководителей бизнес-юнита и архитектора. Мы не делим процесс создания приложения на стадии «прототипируем — дизайним — программируем», а пытаемся найти подходы на стыке бизнеса, разработки и пользовательского интерфейса, которые дают наибольший кумулятивный профит.
  3. Мы не любим начинать с прототипов или CJM, полностью лишенных какой-либо визуальной стилистики. На стадии продумывания архитектуры контента и навигации уже хочется иметь представление о том, насколько чистым и понятным получается конкретный интерфейс, поэтому мы сразу прототипируем «по красоте».
  4. При этом мы убираем из уравнения бренд (если он существует), цветовые решения и изображения. Часто цвета и картинки замыливают глаз и создают ощущение «красивого интерфейса», хотя по сути дела ничего осмысленного на картинке не нарисовано. Бренд же в приложениях (это обусловлено самой утилитарностью жанра) вообще выпячивать не стоит, хотя большинство клиентов с этим не согласны. Наш дизайн должен быть красивым, удобным и полезным в любом брендировании и с любой раскраской.
  5. Приложения хороши тем, что в них особенно важен смысл того, что ты рисуешь. За дизайнами сайтов исторически тянется шлейф «веб-дизайна», который в современных условиях лишь мешает информации и сервисам распространяться (я уже говорил почем он должен умереть). Поэтому для нас важнее всего определиться с тем, есть ли вообще место на проекте для проведения подобной работы. Если мы этого не можем придумать — рисовать product vision нет смысла, можно просто взять аналогичный продукт и отдать техническому дизайнеру на перекраску.
​Общая схема экранов
​Общая схема экранов

Он вам не Олег

Основная задача любого «супераппа» — объединить в одном мобильное продукте множество разнообразных сервисов: такси, доставка еды, покупка билетов, заказ лекарств и так далее. Для каждой подобной интеграции в стандартной реализации необходимо придумать свой пользовательский путь, отрисовать и запрограммировать экраны и формы, разработать API. Первой задачей, которую мы себе поставили, было упрощение этих процессов с целью получить возможность как можно более быстро и унифицировано добавлять в наш «суперапп» разнообразные сервисы.

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

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

Все побежали, и Finch побежал: как мы придумывали свой суперапп с кэшбеком и ботами
Все побежали, и Finch побежал: как мы придумывали свой суперапп с кэшбеком и ботами

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

Всегда в контексте

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

Все побежали, и Finch побежал: как мы придумывали свой суперапп с кэшбеком и ботами

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

Все побежали, и Finch побежал: как мы придумывали свой суперапп с кэшбеком и ботами

Выстраиваем сеть партнеров

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

Все побежали, и Finch побежал: как мы придумывали свой суперапп с кэшбеком и ботами

Например, в приложении есть сервис доставки «СушиФинч», и пользователь часто заказывает там еду. После очередной покупки наш «суперапп» отправит ему пуш: «Мы видим, что ты часто заказываешь суши в «СушиФинч» через наше приложение и уже сэкономил N рублей. Советуем оформить их карточку, чтобы тебе начислялись дополнительные баллы и показывались эксклюзивные сеты».

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

Кэшбек и скидки

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

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

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

Все побежали, и Finch побежал: как мы придумывали свой суперапп с кэшбеком и ботами

Четыре корзины для работы с деньгами

Одного финблока мало. Раз мы начали тему осознанной траты денег, то мы решили развить эту тему. При создании продукта, мы ориентировались на студента 18-22 лет, который каждый день тратит деньги на такси и заказ еды, а в конце месяца удивляется почему на карточке ничего не осталось. Что мы можем предложить ему, чтобы помочь научить управлять деньгами?

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

В начале месяца пользователь отмечает обязательные платежи — квартплату, ЖКХ, учебу, уборку, которые сразу вычитаются из общей суммы накоплений.

Скины

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

Все побежали, и Finch побежал: как мы придумывали свой суперапп с кэшбеком и ботами

Что дальше?

Сейчас «суперапп» развивается как креативный проект, но кто знает, может быть через пару лет вы увидите его на рынке. Если вы хотите создать подобный проект или у вас просто есть идеи приложения, то напишите мне в Telegram (@dshipachev). Stay tuned.

Все побежали, и Finch побежал: как мы придумывали свой суперапп с кэшбеком и ботами
4444
14 комментариев

Боты это обрезанное взаимодействие обычного апп. Которое в 99% случаев неудобное. Моки выше это в принципе подтверждают. Неудобные варианты с фильтром, например "хочу другой фильм" не выбрали.

В еде выбрали, но скрыли как работает "хочу что-нибудь другое" — это непонятно. Я бы посмотрел как бы вы туда засунули меню Тануки например.

7
Ответить

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

3
Ответить

"создаем высоконагруженные проекты для крупных брендов вроде «Газпром-медиа», «Спартака» и «Столото»"
После перечисления таких "партнеров" даже читать не стал дальше.

2
Ответить

«Даже читать не стал дальше»
Но оставляет комментарий
??

1
Ответить

Какой смысл в таком приложении для бизнеса, если дешевле сделать бота для Telegram?
А главное, что заставить консьюмера мучиться заказывая билет в кино через бота, а не в удобном агрегаторе?

1
Ответить

ответ на первый вопрос: отсутствие в телеграме финансовой платформы
ответ на второй вопрос: наличие в супераппе финансовой платформы

Ответить

Супер UI 

1
Ответить