Дизайн
Finch Melrose
4930

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

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

В закладки
Аудио

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

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

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

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

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

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

Он вам не Олег

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Скины

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

Что дальше?

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

{ "author_name": "Finch Melrose", "author_type": "self", "tags": ["\u0447\u0430\u0442\u0431\u043e\u0442\u044b","\u0441\u0443\u043f\u0435\u0440\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f"], "comments": 14, "likes": 32, "favorites": 115, "is_advertisement": false, "subsite_label": "design", "id": 122245, "is_wide": true, "is_ugc": true, "date": "Wed, 22 Apr 2020 16:06:39 +0300", "is_special": false }
Промо
Коротко: онлайн-хакатон для дата-сайентистов с призовым фондом в $25 тысяч
Здесь ждут и любителей, и профессионалов, но конкуренция будет серьёзной.
Объявление на vc.ru
0
14 комментариев
Популярные
По порядку
Написать комментарий...
7

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

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

Ответить
3

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

Ответить
2

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

Вы еще слак как пример приведите. Они там работают потому что это простой доступ к пользователям и скорость разработки.

В случае с супераппом эти преимущества не работают и получаем тупо неудобное приложение.

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

Не вижу преимуществ в масшатбируемости. Еще раз говорю - покажите меню тануки в формате чат-бота

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

Т.е. "мы понимаем что сделали неудобно, но для популярных решений можно нормальный UI".

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

Ответить
0

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

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

Ответить
1

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

Ответить
0

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

Ответить
1

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

Ответить
0

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

Ответить
1

Не вижу проблемы, есть дешевое решение интеграции бота, например, с Робокассой для приёма платежей, где есть Apple/Google Pay.

Дмитрий, мне кажется, вы занимаетесь каким-то самообманом, подгоняете реальность под свой Product vision.
Исследования, это не так больно и затратно, попробуйте провести хотя бы эмпатическое интервью. Закажите пиццу через бота в Telegram, записывайте, что делаете с отметкой времени и эмоцией по 5 бальной шкале. На выходе у вас получится ваша CJM, где вы прочувствуете всю боль работы с ботом.
После этого можно будет обсудить мой второй вопрос, что заставит покупателя заказывать услуги и совершать покупки через бота.

Ответить
1

Супер UI 

Ответить
1

Согласен, интерфейс бота не удобен. Лучше бы сделали мини приложения как в wechat.

Ответить
1

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

Ответить
1

Хорошая идея, чтобы не нагромождая приложение охватить максимум услуг в одном приложении (практически на одной странице, к чему все стремятся)
Считаю, что бот в приложении лучше чем просто бот в том же телеграме. Помимо отсутствия фин. части и нерешенной ситуацией с блокировкой, отклик на бота не всегда такой быстрый как хотелось бы. Не знаю как в приложении он себя ведет, но думаю скорость отклика там можно сделать оптимальной.
Действительно сложно в бот вписать возможности заказа еды, но возможно вопрос решаемый. Хотя бы посмотреть на vc статью о чат боте для заказа еды (ребята решают этот вопрос через чтение сообщения от клиента виртуальным помощником, как я понял). Можно сразу предлагать позиции, которые обычно клиент заказывает, или хиты в этом заведении. В любом случае, чтобы сделать выбор, нужно посмотреть меню. При повторных заказов можно выводить меню без фотографий. Или искать оптимальный способ взаимодействия дальше,что дает свое приложение.
После того как в последние годы начал развиваться кешбек, думаю дальше пойдут программы лояльности ориентированные под конкретного пользователя. Разные проценты кешбека в зависимости от трат, как вариант.  Опять же в вашем супераапе это тоже можно сделать. Или рассмотреть программу лояльности через  подписки как у яндекса(у них плюс)  или мэйлру. Подписка может давать клиенту или скидку, или кешбек.
Так как брали пример с тинькоффа, то выписали приложение от лица банка. Может быть можно будет не привязываться к определенному банку, тогда не будете ограничены аудиторией одного банка. Только появиться проблема - чтение трат с карты. Но это так уже, мысли вслух.

Ответить
0

Кешбэк и всяческие программы лояльности для кого? Зачем?

Это зло - которое несёт в себе информационное насилие и маркетинговое рабство, в замен на жалкие гроши.

Ответить

Прямой эфир