# App navigation

The navigation between the app pages is set in the design tool (Figma or Adobe XD), by creating prototyping links between the pages.

![](https://1444025092-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MXpqEanvOhm8vMtIH8i%2Fuploads%2FHLcUq5VmZNJfOol0r3IH%2Fimagen.png?alt=media\&token=1e4514b6-6dcb-4d69-b188-f481ea33bbbd)

Creating these links has another important function: **passing data** between the API requests bound to the app pages. 

For instance, to create a page showing a list with several items, that navigates to a specific detail page when a certain item is pressed. In this case, the prototyping link will be created from the list container element to the app page with the detail information.

![](https://1444025092-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MXpqEanvOhm8vMtIH8i%2Fuploads%2FfYxSjfya0lnpOukccB1O%2Fimagen.png?alt=media\&token=5d25d4a3-4703-40eb-8fd0-31796649fb53)

{% hint style="info" %}
See [here](https://docs.bravostudio.app/get-started/create-your-first-app#step-3-importing-the-backend) how to create the API requests for the list and detail page setup.
{% endhint %}

Also, the prototyping tool will be used to specify the app **home screen**. 

## How to set up app navigation links

Below you can find how to create the prototyping links to create the app navigation, depending on the design tool you use.

{% content-ref url="app-navigation/setting-up-app-navigation-on-figma" %}
[setting-up-app-navigation-on-figma](https://docs.bravostudio.app/set-up-design/setting-up-your-design-file/app-navigation/setting-up-app-navigation-on-figma)
{% endcontent-ref %}

{% content-ref url="the-container/setting-up-a-container-on-adobe-xd" %}
[setting-up-a-container-on-adobe-xd](https://docs.bravostudio.app/set-up-design/setting-up-your-design-file/the-container/setting-up-a-container-on-adobe-xd)
{% endcontent-ref %}