Дизайн приложения для Лабиринта

Клиент

Лабиринт входит в тройку крупнейших книжных магазинов России и в топ-25 онлайн-ритейлеров Рунета.

Это полномасштабный интернет-магазин с сотнями тысяч SKU

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

Книжный Лабиринт был основан в 1991 году, а в мобайл пришел в 2015-м — сразу в Surf. Наш дизайн понравился больше всего, и мы выглядели самыми заинтересованными в общении. Хотя цена была не ниже, чем у остальных.

Задача

Мобильный дизайн для Лабиринт

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

• Главная должна была отразить все разнообразие товаров и определить стиль остальных экранов
• Гармонично разместить на главной 15 каруселей 3-х видов — это половина успеха. И это только начало

Решение

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Instant Apps — максимально быстрый поиск

Instant Apps запускается без установки приложения. В нашем случае это решение для штрихкодов — можно отсканировать код на обложке и мгновенно попасть на страницу книги.

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

Пользователи могут найти книгу, просто наведя камеру на обложку. Приложение распознаёт её и покажет страницу со всеми скидками. Достаточно просто навести камеру на обложку.

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Отзыв