> For the complete documentation index, see [llms.txt](https://docs.wem.io/platform/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.wem.io/platform/wemtipsandtricks/tips-and-tricks/loading-screen.md). # Loading Screen When a user triggers an action that takes some time to complete, such as generating a file or processing data, it is good practice to show a loading screen. This lets users know that the system is working and prevents interaction with the interface until the process finishes. In this article, we explain how to build a simple loading screen using standard flowchart logic, without relying on advanced features. ### Field and Flow The most basic version of a loading screen uses just one field: **Loading Details**. This field holds a message or the progress of a certain process to be shown on the loading screen. The setup uses a flowchart called **Loading Screen**, which includes an **overlay interaction node** and an **assignment node** to clear the *Loading Details* field.

### The Interaction Node The loading screen works because of the **Follow Exit** widget. This widget automatically triggers a selected exit after a defined delay. If no delay is set, it triggers immediately. Even-though the exit is triggered immediately the loading screen remains visible until the next interaction node is reached, without slowing down the process running in the background.

{% hint style="info" %} The loading overlay can be extended by using the progress bar widget to show the loading-screens progress. In the example, a spinning wheel is used to indicate that the system is still working. In this case this is a template with the following script block: ```

``` {% endhint %} ### Using the loading screen

The loading screen in the example is used inside a loop that processes a large number of rows. Every 1000 rows, the *Loading Details* field is updated, and the loading overlay is shown again. This means that the screen updates every time an interaction node is reached. It either shows the updated loading screen or continues to the next screen after the loop ends. Important: **An overlay cannot be the first node after a navigation action.** Overlays require a full-screen page as a base. To solve this, use an interaction node with a Follow Exit widget before the overlay is triggered. In the example below, a full-size interaction called *Widgets* is used to set the background. This page becomes the base for the loading screen overlay to be on top of.

--- # 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 dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter: ``` GET https://docs.wem.io/platform/wemtipsandtricks/tips-and-tricks/loading-screen.md?ask=&goal= ``` `ask` is the immediate question: it should be specific, self-contained, and written in natural language. `goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal. 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.