ВК такси. Приложение для вызова такси «Ситимобил» через «ВКонтакте»

#Транспорт и логистика
#Mobile
2018 — 2019
Вижуал ВК такси

о клиенте

Ситимобил

«Ситимобил» — один из ведущих сервисов заказа такси через мобильное приложение, веб-сайт или оператора. Доля в собственности «Ситимобил» была приобретена Mail.Ru Group (теперь VK), в которую входит 
и «ВКонтакте».

Основная задача

платформа VK Mini Apps

VK Mini Apps — платформа с большими перспективами. На момент старта проекта для неё было разработано не так много приложений. Команда arcsinus выступала в роли первопроходцев и решала нетривиальные задачи вместе с командой VK Mini Apps.

Платформа VK Mini AppsПлатформа VK Mini Apps

Задача

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

логотип VK
задача
Ход работы

решение

Разработать приложение (Mini App) для заказа такси в самой популярной социальной сети России. Интегрировать его с социальными функциями «ВКонтакте» и сделать удобным для пользователя.

автомобиль таксиРешение
Арам Аракелян

Арам Аракелян

Сооснователь и генеральный директор
«Ситимобил»

Мы хотим, чтобы пассажиры могли заказывать такси без лишних действий. Такая синергия такси и соцсети — уникальная история. 
В России нет ни одного крупного сервиса такси, интегрированного
в крупнейшую российскую социальную сеть. Благодаря совместным проектам в Mail.ru Group мы объединяем свою экспертизу и помогаем пользователям решать их повседневные задачи. В рамках проекта заказа поездок через «ВКонтакте» мы планируем не только повысить лояльность нашей действующей аудитории, но и привлечь новых пользователей благодаря интеграции сервиса в соцсеть.

сложности

Классические приложения заказа такси, к которым мы привыкли, — это нативные мобильные приложения. VK Taxi написано с использованием фреймворка React и библиотек VK UI и VK Connect. Привычные нам фичи — карта, движение и поворот машинок, — понятно реализуются в нативных приложениях, а в вебе с ними возникает много вопросов.

Основная особенность — интеграции с соцсетью: пользователи могут разделить стоимость поездки с друзьями, а также выбрать в качестве пункта назначения адреса, указанные в сообществах «ВКонтакте» (магазины, кафе и другое). В официальных приложениях под Android и iOS встраиваемое приложение открывается в WebView и интегрируется с основным с помощью библиотеки VK Connect.

СложностиСложности

интеграции

1

Сервис аналитики отслеживает и передаёт команде VK Taxi события в приложении

2

«ВКонтакте» предоставляет платформу VK Mini Apps
и информацию о пользователях

3

Сервер «Ситимобил» используется для расчёта стоимости поездки, оформления заказа, хранения истории поездок
и адресов. Организует логистику и передаёт данные о заказах.

неточности

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

карта и отображение машин

Процесс поиска водителя отображается на карте. Когда водитель подтверждает заказ, пользователь видит местоположение такси. Важно отображать передвижение автомобиля на карте плавно и непрерывно — анимация должна начинаться сразу. Мы протестировали пять разных алгоритмов, но каждый раз результат был далёк от идеала. Где-то машина не поворачивалась, где-то криво отображалась карта. Движение машин легко сделать
в нативных приложениях, но в вебе при отображении динамических объектов на карте возникают сложности.
Мы изучили массу источников и нашли англоязычную статью
с похожим кейсом в блоге индийского каршеринга. Сделали 
по аналогии — и это сработало.

Карта и отображение машин

оплата и завершение поездки

Оплатить поездку можно через VK Pay или банковской картой. Сумму легко разделить с другими пользователями «ВКонтакте». При оплате через VK Pay пользователи получают скидку 15 % на первые 10 поездок. В конце поездки пользователь оценивает заказ. Если оценка ниже 5, приложение просит указать причину или оставить комментарий.

Оплата и завершение поездкиОплата и завершение поездки
Результат

Работа над проектом длилась полгода

Дизайн приложения сделан по гайдам «ВКонтакте» под авторским надзором дизайнеров главной соцсети Рунета. Это уже не первый проект для «Ситимобил», с компанией нас связывает долгая история продуктивного сотрудничества.

Работа над проектом длилась полгода
Оганес Аракелян

Оганес Аракелян

Соучредитель «Ситимобил»

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