Learn how to add a powerful AI assistant to your Bubble app

Hi everyone! :waving_hand:

I’ve been experimenting with ways to make AI assistants easier to add inside Bubble apps, especially for cases where you want the app user to simply open a chat and start asking questions without thinking about API keys, OpenAI accounts, or setup complexity.

So I put together a plugin called AI Assistant Pro - No Credit Card Required.

The idea is simple: give Bubble builders a clean way to add an AI assistant to Web and Mobile apps, while keeping the workflow flexible enough for real use cases like FAQs, support flows, internal tools, onboarding assistants, product guides, legal/finance assistants, education apps, and ticket-based conversations.

The plugin currently includes:

:white_check_mark: Works on Web
:white_check_mark: Works on Bubble Mobile
:white_check_mark: Custom initial prompt for assistant behavior
:white_check_mark: Conversation ID support for separating chats
:white_check_mark: States for messages, roles, errors, loading, last response, and message count
:white_check_mark:Events for message sent, message received, errors, conversation loaded, and conversation cleared
:white_check_mark: Clear conversation action
:white_check_mark: Load conversation action for restoring saved mobile conversations
:white_check_mark: Mobile chatbot UI included directly in the element
:white_check_mark: Mobile input, send button, loading state, message bubbles, and keyboard-aware behavior

I have an app myself where I used to receive countless repetitive messages. So, I created an FAQ and included it in the plugin’s initial prompt. Now, the AI ​​reads my FAQ and responds to users in a human-like way, reducing the number of support tickets opened.

For Web, the model is more workflow/state based: send a message, receive the assistant response, and then decide what to do with the data. You can display the messages in a Repeating Group, save them into your Bubble database, attach them to a support ticket, or use the responses in any custom UI you’re building.

web

Notice that the AI ​​assistant responds extremely quickly—in a matter of milliseconds.

For Mobile, the experience is more visual out of the box. When you place the element in the editor, it creates an interactive chatbot with a floating button, a customizable chat panel, assistant/user bubbles, placeholders, loading text, and states you can still capture if you want to save the conversation.

mobile

Some possible use cases:

:speech_balloon: FAQ assistant for your app or marketplace
:headphone: Customer support chat connected to saved tickets
:books: Tutor or learning assistant for education apps
:clipboard: Onboarding assistant for SaaS dashboards
:briefcase: Internal assistant for teams and operations
:shopping_cart: Product guide for ecommerce or service apps
:page_facing_up: Document or policy explainer using your own prompt context

I also added support for conversation loading, so you can save Content responses and Content roles in your Bubble database and reload the chat later with the same conversation ID.

Good news: You don’t need to use any external API key to use this service.

:globe_with_meridians: Web Demo
Try it → Web demo page

:globe_with_meridians: Web Editor
See how the Web version is wired → Web editor

:mobile_phone: Mobile Demo
Try the mobile chatbot → Mobile demo page

:mobile_phone: Mobile Editor
See the mobile setup → Mobile editor

:shopping_cart: Marketplace
Plugin page → AI Assistant Pro - No Credit Card Required

I’ll keep improving it based on real Bubble use cases. Curious to see what people build with it.

1 Like