Кейс «Детский мир»: как грамотно перенести интернет-магазин в смартфон и оправдать ожидания миллионов пользователей
Команда 65apps снова сделала образцовое приложение. На этот раз мобильный интернет-магазин, который покорил сердца миллионов клиентов «Детского мира».
За первые недели после запуска пользователи совершили в нем больше 100 000 покупок, а ещё через месяц, несмотря на сезонный январский спад, доля онлайн-продаж через приложение достигла 15% и продолжает расти.
О том, как создавалось приложение, рассказывает CTO 65apps Алексей Чувашов.
«Берясь за проект, мы хотели приложить руки и головы к созданию лучшего в мире e-comm приложения. Чего бы это ни стоило», - СЕО 65apps Дмитрий Желнин.
Чем крупнее ритейлер, тем сложнее разработать хорошее мобильное приложение для его интернет-магазина. Так было и в случае с сетью «Детский мир»: сложный ИТ-ландшафт, большое разнообразие связанных систем и распределенная ответственность между микросервисами – все это требовалось соединить, чтобы создать единую точку входа для мобильного приложения. Главной нашей задачей было создать действительно удобный и функциональный инструмент для совершения покупок и оправдать ожидания миллионов клиентов.
Прежде чем создать полноценное мобильное приложение, существующую ИТ-инфраструктуру заказчика необходимо было доработать. Поэтому реализацию разбили на два этапа: сначала сделали электронную систему лояльности, а затем полноценный мобильный интернет-магазин.
Этап #1: Программа лояльности
В 2018 году мы разработали приложение с системой лояльности и личным кабинетом пользователя. Оно решило больную проблему: огромные расходы на СМС.
На этом этапе мы реализовали одну из важнейших интеграций: создали новый бэкенд для мобильных приложений и подключили к нему сервис для коммуникации с пользователями системы лояльности.
В итоге новое приложение полностью заменило физическую бонусную карту, которую раньше можно было потерять, дублировать или передать другому покупателю.
Клиенты «Детского мира» получили возможность не пропускать скидки и получать персональные предложения.
А «Детский мир» сократил расходы на СМС-рассылки, получил новый канал для активации клиентов без дополнительных затрат, решил задачу по антифроду пользовательских бонусов и индивидуализировал отношения со своими покупателями.
После того, как приложение с программой лояльности было опубликовано, департамент разработки «Детского мира» перешел к следующему шагу – начал готовить и детализировать архитектуру и дизайн для нового приложения.
Этап #2: Интернет-магазин
На втором этапе нужно было создать полнофункциональный мобильный интернет-магазин. С полностью собственным дизайном, дружелюбным интерфейсом, удобным поиском по каталогу с использованием различных фильтров, корзиной, оплатой и доставкой. В общем, – лучший мобильный интернет-магазин в мире.
Для многих офлайн-ритейлеров такого масштаба это сложная задача. Трудности возникают из-за большого количества унаследованных IT-решений в инфраструктуре: каталоги товаров, системы обработки заказов, решения для управления складами и логистикой, кассовые сервисы.
Для того чтобы объединить всю функциональность в одном мобильном приложении, высоких компетенций в мобильной разработке недостаточно. Необходим опыт в решении сложных интеграционных задач с пониманием специфики омниканальной инфраструктуры.
Мы приняли решение работать без тестовой среды – сразу с «боевым» API интернет-магазина, чтобы быстро получить доступ к единому, уже сформированному контенту. С одной стороны, мы значительно сэкономили бюджет и сократили сроки на разработку отдельного бэкенда для мобильного приложения. Но с другой стороны — API приходилось дорабатывать «на лету» под выявляемые нюансы, а вслед за этим дорабатывать и мобильное приложение.
Проект имеет свои особенности. Например, у «Детского мира» свой, уникальный подход к дизайну. Интерфейс приложений для iOS и Android максимально похож и проработан до мелочей. Отдельная фишка — кастомная анимация при нажатии кнопок. Конечно, такой подход требует серьезных ресурсов при разработке и тестировании. Мы не раз меняли и дорабатывали дизайн под выявляемые нюансы. Но результат получился превосходным — приятный, позитивный дизайн, которые не оставит пользователя равнодушным.
Разработчики «Детского мира» в тесном контакте с нашими специалистами сумели решить все возникающие вопросы и создать удобное функциональное приложение для покупателей.
Интеграции: как это было
Интернет-магазин «Детский мир», помимо собственных IT-решений, использует и сторонние сервисы для автоматизации ряда задач.
Фактически, у мобильного приложения «Детского мира» три бэкенда. Это нестандартное решение, но в данном случае оно отлично работает.
1. Основной бекэнд — API интернет-магазина «Детский мир». Отсюда мы получили весь контент для поиска и заказа товаров: карточки, категории и описания, отзывы, фотографии, а также остатки на складах и наличие в магазинах.
2. Второй бэкенд — это API для интеграции с решениями компании «Центр финансовых технологий» (ЦФТ), которая поддерживает программу лояльности «Детского мира». Мы реализовали эту часть еще на первом этапе, когда разработали электронную систему лояльности. Эта интеграция отвечает за создание бонусных карт, авторизацию по ним, баланс бонусов, отображение QR-кода, хранение регистрационных данных.
В новом мобильном приложении она получила развитие. Теперь в приложении есть проверка и предупреждение о необходимости обновления. А еще все текстовые ресурсы переехали на бэкенд – это дало возможность отделу маркетинга экспериментировать с дизайном без привлечения разработчиков и перепубликации приложения.
3. Третий бэкенд потребовался для Mindbox – платформы автоматизации маркетинга. В интернет-магазине «Детского мира» ее используют для проведения рассылок и уведомления пользователей о новых акциях. Это дает возможность проводить рассылки через несколько каналов доставки, используя данные от программы лояльности.
Надежность и отказоустойчивость
По предварительным расчетам, аудитория мобильного приложения должна была расти в 5-10 раз быстрее, чем число пользователей сайта, где фиксируется до 50 000 одновременных посещений. И мы были к этому готовы.
Для оптимизации нагрузки на бэкенд мы заранее предусмотрели архитектуру распределенных серверов и использовали кэширование запросов пользователей.
«Веб-версия интернет-магазина способна выдерживать до 50 000 клиентов одновременно. В мобильном приложении нагрузка ожидалась сопоставимой, поэтому в разрабатываемом решении нам пришлось предусмотреть нюансы как в архитектуре, которую проектировала команда «Детского мира», так и в нативных приложениях, которые разрабатывали 65apps».
Результаты и планы
Уже в первом релизе – это крутой полноценный интернет-магазин, который не уступает функциональности на сайте.
Детально проработан поиск товаров с различными фильтрами: по наличию в магазине, полу и возрасту ребенка, бренду, категориям, акциям. Это трудоемкая работа, ее непросто реализовать и в бэкенде, и в мобильном приложении. Поэтому сейчас не в каждом мобильном интернет-магазине есть такая возможность — и приложение «Детского мира» по качеству проработки сильно выделяется среди конкурентов.
Это сказывается на результатах: приложение было запущено в декабре, и в первые недели его установили сразу 600 000 покупателей. Сезонный январский спад не повлиял на рост аудитории: в декабре доля покупок в приложении составляла 4% от всех онлайн-заказов, а в январе – уже 15%.
Уже за первый месяц через приложение было сделано более 100 000 покупок, за январь это число увеличилось в несколько раз и стремительно растет.
Алексей Баранов, менеджер проектов 65apps:
«Все задачи, запланированные на данном этапе работы, мы полностью реализовали. На ближайшее будущее мы уже сформировали пул работ по совершенствованию мобильных приложений. Наше сотрудничество с «Детским миром« продолжается — заказчик постоянно работает над развитием своих решений. Команда «Детского мира» будет развивать IT-инфраструктуру, улучшать отдельные элементы интернет-магазина. И вместе с этими улучшениями будет меняться функциональность мобильного приложения».
«Мобильное приложение по функциональности догоняет сайт. Теперь, когда мы развиваем интернет-магазин «Детского мира», мы одновременно вносим изменения и на сайт, и в мобильное приложение.
Ближайшим шагом станет новая корзина на сайте — ее же мы повторим в мобильном приложении в виде нативных экранов».