Application Bubble : créer une application avec Bubble.io

Si vous vous intéressez au monde des builders d’app no-code, vous avez certainement entendu parler de Bubble. Depuis 2012, l’outil vous permet de créer des applications web sans avoir à coder une seule ligne. Une petite révolution dans le monde de la tech ! Mais comment faire pour créer une application Bubble ? Scroll, agence spécialisée en no-code, vous dit tout. 

Qu’est-ce que Bubble.io ? 

Bubble.io est, selon leurs propres termes, « le meilleur moyen de créer une application sans coder ». Dans les faits, il s’agit d’un outil SaaS (Software As A Service, un outil donc accessible en ligne grâce à un système d’abonnement) qui repose sur la technologie no-code. 

L’outil repose sur les concepts de Drag And Drop et de WYSIWYG (What You See Is What You Get). Concrètement, sous ces acronymes et ces anglicismes se cache une idée simple : Bubble vous propose nativement un certain nombre d’actions que vous pouvez réaliser. En les sélectionnant et en les ajoutant à votre workflow, vous pouvez créer des enchaînements logiques pour donner naissance à une application. Et tout cela, sans avoir à coder une seule ligne. Bubble vous permet d’assembler visuellement les actions, et se charge de traduire tout cela en code pour vous. 

Bubble est donc une petite révolution à plusieurs niveaux. D’abord, l’outil a permis à plus de monde de créer des applications : ce monde n’est plus réservé qu’aux développeurs seuls. Ensuite, il permet de créer, plus rapidement, et plus facilement, des applications web ou mobiles. 

On pourrait penser que cela a un coût technique : en utilisant Bubble, on se retrouve limité par les actions que propose Bubble justement. Il existe donc un nombre limité d’applications qu’on peut créer. Dans les faits pourtant, Bubble propose un choix immense d’actions possibles et de connecteurs à d’autres apps. Vous n’êtes donc pas limité lorsque vous créez des apps sur Bubble. 

Exemples d’applications créées avec Bubble 

Preuve en est : de nombreuses start-ups (et même des business bien installés) utilisent la solution. Avec Bubble, vous pouvez créer de nombreuses applications, comme des marketplaces, des Saas, des réseaux sociaux ou même des outils internes à votre entreprise comme des CMS ou des logiciels de comptabilité. 

Un exemple concret d’application créée avec Bubble ? Comet.co, une plateforme de recrutement de freelances qui a levé, en 2018, 11 millions d’euros, a créé son application grâce à Bubble. La technologie a depuis été changée, mais cela prouve le sérieux et la robustesse de la solution. 

Bubble.io est aussi souvent utilisé pour concevoir des MVP (Minimum Viable Product, soit la version minimale d’un produit, qui vous permettra d’obtenir des retours clients pour le faire évoluer dans le bon sens). De quoi lancer sa start-up rapidement grâce au no-code. En effet, grâce à ses nombreuses fonctionnalités et la facilité avec laquelle on peut ajouter des features à une application, Bubble est un excellent choix pour ce genre d’opérations. 

Comment créer une application avec Bubble

Nous en arrivons à la question cruciale : comment créer une application sur Bubble ? 

Si le no-code a la réputation d’être plus accessible et plus facile que le code, sachez tout de même que construire son application sur Bubble demande de connaître l’outil et son écosystème. La courbe d’apprentissage peut être ardue, mais une fois que vous maîtrisez la solution, vous arriverez à concevoir des applications plus rapidement. 

La première étape sera de trouver une idée d’apps. Ce n’est pas forcément la plus simple, mais même là vous serez accompagné par les ressources de Bubble. L’outil propose en effet de nombreux exemples d’utilisations, des templates et des plugins que vous pouvez parcourir et utiliser librement. Vous y trouverez de nombreuses idées pour votre application et vous gagnerez un temps fou en les utilisant. 

Il vous faudra ensuite vous créer un compte sur Bubble pour accéder à l’environnement de production. C’est ici que le gros du travail s’accomplira. 

L’interface Bubble est composée de plusieurs onglets. 

Design : l’onglet pour donner forme à votre application Bubble

C’est dans cet onglet que vous éditerez la partie visuelle, l’UX, l’interface de votre app. Bubble vous permet de créer des boutons, d’ajouter des images, des champs à remplir, bref, de créer une page web comme le ferait n’importe quel autre CMS no-code comme Webflow. Vous pouvez soit créer votre modèle from scratch ou en utilisant l’un des templates disponibles. 

A noter : les designs créés avec Bubble peuvent être entièrement responsive. 

Workflow : le cœur de votre application Bubble.io

C’est sans doute le cœur de l’outil, là où vous allez créer vos applications Bubble. L’espace Workflow vous permet de créer des scénarios automatisés grâce à une suite logique de couples événements/actions. Chaque « étape » de votre workflow est en effet constitué de deux facettes : un événement, qui est un trigger qui déclenche l’étape, et une ou plusieurs actions qui s’effectuent lorsque l’événement se produit. 

Il existe, dans cet espace, de nombreux événements paramétrés de base. Vous pourrez alors choisir l’un d’eux et lui donner une action conséquentielle. Vous avez aussi la possibilité de paramétrer vos propres événements custom, pour personnaliser votre application au maximum. 

Une fois l’événement paramétré, se déclenchent les actions logiques liées à cet event. Là encore, vous pouvez choisir entre des actions déjà prédéfinies par Bubble ou des actions personnalisées, à paramétrer vous-mêmes. 

Le fonctionnement est donc très simple : pour une étape, vous choisissez un événement déclencheur et les actions qui en résultent. Un exemple concret ? Vous pouvez prendre, dans votre application Bubble, l’événement « Quand un utilisateur s’inscrit » et lui associer l’action « Envoyer un email de confirmation ». Ainsi, à chaque fois qu’une nouvelle personne créera un compte sur votre web app, elle recevra un email de confirmation de création de compte. 

Data : enrichir et personnaliser votre application

Troisième onglet de l’interface de création d’applications sur Bubble.io, l’onglet Data. Il est, là encore, extrêmement important : c’est sur lui que vous enregistrerez vos données et vos tables que vous pourrez réutiliser dans votre application. 

Cet onglet vous permettra plusieurs actions. 

Data types. De base, Bubble en propose déjà certaines, comme des utilisateurs avec leur login, leur ID etc. Mais vous pouvez créer les vôtres et y associer les données que vous souhaitez. 

Custom Fields, ou champ personnalisé : en remplissant des champs personnalisés, vous pouvez ajouter des variables à vos types de data. Prenons encore une fois l’exemple des Utilisateurs : vous pouvez, en plus de leur nom, prénom, login, mot de passe, ajouter d’autres informations que vous aurez pu récolter : âge, adresse, nombre de commandes effectuées…

Ces Tables de Data que vous créez, vous pouvez, par la suite, les réutiliser dans votre application au niveau des Workflows. Bubble vous propose de récupérer des données issues de vos data pour les utiliser dans le schéma logique de votre application. Les interactions avec l’app peuvent donc devenir véritablement personnalisée, en fonction des informations données par l’utilisateur. 

Styles : unifier l’aspect de votre application Bubble

L’onglet Styles de Bubble vous permet de créer des règles de style pour votre application. Vous pouvez donc choisir les polices, les thèmes, les couleurs de votre application. Effectuer un changement au niveau des styles entraînera un changement sur l’ensemble de votre app. Cet onglet vous permet donc d’unifier l’aspect de votre application. 

Plugins : ajouter de nouveaux éléments à votre application Bubble

L’onglet Plugins vous permet de connecter via API d’autres outils compatibles avec Bubble, pour vous permettre de personnaliser encore plus votre application. La plupart des outils digitaux répandus sont disponibles : au total, Bubble propose des centaines d’intégrations et vous permet de connecter vous-mêmes celles que vous désirez. Théoriquement, les possibilités sont donc illimitées. 

Vous pouvez par exemple connecter Airtable, Slack, Gmail, Instagram, Google Analytics et bien plus encore, en fonction de ce que vous souhaitez que votre application Bubble accomplisse. 

Les autres onglets Bubble

Bubble.io propose deux autres onglets : Paramètres, pour gérer les différents paramètres de votre compte, et Logs, pour retrouver toutes les entrées, les changements et les modifications apportées à votre application Bubble. 

Scroll, votre agence de création d’applications Bubble

Chez Scroll, nous sommes spécialistes des outils no-code. En particulier, notre agence Bubble vous aidera à comprendre les possibilités de cet outil, pour créer des applications no-code avec Bubble capables de répondre à vos problématiques. 

Vous souhaitez en savoir plus ? Vous avez une idée de projet et cherchez comment la concrétiser ? N’hésitez pas à nous envoyer un message via le formulaire ci-dessous ! Un spécialiste de la création d’apps sur Bubble vous répondra pour en discuter avec vous. 

‍

‍

‍