> For the complete documentation index, see [llms.txt](https://docs.buzzy.buzz/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.buzzy.buzz/working-with-buzzy/buzzy-ai/enhance-with-figma.md).

# Enhance with Figma

**Purpose**: Refine and improve the initial prototype.

**How It Works**: Customize the app design, functionality, and workflows by porting your app into Figma. Edit your app with Figma's design-centric interface and use the Buzzy Figma plugin to manage your apps functionality, data model and behaviour. .

**Key Features**: Add more advanced logic, improve UI/UX, manage your design and optimize for user-specific needs.

**Outcome**: A more polished app ready for initial user testing or soft launch.

{% hint style="info" %}
It helps to be familiar with Figma, and have an understanding of how the Buzzy plugin works via our [Buzzy Figma plugin getting started guide](/getting-started-with-buzzy/getting-started-with-figma.md). If you are working with a designer or implementation partner, point them to [Buzzy Accreditation](/working-with-buzzy/buzzy-accreditation.md) so they understand the expected Buzzy/Figma workflow.
{% endhint %}

***

## Import your AI-generated Buzzy app into Figma

You'll need to import your AI-generated app into Figma. You can then edit and republish the app directly from Figma using the Buzzy Figma plugin.

**Make sure you have a Figma account with the same email address as you've used for Buzzy.**

{% embed url="<https://youtu.be/XDQExOpXdwo?si=bVdCA__ME-GfQJVn>" %}
Note - the plugin now defaults to Wizard mode, so this is all a lot easier now!
{% endembed %}

{% hint style="info" %}
Get the [Buzzy AI Toolkit v2.2](https://www.figma.com/community/file/1466412289660685275/buzzy-ai-toolkit-v2-2) here!
{% endhint %}

{% hint style="info" %}
Prefer step-by-step written instructions? [See the full process here](/archive/archive-stuff/getting-your-buzzy-ai-app-into-figma-full-description.md).
{% endhint %}

***

## Edit your AI-generated Buzzy app in Figma

You'll need to get familiar with how the Buzzy Figma plugin works. Start with the [current Buzzy Figma plugin guide](/getting-started-with-buzzy/getting-started-with-figma.md), then use the toolkit examples below for AI-generated app refinement.

Buzzy AI apps are based on the [Buzzy Figma toolkit](https://www.figma.com/community/file/1466412289660685275/buzzy-ai-toolkit-v2-2), a design system built in Figma. It leverages Figma's awesome design capabilities such as reusable and customizable components, variables to control themes, flex-based autolayouts and more. It also includes additional interface components, layouts and entire screen design examples you can use to quickly add to and extend your app.

Once you're done editing, simply publish your changes to your live app, directly from Figma.

{% embed url="<https://www.youtube.com/watch?v=IJ_XwoHQcPQ>" %}
Note: this video shows the v1 Buzzy AI toolkit - the new v2 has a simpler layout and even more design options!
{% endembed %}

### Swapping your app's theme

{% embed url="<https://youtu.be/-c7ptUv5nyY>" %}

### Modifying a theme

{% embed url="<https://youtu.be/qcopjUOhmOY>" %}

### Customizing UI components

{% embed url="<https://youtu.be/CJPHZgHo9XI>" %}

***

## New to Figma?

New to Figma, or don't have design skills? You have two options: [learn Figma](/working-with-buzzy/buzzy-for-figma/learning-figma.md), or work with a designer who can learn the Buzzy plugin and accreditation workflow.

{% content-ref url="/pages/B1n4MS11onwcanp8UGCH" %}
[Learning Figma](/working-with-buzzy/buzzy-for-figma/learning-figma.md)
{% endcontent-ref %}

{% content-ref url="/pages/MoyBJeuncQWHUKerofBt" %}
[Buzzy Accreditation](/working-with-buzzy/buzzy-accreditation.md)
{% endcontent-ref %}

{% content-ref url="/pages/jxH8xn1PEjixcWvOKs0R" %}
[Getting Started with Figma](/getting-started-with-buzzy/getting-started-with-figma.md)
{% endcontent-ref %}