Создание кроссплатформенного приложения restore: на Flutter — современное решение для мобильного e-commerce
О бренде
restore: — крупнейшая сеть магазинов и сервисных центров техники Apple в России.
Более 20 лет компания успешно развивается на рынке и занимает ведущие позиции среди ритейлеров электроники премиум-класса.
Помимо продукции Apple, сегодня сеть предлагает широкий ассортимент устройств и аксессуаров мировых брендов — Samsung, Xiaomi, Huawei, Tecno, Asus, Honor и других.
Сегодня restore: объединяет более 90 магазинов по всей стране.
Задача
Компания Progressive Media сотрудничает с restore: уже более 7 лет. За это время было реализовано множество задач, включая такие как: переход на Vue и внедрение Symfony (подробнее - https://www.progressivemedia.ru/cases/restore).
Поэтому, когда у restore: появилась потребность в обновлении мобильного приложения, компания вновь обратилась к Progressive Media.
У клиента было мобильное приложение на платформе Imshop, которое справлялось со своей функцией. Однако встала задача разработать собственное, управляемое и масштабируемое решение, которое поддерживает новые функции и полностью соответствует требованиям бренда.
Ключевые цели проекта:
- разработать собственное кроссплатформенное решение с возможностью дальнейшего масштабирования.
- повысить стабильность и производительность приложения.
- внедрить новые интеграции и расширить функциональные возможности.
- улучшить пользовательский опыт (UX) и удобство интерфейса.
- обеспечить полное соответствие визуальному стилю и требованиям бренда.
Решение
Для реализации был выбран Flutter — современный фреймворк, оптимальный для кроссплатформенных приложений. Решение продиктовано сочетанием высокой производительности, гибкости и скорости разработки.
Преимущества Flutter:
- единая кодовая база под iOS и Android снижает затраты на поддержку и ускоряет релизы;
- высокая производительность и плавные интерфейсы создают нативный пользовательский опыт;
- широкие возможности кастомизации позволяют точно воспроизвести фирменный стиль;
- развитая экосистема плагинов упрощает интеграцию с CRM, аналитикой и маркетинговыми инструментами;
- архитектура Flutter обеспечивает масштабируемость и возможность дальнейшего развития приложения.
Таким образом, Flutter стал оптимальным выбором, позволившим реализовать все ключевые требования: высокую скорость разработки, кастомизацию дизайна и гибкость масштабирования.
Реализация
На стороне заказчика были подготовлены дизайн-макеты, а бэкенд находился под управлением внутренней технической команды. От Progressive Media требовалось реализовать фронтенд часть приложения, интегрировать его с существующими API и обеспечить эффективную координацию между всеми командами разработки.
Был сформирован roadmap, включающий этапы планирования, адаптации дизайна, фронтенд-разработки, интеграций, тестирования и публикации в сторах.
Каждая итерация проходила согласование с командой restore:, что позволяло поддерживать стабильный темп и прозрачность работы.
Процесс велся спринтами с регулярными демо и ревью функционала — это обеспечивало предсказуемость сроков, контроль качества и своевременное принятие решений по приоритетам задач.
Также в зону ответственности специалистов Progressive Media входили адаптация дизайна под технические особенности Flutter, проектирование архитектуры приложения и участие в тестировании продукта.
Дизайн
UI-дизайн приложения был предоставлен клиентом. Команда Progressive Media выдала рекомендации по адаптации макетов под особенности Flutter и доработала отдельные компоненты.
Особое внимание уделили анимациям и интерактивным элементам, чтобы сохранить характерную для restore: плавность и интуитивность пользовательского интерфейса.
Фронтенд-разработка
Основной акцент разработки был сделан на фронтенд-архитектуру и устойчивое взаимодействие с API клиента.
Приложение построено на Flutter с учетом требований к производительности, стабильности и масштабируемости.
Навигация
Система навигации реализована на базе пакета go_router, обеспечивающего гибкое управление маршрутами и поддержку глубоких переходов между экранами.
Для сложной структуры с несколькими независимыми разделами использовалась схема StatefulShellRoute — она позволила сохранять состояние вкладок при переключениях и обеспечила мгновенный отклик интерфейса без повторной инициализации экранов.
Такой подход сделал навигацию максимально предсказуемой для пользователя и упростил поддержку кода. Архитектура маршрутов спроектирована модульно, что позволяет добавлять новые разделы без затрагивания существующей логики.
Deep links и WebView
Для интеграции с внешними источниками реализована система deep links, позволяющая открывать конкретные экраны приложения из push-уведомлений, email-рассылок и рекламных кампаний. Это решение повысило вовлеченность пользователей и упростило переход к целевому контенту.
Кроме того, были внедрены встроенные WebView для отображения контентных страниц, акций и промо-материалов.
Компоненты оптимизированы под требования безопасности и бренд-гайдлайны restore:, что позволило сохранить единый визуальный стиль.
Интеграции Mindbox и Gravity Field
В приложение интегрированы SDK Mindbox и Gravity Field, отвечающие за коммуникации с пользователем и сбор аналитики.
Mindbox используется для персонализированных триггерных рассылок, push-уведомлений, а Gravity Field (система для персонализации сайтов и А/В-тестирования) обеспечивает сбор технических метрик, отслеживание поведения и анализ стабильности приложения.
Благодаря тесной интеграции этих решений удалось создать единую систему, где маркетинг и аналитика работают синхронно, без потери данных между платформами.
Аналитика
Для нового мобильного приложения была развернута комплексная система аналитики, основанная на интеграции AppMetrica и Mindbox. Такое сочетание инструментов позволило отслеживать как пользовательские действия и сценарии взаимодействия внутри приложения, так и эффективность маркетинговых коммуникаций.
В AppMetrica реализована детальная схема событий, охватывающая все ключевые этапы пользовательского пути — от первого запуска до совершения покупки.
Система фиксирует более 30 типов событий, сгруппированных по основным категориям:
- Базовые метрики вовлеченности: запуск приложения, первый вход, возврат пользователя, закрытие и повторное открытие модальных окон.
- Навигационные события: переходы по категориям, использование поиска, просмотр карточек товаров, переходы по рекомендациям и deep links.
- Интерактивные действия: свайпы фотографий, открытие сторис, применение фильтров и сортировок.
- События чекаута: выбор способа доставки, оплата наличными или картой, активация промокода, подтверждение адреса и завершение заказа.
- Маркетинговые триггеры: открытие push-уведомлений, взаимодействие с баннерами и оценка приложения через встроенный review-модуль.
- Профиль пользователя: регистрация, авторизация, изменение персональных данных, добавление товаров в избранное или корзину.
Отдельно были настроены конверсионные события, что позволило выстроить точную аналитику по воронке продаж и сегментировать аудиторию по уровню вовлеченности.
Собранные данные синхронизируются с Mindbox, обеспечивая сквозную аналитику — от источника трафика до повторных покупок. Это позволило маркетинговой команде restore: оперативно оценивать эффективность акций, точечно работать с retention rate и запускать персонализированные кампании на основе реального поведения пользователей.
Результаты
В ходе проекта была решена основная задача — создано современное, стабильное и масштабируемое мобильное приложение, соответствующее требованиям бренда и ожиданиям пользователей.
Разработка нового мобильного приложения restore: на Flutter позволила вывести клиентский опыт на новый уровень и обеспечить устойчивую основу для дальнейшего развития цифрового направления бренда.
Ключевые результаты проекта:
- Положительная реакция пользователей. Обновленное приложение получило высокие оценки в App Store и Google Play. Пользователи отмечают стабильную работу, скорость отклика и удобную навигацию. Retention вырос по всем ключевым метрикам: 1-day — в 4 раза, 7-day — почти в 4 раза, 30-day — более чем в 6 раз.
- Рост производительности. По внутренним метрикам скорость загрузки основных экранов увеличилась в среднем на 10% по сравнению с предыдущей версией.
- Повышение конверсии. Благодаря оптимизированной архитектуре и обновленному UX количество завершенных покупок через приложение увеличилось на 60%.
- Рост вовлеченности. Расширенная аналитика и интеграции с Mindbox и AppMetrica позволили точнее отслеживать пользовательское поведение и запускать персонализированные сценарии взаимодействия.
- Масштабируемость и контроль. Приложение стало полностью управляемым активом restore:, не зависящим от сторонних решений, и готово к дальнейшему развитию функциональности и интеграций.