FlutterFlow : la tentative de réconcilier le no-code et le vrai code
L’idée « créer une app à la souris » est presque aussi ancienne que les smartphones eux-mêmes. Mais jusqu’à récemment, le résultat de ces constructeurs butait toujours sur le même plafond : un joli prototype incapable de devenir un produit sérieux. Dès que la logique métier se compliquait, l’équipe découvrait que la plateforme ne faisait que ce que ses créateurs avaient prévu — et au-delà, c’était le mur.
FlutterFlow est lancé en 2020 comme réponse directe à ce problème. Une équipe Y Combinator (les fondateurs Abel Mengistu et Alex Greaves) a choisi de ne pas inventer un énième runtime, mais de poser un éditeur visuel au-dessus de Flutter — le framework open source de Google derrière de vraies applications en production comme Alibaba, BMW et Google Pay. Les apps ne sont pas « rendues dans le cloud de FlutterFlow » : en dessous, il y a toujours un projet Flutter classique, et l’éditeur visuel n’est qu’une couche pratique par-dessus.
C’est précisément cette décision d’architecture qui rend FlutterFlow intéressant. Il ne vous enferme pas dans son propre écosystème comme le font les constructeurs no-code classiques. Voyons ce que cela donne en pratique, combien cela coûte et où la plateforme trébuche encore.
Site officiel : flutterflow.io
Ce qu’est réellement FlutterFlow
FlutterFlow est un environnement low-code dans le cloud pour créer des applications mobiles iOS et Android, ainsi que des applications web. Tout se passe dans le navigateur : vous glissez des widgets sur un écran, configurez leurs propriétés dans le panneau de droite et voyez aussitôt le résultat dans un cadre de téléphone. Aucun environnement local, aucun compilateur, aucune IDE à installer.
Éléments clés de la plateforme :
- Éditeur visuel d’UI — plus de 200 widgets prêts à l’emploi, grilles, listes, formulaires, navigation, animations de transition.
- Intégration Firebase et Supabase — base de données, authentification, stockage de fichiers et fonctions cloud se connectent en quelques clics.
- API Calls — connectez n’importe quel endpoint REST ou GraphQL sans écrire de code.
- Custom Code — insérez votre propre code Dart et utilisez n’importe quel paquet de l’écosystème Flutter.
- State Management — gestion de l’état de l’application (App State, Page State et scénarios plus complexes).
- Intégration GitHub — synchronisez le code vers votre propre dépôt.
- Export du code — téléchargez un projet Flutter complet sur le disque.
Les deux derniers points — export du code et GitHub — distinguent radicalement FlutterFlow des constructeurs classiques « bulle », dont on ne peut jamais extraire le code.
Avantages et inconvénients
Avantages :
- Du vrai code Flutter en sortie — pas d’enfermement propriétaire.
- Bonne vitesse de développement pour les apps simples et moyennes : un MVP se monte en jours, pas en mois.
- Intégration puissante avec Firebase et Supabase — « backend prêt à l’emploi ».
- Possibilité d’écrire en Dart quand les blocs visuels ne suffisent plus.
- Communauté vivante, marketplace de modèles, documentation fournie et tutoriels vidéo.
- Export du projet et synchronisation avec GitHub.
- Multiplateforme : une seule base de code pour iOS, Android et Web.
Inconvénients :
- La plateforme est payante et, en pratique, il n’existe pas d’offre gratuite pour un vrai travail.
- Les interfaces complexes et très personnalisées se construisent lentement, de façon « pâteuse » — l’éditeur visuel gêne plus qu’il n’aide.
- Le code généré est souvent « bruité » : maintenir une architecture propre dans le projet exporté est difficile.
- L’attachement à Firebase est pratique pour démarrer, mais migrer vers un autre backend demande du travail.
- Le travail en équipe exige une offre coûteuse.
- Les écrans lourds commencent à ramer dans l’éditeur.
Fonctionnalités : couche par couche
Interface et construction d’écrans
L’éditeur suit la logique familière « canvas + inspecteur ». À gauche, l’arbre des widgets ; au centre, la maquette ; à droite, les propriétés de l’élément sélectionné. Les widgets Flutter sont renommés en entités compréhensibles : conteneurs, colonnes, lignes, textes, boutons, images. Pour les tâches typiques (fil, fiche produit, formulaire d’inscription, page de compte), il existe des modèles.
Le point fort, ce sont les composants. Si vous construisez une fois une fiche produit, vous pouvez la transformer en composant réutilisable avec paramètres et le placer n’importe où. Ce n’est plus un « outil de dessin », mais un vrai système de construction d’interfaces.
À noter, l’import depuis Figma : une maquette peut être partiellement transférée dans FlutterFlow, ce qui économise du travail de mise en page pour les équipes orientées design. Cela ne fonctionne pas parfaitement, mais pour des maquettes typiques, le démarrage est nettement accéléré.
Logique, données, intégrations
La logique s’assemble à partir d’actions prêtes : « naviguer vers un écran », « appeler une API », « mettre à jour un document dans la base », « afficher un message », « écrire une valeur dans l’App State ». Pour les conditions complexes, il y a un éditeur visuel d’expressions et de logique conditionnelle. Quand cela ne suffit pas, Custom Code prend le relais : vous écrivez une fonction Dart et elle devient disponible comme un bloc normal.
L’intégration Firebase est ce que l’on aime le plus dans FlutterFlow. Authentification (e-mail, Google, Apple, anonyme), Cloud Firestore, Realtime Database, Storage, Remote Config — pour la plupart des MVP, tout se connecte en une soirée. Supabase fonctionne de la même manière si vous préférez une stack ouverte sur PostgreSQL.
Export, GitHub et propriété du code
La possibilité de télécharger le projet et de le synchroniser avec GitHub est l’argument principal pour ceux qui craignent l’enfermement. Vous obtenez un projet Flutter classique qui se compile avec flutter build et que vous pouvez continuer à éditer dans n’importe quelle IDE. Ce n’est toutefois pas du Flutter « propre » : le code est généré automatiquement, avec de nombreuses abstractions de service, et le maintenir à la main sous forme exportée est nettement plus difficile que de l’écrire de zéro. L’export est une assurance et un point d’entrée, pas la transformation gratuite en une base de code soignée.
Publier les applications
FlutterFlow permet de compiler pour l’App Store et Google Play directement depuis l’interface, mais une vraie sortie exige en général une offre adaptée, plus les comptes développeur Apple (99 $/an) et Google (25 $ unique). Ce sont des coûts à part que les débutants oublient souvent.
Tarifs : ce que coûte le travail
FlutterFlow fonctionne par abonnement. À la date de publication, les offres principales sont les suivantes (tarifs approximatifs ; les exacts sur le site) :
- Free — offre gratuite pour tester, mais avec des limites de compilation importantes et sans publication. Pour un vrai projet, elle ne suffit pas.
- Standard — environ à partir de ~30 $ par mois (en paiement annuel). Pour un développeur, projets personnels et petits.
- Pro — environ à partir de ~70 $ par mois. Lève la plupart des limites, ouvre les intégrations API, l’export du code, davantage de compilations.
- Team / Enterprise — offres équipe et entreprise, facturées par utilisateur, avec droits étendus, SSO et support.
Nuance importante : en plus de l’abonnement, il y a presque toujours des coûts de backend. Firebase a son propre niveau gratuit, mais la facture grimpe avec les utilisateurs. Le coût réel de possession, c’est FlutterFlow + Firebase + comptes développeur + éventuels paquets payants.
Pour comparaison : louer un VPS pour son propre backend revient moins cher et est plus prévisible, mais exige quelqu’un qui sait le gérer. Si le budget compte, faites le calcul à l’avance.
En pratique : à qui ça convient
Scénario 1. Un fondateur sans équipe technique. FlutterFlow est l’un des rares moyens de construire un vrai MVP mobile sans embaucher de développeurs. En un mois, vous atteignez de façon réaliste une version présentable aux investisseurs et aux premiers utilisateurs. La limite, c’est le plafond de complexité : plus la logique est inhabituelle, plus souvent vous plongez dans Dart.
Scénario 2. Une petite équipe avec un développeur en interne. Ici, le gain est la vitesse. Le designer livre la maquette, le développeur assemble les écrans et connecte Firebase, et écrit la logique complexe en Dart. FlutterFlow couvre la partie « ennuyeuse » : la mise en page et les intégrations typiques.
Scénario 3. Outils internes et back-offices. Pour les applications de service (préparation de commandes, entrepôt, checklists, reporting), la plateforme convient presque mieux que tout le reste : la vitesse compte plus que l’architecture idéale.
Scénario 4. Un produit complexe aux exigences de performance élevées. Par exemple, des apps à animation lourde, traitement vidéo, gestes non standards ou contrôle très précis du rendu. Ici, l’éditeur visuel gêne : vous vous battrez contre lui et finirez quand même par du Dart manuel.
Gardez aussi à l’esprit l’illusion du « nous ne dépendons plus des développeurs ». La plateforme abaisse la barrière d’entrée, mais n’élimine pas les tâches d’ingénierie : architecture, sécurité, optimisation du backend, monétisation, analytics. Le low-code change la question « qui va écrire ça » en « qui va le maintenir ».
Verdict
FlutterFlow est l’un des outils les plus réussis de la catégorie low-code pour le développement mobile. Sa différence clé est du vrai Flutter en sortie, et non un bac à sable fermé. Cela en fait un accord acceptable pour ceux qui craignent l’enfermement : au pire, il vous reste un code que vous pouvez développer vous-même.
Quand l’utiliser : MVP et prototypes ; applications internes ; produits simples et de complexité moyenne avec un ensemble de fonctions typique (auth, fils, formulaires, catalogues, commandes) ; équipes qui doivent valider une hypothèse vite.
Quand ne pas l’utiliser : si le projet exige d’emblée une interface non standard et une logique complexe ; si une architecture de code parfaitement propre est critique ; s’il n’y a pas de budget pour l’abonnement et le backend et que l’offre gratuite ne suffit pas.
Un critère simple : prenez la tâche que vous voulez réaliser. Si elle peut se décrire comme « écran → données → action → écran », FlutterFlow vous fera presque sûrement gagner du temps. Si la tâche ressemble à « il nous faut notre propre moteur », prenez du Flutter pur et épargnez le combat à vous-même comme à l’éditeur.