Prototyper facilement avec l'IA grace a Firebase Studio

Toni Dos Santos
Toni Dos Santos
07 Avril 2025 · 9 min read

Le “vibe coding” est en plein essor avec des solutions comme Bolt, Lovable, Replit et Cursor. Ces outils IA permettent de construire un prototype ou un MVP fonctionnel en quelques heures a partir de simples prompts textuels. Mais ils necessitent souvent une configuration technique qui peut decourager les non-developpeurs. Google propose desormais Firebase Studio, un outil gratuit de creation d’applications avec IA integree, accessible a tous.

Firebase Studio : le prototypage IA simplifie

Firebase Studio est le nouveau terrain de jeu de Google pour construire des applications avec l’IA, rapidement. Actuellement en phase de test, il est accessible a tous et offre plusieurs avantages :

  • Tout est integre : pas besoin d’installer quoi que ce soit
  • C’est gratuit
  • Vous pouvez editer avec une interface de glisser-deposer
  • Vous pouvez dessiner les modifications souhaitees directement dans l’application

Voyons ce que vous pouvez faire avec Firebase Studio a travers deux exemples concrets : un generateur de transcription video IA et un calculateur de cout de tokens.

Exemple 1 : Generateur de transcription video IA

S’inscrire sur Firebase Studio

Rendez-vous sur firebase.studio et connectez-vous avec votre compte Google. C’est gratuit.

Rediger votre prompt

Vous pouvez creer 3 projets d’application gratuitement dans Firebase Studio. Decrivez votre application directement dans la fenetre de prompt :

Cree une application qui prend en entree l'URL d'une video YouTube et genere une transcription en fichier txt ainsi qu'un court resume.

Valider le blueprint

Firebase cree un plan pour l’application. Revoyez-le et modifiez-le avant le prototypage : demandez a changer les couleurs, la disposition, ou tout autre element.

Regarder Firebase Studio construire l’application

L’outil genere l’integralite du code de maniere autonome, corrige les problemes et les bugs tout seul. Si l’application necessite des fonctionnalites IA (comme notre generateur de transcriptions), vous pouvez generer automatiquement une cle API Gemini sans avoir besoin de credentials.

Tester et iterer

Une fois l’application prete :

  • Ouvrez-la dans une fenetre navigateur complete
  • Previsualisez-la sur smartphone via QR Code
  • Si vous rencontrez des erreurs, demandez a l’IA de les corriger
  • Ou editez le code directement
auto_awesome Exemple concret

En seulement 5 minutes, j’ai cree un outil fonctionnel de transcription video que je peux utiliser pour n’importe quelle video. Gratuitement. J’ai teste avec une video recente du podcast de Lenny : il a extrait la transcription complete, que j’ai pu telecharger en .txt, et a genere un resume pertinent.

Exemple 2 : Calculateur de cout de tokens

Construisons maintenant un calculateur de cout de tokens pour une plateforme d’enrichissement de donnees.

Cree une application de calcul de cout de tokens pour un outil d'enrichissement de donnees. L'utilisateur selectionne le nombre de tokens souhaite, et l'application affiche le nombre de leads enrichis pour les differents types d'enrichissement et le cout total. 1 token = 0,10 EUR 1 email = 1 token 1 enrichissement complet = 5 tokens 1 numero de telephone = 10 tokens

Editer l’application visuellement

Si le resultat initial n’est pas parfait, utilisez l’editeur visuel de Firebase Studio :

  1. Cliquez sur le bouton “EDIT” en haut a droite
  2. Selectionnez le bloc que vous voulez modifier
  3. Tapez les changements souhaites dans la fenetre pop-up
  4. Firebase Studio met a jour le code avec les modifications

Dessiner pour editer

Vous pouvez egalement montrer visuellement les changements souhaites :

  1. Cliquez sur le bouton “ANNOTATE”
  2. Firebase prend une capture d’ecran de l’application et ouvre un editeur
  3. Dessinez les modifications avec des formes, du texte, des images
  4. Ajoutez des instructions textuelles avec votre dessin
auto_awesome Exemple concret

J’ai dessine un curseur coulissant avec des jalons pour remplacer le selecteur de tokens, et j’ai decrit simplement le changement. Firebase Studio a mis a jour l’application instantanement. Aucune ligne de code ecrite manuellement.

Les limites a connaitre

Cet outil n’est pas fait pour un MVP abouti. Voici pourquoi :

  • L’interface utilisateur est limitee et tres basique. N’attendez pas de beaux designs comme Lovable
  • C’est encore assez instable : attendez-vous a des plantages occasionnels
  • Ce n’est pas adapte aux applications complexes

Mais si vous etes en phase de validation d’idee ou de test interne, c’est largement suffisant. C’est l’introduction parfaite au vibe coding quand on n’est pas technique et qu’on veut simplement tester des idees.

Conclusion

Prototyper avec l’IA n’a jamais ete aussi simple, ni aussi gratuit. Voici le processus en resume : redigez votre prompt en etant specifique, regardez l’IA construire l’application, editez les blocs en cliquant dessus, utilisez le mode dessin pour affiner l’interface, et testez le tout dans la meme fenetre navigateur. Aucune configuration, aucune integration, aucun onglet a changer. Firebase Studio est l’outil ideal pour valider rapidement une idee ou creer un outil interne simple. Essayez-le des aujourd’hui et transformez vos idees en prototypes fonctionnels en quelques minutes.

Toni Dos Santos

Toni Dos Santos

Expert en Adoption IA & Stratégie Digitale. J'accompagne les entreprises dans leur transition vers l'intelligence artificielle générative avec une approche centrée sur l'humain et les résultats business concrets.

Rejoignez la communauté

Un tips actionnable chaque mardi. Déjà 1 245+ professionnels inscrits.

Pas de spam. Désinscription en un clic.