# Get your Figma ready for Bravo

**What is Bravorizing?**

**Bravorizing** is the process of setting up your design file for being converted into a fully functional native app by Bravo Studio. This process ensures that your designs are optimized and compatible for a seamless conversion and app development experience.

Bravorizing generally consists of:

* [**Structuring layers**](/set-up-design/setting-up-your-design-file/structuring-the-design-the-layer-hierarchy.md) as required by each Bravo component.
* [**Adding** **Bravo tags**](/set-up-design/setting-up-your-design-file/what-are-bravo-tags.md) to add functionality and structure.

Learn the art of *bravorizing* through our beginner's guide video. Below, find step-by-step instructions for an easy setup process. To familiarize yourself with its setup, make sure it's already Bravorized. You can also duplicate this [**sample design file**](/set-up-design/sample-design-files.md) to learn more.

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

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

### Learn how to set up your design file before importing it to Bravo:

{% content-ref url="/pages/ACrqT37S6gANFp3cSgcr" %}
[Structuring the design: the layer hierarchy](/set-up-design/setting-up-your-design-file/structuring-the-design-the-layer-hierarchy.md)
{% endcontent-ref %}

{% content-ref url="/pages/RMwQ9MnTJko6ICXwFH0r" %}
[The container](/set-up-design/setting-up-your-design-file/the-container.md)
{% endcontent-ref %}

{% content-ref url="/pages/A0ah6yH6s5ZlD9eSfMxt" %}
[Bravo plugin for Figma](/set-up-design/bravo-plugin-for-figma.md)
{% endcontent-ref %}

{% content-ref url="/pages/-MXrEeGwIxR1H9L8F1ba" %}
[Bravo Tags: adding functionality to the UI elements](/set-up-design/setting-up-your-design-file/what-are-bravo-tags.md)
{% endcontent-ref %}

{% content-ref url="/pages/3smNzWid4GNWcY8I14ZN" %}
[App navigation](/set-up-design/setting-up-your-design-file/app-navigation.md)
{% endcontent-ref %}

{% content-ref url="/pages/-MfDz7zz4OgoSEUDE-CF" %}
[Sample design files](/set-up-design/sample-design-files.md)
{% endcontent-ref %}

{% content-ref url="/pages/-MhxgodWeJZkztsD-\_1-" %}
[Best Practices](/set-up-design/bravo-best-practices.md)
{% endcontent-ref %}

### Tutorial: Create your first app with Bravo

Follow this tutorial to learn how to create your first app with Bravo Studio. \
You will understand what Bravo is and its very basic concepts: Bravorizing, Bravo Tags, Binding and more:

<div align="center"><img src="/files/JMnerUSqjvnk0ZqZN6fx" alt=""></div>

Check out the complete tutorial here:

{% content-ref url="/pages/UGPIrQaqXZvUp9qzcDja" %}
[Create your first app](/get-started/create-your-first-app.md)
{% endcontent-ref %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.bravostudio.app/set-up-design/setting-up-your-design-file.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
