Почему вам по-прежнему стоит выбрать Flutter для своего e-commerce приложения

В 2021 году общая выручка российских e-commerce компаний составила более $1,5 млрд, а покупатели сделали 2,6 млрд онлайн-заказов. Одним из главных инструментов цифровых продаж является, как несложно догадаться, мобильное приложение.

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

• Что такое Flutter
• Flutter vs коробочное решение
• Flutter vs нативная разработка
• Чем Flutter хорош для e-commerce
• Проекты, в которых Flutter подтвердил свою эффективность

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

Flutter создал Google в 2017 году. Компания проанализировала положительные и отрицательные стороны существующих кроссплатформенных решений и разработала собственную. Как любой молодой инструмент, на первых порах Flutter вызывал некоторую настороженность ИТ-сообщества: сомневались в его функциональных возможностях, задавались вопросом, как скоро Google перестанет вкладывать свои ресурсы в новый инструмент и забросит его развитие.

Однако Flutter быстро преодолел все «проблемы роста» и стремительными темпами набрал популярность. Сейчас это самая популярная в мире кроссплатформенная технология.

Мы в Surf начали работать с этой технологией в 2019 году. С тех пор мы создали в компании большой отдел Flutter-разработки, сотрудничаем с Google в части развития фреймворка, развиваем и поддерживаем Flutter-сообщество в России: записываем подкасты, пишем статьи, задаём собственные стандарты архитектуры в репозитории SurfGear.

За два с лишним года мы реализовали на Flutter более 10 разноплановых проектов, опытным путём проверив, что он подходит для решения самых сложных задач: будь то видеостриминговый сервис, где необходимо высокое качество видео и скорость его передачи, или банковское приложение, где особенно важна безопасность. В этой статье мы уже разбирали, почему Flutter — оптимальное решение для банковского приложения.

Сейчас хотим порассуждать об ещё одной отрасли, которая незаслуженно мало использует разработку на Flutter для своих мобильных приложений — это e-commerce.

Зачастую e-commerce компании выбирают коробочные решения, как наиболее быстрые и дешёвые в реализации. Но это ограничивает компанию в развитии основного инструмента цифровых продаж: ведь внести необходимые изменения в коробочные решения очень сложно. Из-за этого невозможно сделать приложение удобным для клиентов, а это прямой путь к их потере и падению конверсии.

Другой популярный вариант: компания вкладывает много ресурсов в кастомную нативную разработку. Такое приложение обладает очень большим преимуществом перед коробкой: конверсия в нём выше, а реализовать запросы компании — проще. Но у нативной разработки есть один серьёзный недостаток — это высокая стоимость.

В этом случае кроссплатформа может стать отличным выходом: она позволяет сэкономить до 40% на сроках и стоимости разработки. А кроссплатформа Flutter — ещё и создать приложение, не отличающееся для пользователя от нативного. Но давайте разберём всё по порядку.

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

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

Недостатки коробочного решения:

• Низкая адаптация к рынку. Новые фичи для операционных систем появляются в коробочных приложениях гораздо позже, чем при кастомной разработке. Приложение быстро перестаёт оправдывать ожидания пользователей.
• Низкая конверсия. В коробочном решении сложно настроить удобный флоу заказа, учитывающий всю специфику компании: разные варианты доставки, систему лояльности, персонализированные предложения. Из-за этого пользователи часто бросают процесс оформления заказа на полпути, конверсия, соответственно, падает.
• Минимальная техподдержка. Сбои и ошибки придётся решать собственными силами. Техподдержка доступна только в расширенных версиях с увеличенным тарифным планом. К тому же, она не решает кастомные запросы компании.

В чём выигрывает Flutter:

Разработка приложения на Flutter — это разработка с нуля. Она подразумевает большую подготовительную работу: исследование потребностей клиентов компании, особенностей внутренних процессов, всех точек взаимодействия клиента с продуктом, проектирование удобного UI/UX. Результат всегда будет заведомо более кастомный, чем с типовым коробочным решением. В приложении можно детально проработать флоу, реализовать любой дизайн, учесть программу лояльности и другие полезные для ритейла фичи.

Flutter:

• обеспечивает качественный UX — он позволяет тщательно изучить пользовательский опыт и спроектировать удобный интерфейс с учётом всех юзкейсов.
• обеспечивает высокую конверсию. При разработке на Flutter, как и при нативной, можно учесть все барьеры и стоп-факторы. И сделать путь клиента к заказу максимально коротким и понятным.
• гибкий в реализации любых задач и запросов.На Flutter можно сделать свой флоу заказа, с учётом индустрии или особенностей ЦА. Также можно реализовать программу лояльности любого уровня сложности.
• надёжный: кодовая база в этом случае — собственность заказчика. В отличие от коробочного решения, где код принадлежит компании-разработчику и только арендуется заказчиком. В разработке на Flutter, как и при любой другой кастомной разработке, компания управляет проектом и влияет на его развитие.

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

• для iOS: Swift, Objective-C и Xcode;
• для Android: Kotlin, Java и Android Studio.

У таких приложений, как правило, нет критичных недостатков. В них можно полноценно пользоваться сложными фичами, задействуя камеру, GPS или акселерометр. Но и разработка и последующее сопровождение нативных приложений существенно дороже. Разработчики подстраивают весь интерфейс, бизнес-логику и вёрстку под особенности каждой платформы.

Flutter в его текущем состоянии развития мало чем уступает нативной разработке. Он использует язык Dart, который преобразуется в нативный код iOS или Android. Это позволяет делать сложную анимацию и плавные переходы между экранами. У Flutter есть доступ ко всем особенностям обеих платформ. Технологии кроссплатформы позволяют обращаться из Dart-кода напрямую к открытым интерфейсам: сенсорам, файловой системе устройства. Это позволяет создавать такие же быстрые и адаптивные приложения, как и на нативе, только заметно дешевле.

Экономит время и деньги. С Flutter можно сэкономить без потерь в качестве. Создание приложения, которое одинаково успешно будет работать на iOS и Android-устройствах, стоит на 40% дешевле, чем разработка двух нативных. При этом для пользователя не будет никакой разницы по сравнению с нативом.

Позволяет реализовать любой дизайн. Немаловажный аспект для e-commerce-приложения — уникальность. На Flutter можно реализовать любой дизайн, включая сложную анимацию, как это сделано в приложении The Hole.

Time-to-market короче. Приложение на Flutter можно запустить быстрее, чем нативное, и оно раньше начнёт приносить компании прибыль. Для ритейла это крайне важный показатель, так как на современном рынке, насыщенном предложениями, за потраченное время придётся платить репутацией или оттоком клиентов.

Защищает данные. Код приложения зашифрован так, что его нельзя восстановить с помощью реверс-инжиниринга — процесса копирования объекта по уже готовому образцу. Это значит, что приложение на Flutter отвечает требованиям безопасности.

Использует все возможности iOS и Android. В этом смысле кроссплатформенная разработка почти не отличается от нативной, так как использует всё те же нативные технологии самой платформы. В приложении на Flutter можно, как и в нативном, использовать Touch и Face ID, сканер отпечатка пальца, GPS и камеру.

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

Самая большая аптечная сеть России обратилась к нам для создания приложений для трёх своих брендов: «Ригла», «Живика» и «Будь здоров». Нам предстояло создать сразу три приложения для двух ОС: в общей сложности шесть приложений.

Flutter позволил реализовать их на единой кодовой базе. Благодаря этому, мы сэкономили 40% клиентского бюджета по сравнению с нативной разработкой.

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

Мы проработали десятки сценариев покупки — логика оказалась в несколько раз сложнее, чем в других сферах e-commerce. Нам пришлось разработать разные условия для доставки лекарств и косметики, учитывая наличие товара в аптеках. Получилось семь возможных сценариев при оформлении заказа.

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

Для проекта «Ужин дома» мы разработали на Flutter лаконичное и функциональное приложение. Работа над этим приложением показала, насколько в e-commerce важна связка «сайт — мобильное приложение». В приложение перешло много пользователей с сайта, а также пришёл новый трафик непосредственно в мобайл. Этого удалось достичь благодаря эксклюзивной фиче, доступной только в приложении: подбору рецептов.

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

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

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

Приложение My BMW писали на Flutter инхаус-разработчики компании. Это универсальный интерфейс для взаимодействия с автомобилем. Пользователь может проверить техническое состояние машины: полноту бака и заряд аккумулятора. Приложение отправит уведомление, если требуется техническое обслуживание, например, заменить масло.

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

Популярный сайт для торговли недвижимостью Realtor.com создан в США, в середине 90-х. У компании были нативные приложения отдельно для двух платформ: iOS и Android. В 2019 году они решили поэкспериментировать и с помощью Add-to-app добавили в них новые фичи, написанные на Flutter. Кроссплатформа хорошо себя зарекомендовала и компания решила переписать основную часть приложения на Flutter. Время разработки, благодаря использованию кроссплатформы, сократилось в два раза.

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

У крупного китайского концерна уже несколько приложений написано на Flutter. Приложение English AITeacher с помощью ИИ подстраивает программу занятий английским онлайн индивидуально под каждого студента. Приложение Now Live — платформа для телевизионных трансляций и live-стримов. Проект Mr.Translator — не простой словарь, а полноценный переводчик и помощник в изучении иностранных языков. Приложение DingDang — голосовой помощник на базе искусственного интеллекта. Он помогает владельцам с несложными запросами: зачитывает прогноз погоды, участвует в планировании дела, рассказывает новости или включает музыку.

Графический движок Flutter позволил разработчикам Tencent использовать в своих приложениях широкий спектр графических возможностей: SVG, шрифты-иконки и Flare.

Flutter сегодня — одна из самых перспективных кроссплатформ, лидер рынка, который уверенно отрывается от соперников. Мы видим большой спрос на эту технологию со стороны компаний из разных сфер деятельности. Уверены, вскоре мы увидим ещё больше приложений на Flutter, ведь уже сейчас ему доверяют крупные игроки ритейла (Ригла), фудтеха (KFC) и финтеха (Росбанк). На Flutter разработано уже много популярных приложений для разных сфер: от сервисов доставки до автоконцернов. Это неудивительно, ведь кроссплатформа позволяет создать приложение, которое не отличается по функциональности от нативного, но с гораздо меньшими затратами.

Ещё один важный в текущих обстоятельствах момент — это гибкость фреймворка. Его можно интегрировать не только с платёжными сервисами Google или Apple, но и с любыми альтернативами.