> For the complete documentation index, see [llms.txt](https://docs.uncodie.com/1.0/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.uncodie.com/1.0/basic-concepts/prototyping/navigation.md).

# Navigation

App interactions

## Overview

Navigation is the result of several components and IDE features interaction, for this point, you should be familiarized with components, screens, and variables to achieve complex interactions.

<figure><img src="https://616870859-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZ1eJ3100gppGz1pXp1J7%2Fuploads%2FvQ6B6rjIRzB9030ueb2e%2FNavigation.png?alt=media&amp;token=8932ebe5-fb6a-4959-9268-b045903bab26" alt=""><figcaption></figcaption></figure>

## Quickstart

To add new paths to your Uncodie projects simply add Main Frame components inside a Page and prototype navigation with buttons and links. This will compile screens and paths with the main frame name as a URL path.

## Navigate between pages

### Prototyping in Figma

Once you have declared some screens, see:

{% content-ref url="/pages/4pAPyqfacqAmNZl4eVU8" %}
[Screen Page](/1.0/basic-concepts/components/screen-page.md)
{% endcontent-ref %}

You can navigate and add links between apps or sections by using the prototype capabilities in figma

### Select and Navigate

You can act Select and Navigate to select a property from the current element and pass that variable in the URL Route Context to the next screen, see:

{% content-ref url="/pages/dxtoLKKOJB3vWN9f1orq" %}
[Actions](/1.0/basic-concepts/actions.md)
{% endcontent-ref %}

and for variable managing also see:

{% content-ref url="/pages/bpwJqBMjuMSmxLa24RMM" %}
[Variables](/1.0/basic-concepts/variables.md)
{% endcontent-ref %}