> For the complete documentation index, see [llms.txt](https://docs.jigx.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.jigx.com/building-apps-with-jigx/ui.md).

# UI

Creating a mobile app's user interface (UI) involves designing intuitive, engaging, and visually appealing elements that facilitate a seamless interaction between the user and the app's functionalities. Create intuitive UIs in Jigx by combining the following elements to achieve the app layout and functionality you want.

<table data-header-hidden><thead><tr><th width="202.6875"></th><th></th></tr></thead><tbody><tr><td><a href="/building-apps-with-jigx/ui/home-hub.md">Home Hub</a></td><td>The home screen or main screen is the initial display that users encounter upon opening the app. It is designed to provide access to the app's various features and functionalities, primarily via bottom tabs and girds.</td></tr><tr><td><a href="/building-apps-with-jigx/ui/jigs-_screens_.md">Jigs (screens)</a></td><td>Screens are referred to as jigs are various pages or views that users can navigate through within the app. Each screen is designed for a specific purpose, presenting content and functionality tailored to a part of the app's overall use case. Common types of screens in a mobile app include forms, lists, calendars, and more.</td></tr><tr><td><a href="/building-apps-with-jigx/ui/components-_controls_.md">Components (controls)</a></td><td>Component controls are the interactive elements that users interact with to perform actions or input data. These controls are crucial for the app's functionality and user experience, enabling users to navigate the app, for example, forms, lists, charts, avatars, location, and more.</td></tr><tr><td><a href="/building-apps-with-jigx/ui/widgets.md">Widgets</a></td><td>Widgets are self-contained components that display content or provide specific functionality on the UI. They can be interactive or purely informational and enhance the user experience by providing quick access to app features, displaying information at a glance, or allowing for direct interaction from the home screen or within the app itself.</td></tr><tr><td><a href="/building-apps-with-jigx/ui/actions.md">Actions</a></td><td>Actions refer to the operations or behaviors that respond to user inputs or system events. Actions enable interaction and determine how the app reacts to various triggers. These can range from simple tasks, such as navigating to a different screen, to more complex operations, like creating data, syncing data, or opening a URL.</td></tr><tr><td><a href="/building-apps-with-jigx/ui/assets.md">Assets</a></td><td>Assets refer to the images and icons used to build and enhance the application. These assets are not part of the app's core codebase but are essential for its functionality, appearance, and user experience.</td></tr></tbody></table>


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

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

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://docs.jigx.com/building-apps-with-jigx/ui.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

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.
