Разработка кроссплатформенного мобильного приложения на Flutter. 

Клиент

«Novex» — первая в Сибири и четвертая по размеру в России сеть дрогери формата. Предприятие занимается оптовой и розничной торговлей косметикой, парфюмерией, бытовой химией и хозяйственными товарами.

Задача

Мы давно сотрудничаем с Novex.

В 2021 году мы перезапустили интернет-магазин заказчика с 1С-Битрикс на Symfony, что в два раза ускорило работу сайта и повысило конверсию заказов в три раза.

При этом по данным аналитики, более 60% клиентов Novex пользуются мобильной версией сайта. Чтобы облегчить их взаимодействие с магазином, заказчик принял решение создать отдельное мобильное приложение. 

Решение

Единый бэкенд для сайта и мобильного приложения

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

Для того, чтобы не разрабатывать несколько приложений (отдельно под iOS и Android), мы выбрали для работы Flutter.

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

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

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

Интеграция с Mindbox

Для того, чтобы персонализировать для пользователей контент и рекламные предложения, мы доработали бэкенд и интегрировали интернет-магазин с Mindbox.

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

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

Кроме того, Mindbox работает и с данными офлайн-покупок, поэтому все бонусные баллы со всех заказов в сети Novex всегда актуальны.

Возможности, которые даёт мобильное приложение покупателям 

1. Выбор способа доставки

У сети Novex обширная сеть магазинов в нескольких городах, при этом:

• есть склады, с которых можно заказать доставку товаров;
• есть склады-магазины, из которых можно заказать доставку, оформить самовывоз или просто зайти по дороге домой.

Поэтому в мобильном приложении мы предусмотрели возможности для пользователей:

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

2. Голосовой поиск

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

3. Поиск товара в магазине по штрих-коду 

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

Для этого достаточно отсканировать штрих-код товара и, если идентичный товар есть в каталоге Novex, он появится в поиске и сразу же будет доступен к заказу.

4. Бонусная карта и баллы

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

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

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

С приложением всё стало намного легче и удобнее!

5. Оценки и отзывы о товарах

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

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

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

На основании оценок и отзывов складывается рейтинг того или иного товара – это позволяет пользователю быстрее ориентироваться в каталоге при выборе из нескольких вариантов.

6. Уведомления от Novex

Пользователи нашего приложения могут настроить, какие уведомления от Novex они хотят получать и как: на email, через пуш-уведомления в приложении или SMS-оповещениями.

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

Особенности релиза мобильного приложения

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

Вот с чем мы столкнулись в этот раз при публикации приложения в App Store.

Этот мини-кейс может пригодится тем, кто имеет дело с публикацией приложений в App Store — далеко не всегда нужна техническая информация в ответах модераторам, иногда важнее описать, как приложение помогает заботиться об удобстве пользователей, даже если вы собираете их персональные данные.

Результат

В итоге у нас получилось не просто мобильное приложение, а настоящая программа лояльности в кармане! 

С его помощью пользователи могут совершать все нужные им действия: 

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

Мы сократили время на разработку приложения, потому что разрабатывали не два отдельных приложения для iOS и Android, а сделали одно кроссплатформенное решение на Flutter. 

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

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