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

Кроссплатформенная разработка конкурирует с нативными решениями по популярности и в некоторых аспектах превосходит их. Этот подход обеспечивает высокую производительность без ущерба для гибкости и кастомизации проекта. Исследование JetBrains показывает, что к кроссплатформенной мобильной разработке прибегает половина разработчиков в своих проектах. В статье разберём подробно, на каких проектах подойдёт разработка кроссплатформенных приложений, а на каких лучше создавать нативный продукт.

Три способа создать мобильное приложение

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

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

№2. Нативная разработка для Android и iOS. В этом случае нужно писать две кодовые базы для двух операционных систем. Для Android — на языке программирования Kotlin, для iOS — на Swift.

№3. Кроссплатформенная мобильная разработка — это создание приложения на единой кодовой базе сразу для двух операционных систем с помощью готовых библиотек и компонентов. Кроссплатформенная мобильная разработка основана на универсальных фреймворках: Flutter, React Native, Apache Cordova, Ionic.

Кроссплатформенные приложения

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

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

Когда нужен кроссплатформенный подход

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

Высокое качество по приемлемой цене. В среднем, для создания нативного приложения требуется 8–9 специалистов. Кросс платформенная разработка на Flutter позволяет реализовать аналогичный проект силами 5–6 человек. Так команда проекта сэкономит около 40% бюджета в сравнении с нативной разработкой.

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

Высокая производительность и продуманный UI. Кроссплатформенные приложения меньше нагружают систему, в отличие от нативных. Так, кроссплатформенная технология Flutter поддерживает частотность воспроизведения видео до 120 кадров в секунду, что устраняет торможение.

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

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

За 9 месяцев мы разработали новое кроссплатформенное банковское приложение. Уложиться в сжатые сроки помогли автотесты Flutter, которые покрыли 65% кода. Пользователи оценили приложение за современный дизайн и удобную навигацию. Сейчас развитие проекта продолжается: в период санкций мы предложили быстрое решение, чтобы вернуть приложение в сторы: перевели проект в формат PWA — и тоже с помощью Flutter. На базе исходного кода приложения мы также реализовали приложение для Мособлбанка, входящего в группу компаний СМП Банка.

Разработка кроссплатформенного приложения для стриминговой платформы

В приложении для The Hole, видеостриминговой платформы Medium Quality, было важно добиться плавной анимации перехода между экранами и создать отзывчивый пользовательский интерфейс. Для фронтенда использовали Flutter, а для бэкенда: Kotlin, Spring Boot и Kubernetes. 

Работа над первой версией приложения заняла 4 месяца, а результат оправдал выбор кроссплатформы. Flutter отлично справился с задачей создания видеоплеера — российского аналога YouTube. Кроссплатформенное приложение The Hole заняло первую строчку в категории «Развлечения» в App Store.

Разработка кроссплатформенных приложений для аптечной сети

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

Наши приложения позволили компании успешно выйти в онлайн, наладить прямую коммуникацию с пользователями и обеспечить рост конверсии в покупку. Сегодня 70% всех онлайн-клиентов совершают покупки через мобильный интерфейс. База пользователей увеличилась на 500 тысяч человек, количество регистраций — на 25%, а средний чек — в 3,5 раза.

Инструменты для кроссплатформенной разработки

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

Какую кроссплатформу выбрать

Чтобы определиться с кроссплатформенным фреймворком, ответьте на следующие вопросы:

• Какими функциями и возможностями должно обладать будущее приложение.
• Для каких устройств оно будет доступно — десктоп, смартфоны на iOS и Android.
• Какое приложение должно быть по объёму занимаемой памяти.

Flutter, чтобы уложиться в ограниченный бюджет без потери качества

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

Разработка на Flutter позволяет:

• Запустить сразу три канала продаж: десктоп, мобильную и веб-версию продукта на единой кодовой базе.
• Создать любой дизайн в сжатые сроки с помощью набора кастомизируемых виджетов.
• Сделать плавные анимации и переходы между экранами за счёт мощного графического движка.
• Ускорить процесс кроссплатформенной разработки, благодаря Hot Reload — функции обновления приложения после внесения правок в код без его полной перезагрузки.

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

React Native, чтобы получить нативную производительность

Один из самых популярных фреймворков для разработки кроссплатформенных приложений. React Native способен обеспечить высокую производительность, но с одной оговоркой: ни одна кроссплатформа не сравнится в этом параметре с нативными технологиями. Однако с точки зрения пользователей существенных различий с нативными приложениями не будет, так как React Native, как и Flutter, обеспечивает плавную прокрутку экранов, анимацию и переходы. Читайте подробнее о различиях между Flutter и React Native, чтобы выбрать подходящую технологию для мобильного приложения.

Apache Cordova, чтобы сделать веб-приложение с гибкой настройкой визуального стиля

Один из старейших кроссплатформенных фреймворков, созданный в 2009 году. По сути, это среда разработки с открытым исходным кодом, работающая на стандартных веб-технологиях. Мобильное приложение, созданное на Cordova, представляет собой несколько HTML-страниц в «оболочке» платформы и использует специальный виджет, который выполняет все действия. Так, приложение становится максимально похожим на нативное. Эта технология подойдёт, если вам в короткие сроки нужно создать прототип. Однако, если вашему приложению важна требуется хорошая производительность из-за обилия графики и анимаций, лучше присмотреться к более современной кроссплатформе, например, Flutter. Читайтесь больше о различиях Flutter и Apache Cordova для разработки мобильного приложения.

Xamarin для отличной интеграции в .NET экосистему

Кроссплатформенный фреймворк Xamarin разработан в 2011 году. Xamarin позволяет разрабатывать приложения для iOS, Android и Windows, используя C# и .NET Framework. Он предоставляет доступ к нативным API платформ, что позволяет создавать приложения с высокой производительностью. Xamarin.Forms, часть экосистемы Xamarin, позволяет разрабатывать пользовательский интерфейс, который может быть общим для всех платформ, что значительно ускоряет процесс разработки.

При этом, в отличие от Flutter, Xamarin не является бесплатным для коммерческого использования. Учитывая проработанную интеграцию с Visual Studio, активное сообщество и богатую библиотеку плагинов, Xamarin может быть оптимальной технологией для кроссплатформенной разработки для тех, кто уже работает в экосистеме Microsoft, или когда большая часть технологического стека написана на языках семейства .NET. Читайте подробнее о том, как выбрать Flutter или Xamarin для кроссплатформенной разработки.

Где узнать больше о кроссплатформенной разработке

Наши разработчики развивают кроссплатформенные технологии. В открытом репозитории на GitHub мы регулярно обновляем базы готовых решений для Flutter. Кроме того, мы публикуем технические кейсы и статьи на Хабре, записываем подкасты и ведём собственное YouTube-шоу. Мы создали первый банк в Европе на кроссплатформенном фреймворке и являемся сооснователями первого в России официального сообщества экспертов по разработке на Flutter.