Design
Unlock the power of visual creation with Bubble.io's Design features, empowering solopreneurs to craft stunning no code SaaS applications without coding skills and bring their entrepreneurial visions to life.

OpenAI GPT-4o Beginners Guide for No Coders
Learn how to add OpenAI GPT-4o to your Bubble.io app with this beginner's guide to integrating AI using no-code development.

OpenAI Loading Animation - Using Lottiefiles
In this Bubble tutorial we demonstrate how to improve your Bubble app's UX (user experience) by showing a loading animation while you wait for a response from the OpenAI API (ChatGPT). This tutorial uses a Lottie animation from Lottiefiles.

OpenAI, Markdown & Bubble.io
Learn how to integrate OpenAI with your Bubble.io app to create a more visually appealing presentation of your data using Markdown.

Pagination with the Bubble Table Element
In this Bubble tutorial we demonstrate how you can add pagination to the Bubble table element. The Bubble.io table element doesn't include the same set of expanded features as repeating groups. So here is our workaround.

Password reset: login page workflow with custom states
In this Bubble.io tutorial video we show how to use custom states to create a password reset form which optimises user experience and won't frustrate your users.

Popup search box (command bar) triggered by a keyboard shortcut
In this Bubble.io tutorial video we demonstrate how to create a popup command bar or search box that is triggered by a keyboard shortcut - sometimes known as a omnibox or omnisearch. This tutorial shows how to use a Popup visual element, the Search Box input element and the Air Keyboard Shortcut plugin.
Explore more of our no code tutorials
Discover more Bubble tutorials
Start building your No Code SaaS with Bubble.io & Planet No Code

How to add live web search data to the OpenAI API
Learn how to harness the power of Bubble.io and the no-code movement to combine multiple APIs, including OpenAI, web scraping, and web search, to create a Chat GPT clone that can fetch live data from the web and provide accurate and up-to-date information on things to do in Paris in February 2024.

Creating a Chatbot experience using Bubble & ChatGPT API
In this Bubble tutorial we demonstrate how to use the ChatGPT API to create an AI chatbot like experience in your Bubble app. We dive right the deep end of the Bubble API Connector, we have getting started videos for the OpenAI API on our channel already. This video shows one way to approach the challenge of formating the message history correctly in JSON so that your chatbot is aware of the message history and respond accordingly.

How to add OpenAI Text to Speech to your Bubble app
In this Bubble.io tutorial we demonstrate how to convert text to speech in your Bubble app using the OpenAI Text-to-Speech API including how to autoplay the speech as soon as OpenAI returns the MP3 file.

How to import a Figma design into Bubble step by step guide
In this Bubble.io tutorial video we demonstrate how to work with Figma and Bubble.io and the new responsive engine.

Tips for Using Conditional Statements in Bubble.io
In this Bubble tutorial we demonstrate how you can use conditional statements to change the background color of content based on a numerical value. We create a series of traffic light color changes (red, green, yellow) to show low, medium and high values in our data.