Лабиринт

Дизайн начинается с главной

Совместно c Лабиринтом мы неделю брейнштормили, как может выглядеть продукт. Результатом передачи знаний о сервисе стали две страницы брифа и макеты, четко отвечавшие на вопрос: как вы себе представляете главную страницу мобильного приложения?

Уточнив техническое задание, мы начали отрисовывать дизайн, соответствующий визуальным предпочтениям заказчика и функциональности, которую он хочет получить.

Лабиринт давал стилистические наметки, а разработчики Surf углублялись, как это должно выглядеть в соответствии со стандартами мобайла.

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

Старт разработки: перспективный iOS

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

Это сейчас смартфон на Android способен составить существенную конкуренцию айфону, а в 2015 году приоритетными были пользователи iOS.

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

Параллельно с дизайном проектировали API, оптимизировали работу сайта labirint.ru и нашли несколько ошибок.

Проектирование информативных экранов

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

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

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

Версия для планшетов

Масштабности проекту добавляет и тот факт, что версия для айпадов и андроид- планшетов другая, переверстанная.

Больше места на планшете позволяет уместить все на одном экране без скроллинга. Некоторые экраны даже выглядят по-разному на планшете и в телефоне.

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

Первыми в России внедрили Instant Apps

2017 год выдался неплохим и для Surf, и для Лабиринта. Instant Apps — технология Google, позволяющая пользоваться сжатым до 4 МБ мобильным приложением без установки его на телефон.

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

Пользователь может совершать шаги вплоть до оформления заказа, а установить приложение предлагается уже на стадии покупки.

Грамотно конвертировать нативное приложение в Instant App сложно: нужно учесть основные сценарии использования, но не забывать о минимализме. Эффективность повышается качественной настройкой SEO.

Ловить волну обязывает положение: Surf входит в число 25 студий, сертифицированных Google. Это открывает путь к программам раннего доступа, мы первыми пробуем новые технологии еще до их выхода в свет.

В 2017 году жителям России стали доступны сервисы бесконтактной оплаты. Конечно, мы тут же подарили пользователям Лабиринта возможность добавить в приложение банковскую карту для оплаты покупок, внедрив Android Pay и Apple Pay.

На закрытом хакатоне Google для лучших Android-разработчиков Surf заняли первое место за добавление Android Pay в приложение всего за пару часов.

Скидки, бонусы и пользовательский контент в карточке товара

Акции

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

Кэшбек

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

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

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

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

Визуальный поиск на нейросети

В 2018 году у Лабиринта появился визуальный поиск. Увидев интересную книгу в офлайн-магазине или на полке у друзей, вы легко можете найти ее в каталоге Лабиринта. И узнать цену со всеми скидками. Достаточно просто навести камеру на обложку.

Работа визуального поиска построена на нейросети. Идеальный вариант — когда она функционирует на самом устройстве.

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

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

Развитие проекта: бесконечный Лабиринт

Ряд функций, которые обсуждались на этапе проектирования, откладывались на дальнейший рост приложения.

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

Сложная программа лояльности

Каталог подарков. Пользователи копят скидки, которые накладываются друг на друга.

Быстрый поиск по нескольким видам контента:

Авторам, книгам, рубрикам. Синхронизация корзины в приложении и на сайте.

Огромный каталог с многоступенчатой вложенностью

Кэширование контента и быстрая работа приложения.

И много других мелочей:

Авторизация по 8 соцсетям, телефону и другим способам. 15 типов оплаты и 9 видов доставки.

Нереализованные фичи ранжируются по приоритетам.

Рабочая схема сотрудничества с Лабиринтом — это ежегодные сессии, посвященные развитию и новым функциям приложения.

Провести UX-исследование корзины, применить гугловскую технологию Firebase по предсказанию клиентского оттока и улучшить рекомендательную систему.

Приложение на обеих платформах обновляется раз в 2-3 месяца, расширение функциональности продолжается. Сегодня мобильный Лабиринт опережает в развитии веб-версию.

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