logo
Mobile app      29/04/2021

Разработчики Foodex24: Мы попробовали Flutter сразу после релиза и сэкономили несколько недель

Сергей Тоболкин BLOG

Team Lead в Powercode

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

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

Что такое Flutter, и почему мы начали с ним работать

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

Около года назад мы разрабатывали мобильные приложения для сервиса по доставке продуктов Foodex24, а у Flutter уже вышла первая стабильная версия.

Выбирая между основными конкурентами — React Native и Flutter, мы посмотрели тесты и сравнили функционал. Разработка кроссплатформенных приложений часто усложняется тем, что надо учитывать поведение каждой платформы (IOS и Android). Обычно это касается элементов управления или визуальных эффектов. Flutter использует собственный движок рендера — благодаря этому мы можем отобразить любой элемент, а о том, чтобы они везде выглядели одинаково, уже позаботится сама платформа. 

К тому же, Flutter позволяет быстро создавать сочный, насыщенный дизайн и содержит два набора виджетов: Material Design для Android и Cupertino для iOS, которые можно использовать одновременно, чтобы получить лучшее от обеих платформ. Оценив все это, мы и выбрали Flutter. 

Разработка Foodex24

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

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

Перейти на язык программирования Dart, на котором работает Flutter, для нас было несложно. Он чем-то схож с JavaScript. А если человек работал с React Native, переучиться на Flutter ему будет легко — у них схожие принципы работы. Так вышло, что в нашей команде почти все имеют опыт работы с React Native, поэтому мы быстро адаптировались.

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

Результат

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

Англійська для початківців від Englishdom.
Для тих, хто тільки починає вивчати англійську і хоче вміти використовувати базову лексику і граматику.
Реєстрація на курс

Приложение Foodex24

Мы выпустили уже несколько стабильных релизов Foodex24: для App Store и Play Market. Постоянно обновляем код под современные стандарты, устраняем мелкие баги и обновляем фреймворк.

Очень радует, что у нас не возникает каких-то ситуативных проблем, связанных с конкретной версией iPhone или Android. Любая возникающая ошибка касается всех девайсов, ее можно легко отследить и быстро исправить. А если мы внедряем новую функцию или добавляем анимацию, она будет корректно работать на всех платформах.

Где еще мы используем Flutter

Кроме Foodex24, мы применили Flutter еще на двух клиентских проектах:

1. Приложение для детского ивента

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

В этом случае Flutter нам помог создать очень красивый интерфейс буквально за два-три дня: мы взяли готовую библиотеку и лишь изменили цветовую тему со стандартной на наши корпоративные цвета. В итоге силами двух разработчиков (один бэкенд-разработчик занимался нейронной сетью, а фронтенд создавал интерфейс) мы уложились в пару недель. Если бы мы использовали React Native, думаю, потратили бы раза в два больше времени: пришлось бы тестировать интерфейс на разных устройствах.

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

2. Приложение для немецкой клининговой компании

Идея в том, что человек фотографирует фасад здания, которое нужно почистить, приложение определяет его размер и считает примерную цену работы с точностью в 5-10%. Клиент может сориентироваться, по карману ли ему такая услуга, а клининг — оценить объем работ.

Приложение клининговой компании

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

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

Курс Full-stack developer від Mate academy.
Ідеальний курс для новачків - після закінчення гарантоване працевлаштування. Ви навчитесь працювати як з фронтендом, так і з бекендом сайта. .
Отримати знижку на курс

Почему Flutter?

Резюмируя: мне, как для разработчику аутсорсинговой компании, нравится, что Flutter дает единый интерфейс. Я могу разрабатывать на macOS и быть уверенным, что приложение, с учетом минимальных правок, будет выглядеть одинаково на iOS и Android.

Я могу сконцентрироваться не на том, как каждая кнопка поведет себя на каком-нибудь iPhone 11, или Xiaomi Mi 9T, а на логике и поиске багов. В итоге я не трачу время на интерфейс, а фокусируюсь на более качественном и производительном приложении.

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

If you have found a spelling error, please, notify us by selecting that text and pressing Ctrl+Enter.

Онлайн-курс Бізнес-аналіз. Basic Level від Hillel IT School.
В ході курсу студенти навчаться техніці збору і аналізу вимог, документуванню та управлінню документацією, управлінню ризиками та змінами, а також навчаться моделювати процеси і прототипуванню.
Приєднатися

Этот материал – не редакционный, это – личное мнение его автора. Редакция может не разделять это мнение.

Ваша жалоба отправлена модератору

Сообщить об опечатке

Текст, который будет отправлен нашим редакторам: