Оглавление

    Разработка мобильного приложения на Flutter: цена, сроки, примеры

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

    Flutter в 2020 году: что изменилось

    Flutter — молодой фреймворк: версия 1.0 вышла всего два года назад, поэтому разработчики видели много его «детских болячек». Проблемы с производительностью и отображением шрифтов, падения движка, непохожие на натив элементы iOS — всё это было исправлено в многочисленных обновлениях. Flutter обзавёлся полезными фичами, такими как null-safety и extensions, сообщество создало почти 13 тысяч библиотек. Приложения на этом фреймворке уже практически не отличаются от нативных.

    Flutter развивается: по данным Stack Overflow, в 2019 году он занимал 14 место по популярности, а в 2020 — уже девятое. Google ведёт YouTube-канал, где учит разработчиков тонкостям работы с фреймворком. Во Flutter поверили Alibaba, Ebay, BMW и Tencent, на нём работает Google Pay и продукты Яндекса: Про, Лавка, Go.

    Всё это говорит о том, что в 2020 году нужно обратить внимание на Flutter.

    Критерии выбора технологии для мобильного приложения

    Четыре важнейших критерия при выборе технологии для мобильного приложения:

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

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

    • низкая производительность на слабых устройствах;
    • обращение к сторонним библиотекам-оберткам — риск появления непредвиденных ошибок;
    • проблемы с реализацией удобного пользовательского интерфейса с характерным для операционной системы элементами.

    Проблемы вызваны архитектурой, которая примерно одинакова для большинства кроссплатформенных фреймворков. У Android и iOS разные нативные модули, и для связи с ними фреймворки используют специальные мосты — к примеру, как JS-bridge у React Native. Система работает неидеально, поэтому на каждой платформе приложение отображается и ведет себя по-разному.

    Flutter выбрал другой путь: он сам рисует каждый пиксель и контролирует анимацию. За это отвечают два набора виджетов: Material для Android и Cupertino для iOS. В итоге приложения на нём максимально схожи с нативным — и среди кроссплатформенных приложений Flutter уверенно идет к лидерству.

    На родном языке OC — Swift для iOS и Kotlin для Android — можно написать практически любое нативное приложение — серьёзных минусов или ограничений нет. Но придётся дважды создавать бизнес-логику, верстку и интерфейс. Причём развитием и поддержкой должны заниматься тоже два отдела. Это значительно растягивает бюджет.

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

    • Экономия. Большую часть кода можно использовать на обеих платформах без изменений — это экономит до 40% бюджета за счет скорости разработки.
    • Безопасность. В релизной сборке код компилируется в нативный, не читаемый человеком. Поэтому реверс-инжиниринг приложения на Flutter гораздо сложнее, чем аналогов на Java, Kotlin или React Native.
    • Меньше ошибок при тестировании: фактически вы тестируете одно приложение вместо двух.
    • Быстрый выход приложения на рынок. Высокая скорость разработки и тестирования позволяют запустить одно приложение на Flutter быстрее, чем два нативных.

    Возможности Flutter мы разбирали более подробно в другом посте — рекомендуем почитать.

    Flutter vs натив: сравнение стоимости

    Мы попросили Android-, iOS- и Flutter-разработчиков оценить типичные для e-commerce фичи в story points — относительных единицах, которые показывают сложность задачи.

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

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

    Конфигурация команд

    Native — 1 дизайнер, 3 Andriod-разработчика, 3 iOS-разработчика, 1–2 QA-инженера

    Flutter — 1 дизайнер, 4 разработчика, 1 QA-инженер с подключением второго на последний спринт MVP

    Трудоёмкость мы считали по часам и при условии, что день отработан идеально: сотрудник не отвлекался на переговоры и другие задачи. Разработка идёт в два этапа.

    Экономика проекта на Flutter. Ячейка — это неделя. Цифра в ячейке — ставка

    В данном примере Flutter экономит нам 45,6% на разработке, 70,5% на QA с учетом использования автотестов в обеих командах, а также 33,3% на дизайне приложения. Задачи бывают разными, поэтому кто-то сэкономит 20%, кто-то — 40%. Но суть одна: стоимость разработки на Flutter ниже за счёт высокой скорости разработки.

    3 причины, почему Flutter дешевле нативной разработки

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

    Бизнес-логика, вёрстка и интерфейс тоже остаются практически без изменений. Из-за этого сокращается время на тестирование — примерно в 1,3–1,5  раза.

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

    Hot-Reload. Фреймворк поддерживает Hot-reload: разработчики мгновенно видят изменения прямо в приложении. Это увеличивает производительность труда программистов.

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

    Примеры приложений на Flutter

    Мы в Surf собрали целый Flutter-отдел и уже реализовали крупные проекты на этой технологии.

    Приложение для Росбанка

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

    Как помог Flutter. Помогли построить команду продуктовой разработки инхаус и снизить издержки на поддержку и развитие приложения.

    Результат. Приложение успешно прошло пен-тесты — проверки службой информационной безопасности банка. Пользователям высоко оценивают новое приложение: ставят пятерки в сторах и пишут позитивные отзывы.

    Ссылка на кейс

    KFC DSR

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

    Как помог Flutter. Сильно снизил бюджет на разработку. Это внутренний продукт для сотрудников: сотрудники устанавливают приложение на личные устройства. Причём как линейные сотрудники в ресторанах, так и территориальный менеджеры. У территориальных менеджеров в основном айфоны. Получается, что 95% пользователей — Android, а 5% — iOS, но среди этих 5% — очень важные пользователи системы — управленцы. Если бы не Flutter, то пришлось бы разрабатывать и поддерживать отдельное iOS приложение ради этих 5%. А так кроссплатформенное приложение на Flutter идеально вписалось в этот кейс.

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

    Ссылка на кейс

    Приложение для аптечной сети Ригла

    Сеть объединяет три бренда, и каждому нужно приложение под iOS и Android — в сумме это шесть приложений. Разрабатывать каждое было бы слишком долго и дорого, поэтому мы предложили работать с Flutter.

    Как помог Flutter. Наединой кодовой базе созданы шесть приложений. Разработка заняла всего пять месяцев: от этапа проектирования до выхода в релиз.

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

    Ссылка на кейс

    Вывод

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

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