New: Buzzy AI (v3)
Buzzy AI v3 enables you to generate and edit full-stack applications directly from prompts, all within the Buzzy workspace. This guide outlines the core steps to get started, including how to write effective prompts, preview your app, understand the workspace structure, and use AI to iterate on your design.
💡 Tip: You can navigate back to the v2 Workspace from v3, for instance if you're working with v2 apps
1. Writing a Prompt
Start by describing what you want to build in plain language. Prompts can range from a short description to a detailed breakdown of features or screens.
Example prompts:
“A to-do list app with projects and due dates.”
“A mobile-first CRM dashboard for tracking customer interactions and sales pipelines.”
Prompts can be entered:
From the Workspace home screen (to start a new app)
From the Design > AI section (to update an existing screen or app)
💡 Tip: Be specific about what the app should do, what kind of data it uses, and any particular screens or interactions you want.
2. Previewing Your App
After submitting a prompt, Buzzy generates an app structure, including screens, data, and UI components.
The Buzzy Workspace will switch to the Workspace Editor view, which has a navigation panel on the left that lets you access your entire app's structure, including brief, data model, design, settings and more. See below for more.
The App Editor will default to the Design view, were you'll see a preview of your app when it's ready. Not every screen will be generated at first - the editor will prompt you to create the missing ones when needed.
You can also preview a live version of the generated app by clicking the Live view button in the top toolbar. This opens a live version of the app using real data and navigation.
Preview features:
Test real interactions (e.g. forms, navigation)
View responsive layouts
Interact with mock or connected data
3. Understanding the Workspace Editor
When a prompt is processed, the Buzzy Workspace is populated with structured views of your app. These include:
🔹 Brief
A high-level summary of what your app does, based on your prompt. You can revise this at any time to re-guide the AI.
🔹 Blueprint
An auto-generated list of screens and key components. This gives a birds-eye view of your app’s structure and user flow.
🔹 Theme
Buzzy AI v3 apps have built-in themes. This area lets you modify basic theme settings like colours, typography and more.
🔹 Design
Where you view and edit the actual screens. This includes layout, components, bindings, and screen-level logic.
🔹 Data
A list of data collections (e.g. tasks, users, products) and their fields. These power your app’s dynamic content.
🔹 Publish (new)
Shows your app's publish information (live url, qr code to preview on a device) and more. It also includes deployment controls and information - you'll need to sign up to a deployment plan to get your app into one of the app stores.
🔹 People
Where you can manage access and permissions for your app.
🔹 Settings
Control your app's settings and core information here, including privacy and publish status, custom header code and more.
🔹 Versions (new)
Buzzy now has version control - rollback to previous versions if needed.
4. Editing your app in the Design Tab
To make changes using AI:
Open the Design tab and select a screen via the select dropdown at top left above the preview.
Open the AI panel (top right in the top toolbar) of the screen editor if it's not already open.
Enter a new prompt describing the changes you want (e.g. "Add a search bar at the top", "Change layout to two columns", "Include a button to export data").
The AI will regenerate that screen’s layout and components based on your instruction. You can undo or adjust as needed.
To make manual changes:
With the Design tab open and the correct screen selected, switch the Preview panel to Edit mode via the toggle control (top right).
You can now click on elements on your previewed app screen - they will be selected and a Properties panel will open on the right.
Use the controls in the Properties panel to make changes - the options available here will depend on the nature of the element you selected.
Note that you can see the breadcrumb path to the item you selected below the preview - these are all selectable. For instance you might click on a button label, but want to modify the button itself. The breadcrumb list will show you the path down to the selected button label - simply click the parent button item to select it instead.
💡 Tip: You can mix AI edits with manual design edits at any time.
💡 Tip: New apps generated via Buzzy AI v3 are no longer editable in Figma. If you want to keep working with Figma and the Buzzy plugin, you will need to generate your app via the Buzzy Figma plugin, or manually in Figma.
For more examples and help, visit the Buzzy AI Prompt Guide.
Last updated