> ## Documentation Index
> Fetch the complete documentation index at: https://docs.flowx.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Milestone nodes

> A **milestone node** is used to define how [user tasks](../node/user-task-node.md) (which are placed between two milestones - **start milestone** and **end milestone**) will be displayed.

<Frame>
  ![Start milestone node](https://s3.eu-west-1.amazonaws.com/docx.flowx.ai/building-blocks/node/milestone_node_start.png#center)
  ![End milestone node](https://s3.eu-west-1.amazonaws.com/docx.flowx.ai/building-blocks/node/milestone_node_end.png#center)
</Frame>

Multiple options are available for displaying the content:

* [Modal](#modall)
* [Page](#page)
* [Stepper + Steps](#stepper--steps)
* [Container](#container)

## Configuring a Milestone node

A combination of [**start**](../node/start-end-node#configuring-a-start-node) and [**end**](./start-end-node#configuring-an-end-node) nodes can be used to achieve all kinds of a grouping of multiple user task nodes.

To configure a user task to be displayed in a Modal:

1. Open **Process Designer** and start configuring a process.
2. Add a **user task** that you want to display.
3. Add a **start milestone** before the user task.
4. Add an **end milestone** after the user task.

![](https://s3.eu-west-1.amazonaws.com/docx.flowx.ai/building-blocks/node/milestone_node_modal_config.gif)

5. Select the **start milestone node** and open [UI Designer](../ui-designer/) - here you can choose from multiple templates of how to display the content.

6. For example, drag and drop the **modal** template to the canvas.

7. No additional information is required for displaying a **user task** in a modal view but you can do multiple customizations via the different configurations using the UI Designer.

![Modal template](https://s3.eu-west-1.amazonaws.com/docx.flowx.ai/building-blocks/node/milestone_node_modal_config1.gif)

## Available components

### Modal

You can configure a start milestone node and an end milestone node before and after a [user task](../node/user-task-node). After adding the milestones, you can add a modal template to the start milestone node to display a modal screen (like in the example above).

![Modal screen](https://s3.eu-west-1.amazonaws.com/docx.flowx.ai/building-blocks/node/modal_screen.png)

### Page

A basic full page content can be displayed using this kind of template on a milestone start.

![Page template](https://s3.eu-west-1.amazonaws.com/docx.flowx.ai/building-blocks/node/milestone_page.png)

### Stepper + Steps

To create a stepper architecture:

1. First define a **milestone start node**.
2. Then add a **Stepper template** on the first node (and a **milestone end** after the **first node**).
3. In between the **stepper milestones** add for each **step** a **milestone start** and a **milestone end** node with a **Step** configuration.

![Example of a Stepper configuration with two steps](https://s3.eu-west-1.amazonaws.com/docx.flowx.ai/building-blocks/node/stepper_config_two_steps.png)

For more information about how to create a process with a Stepper + Steps structure, and how to configure the UI, check the following section:

[Creating a User Interface](../../flowx-designer/managing-a-process-flow/creating-a-user-interface)

### Container

Containers allows us to display multiple user task on the same Page/Modal/Step with a different layout, other than the basic one. You can use **Layout** tab to play with multiple alignments.

![Container template](https://s3.eu-west-1.amazonaws.com/docx.flowx.ai/building-blocks/node/milestone_container.png)


## Related topics

- [FlowX.AI 4.7.10 Release Notes](/release-notes/v4.x/v4.7.x-lts/v4.7.10-november-2025/v4.7.10-november-2025.md)
- [FlowX.AI 4.6.0 Release Notes](/release-notes/v4.x/v4.6.x/v4.6.0-january-2025/v4.6.0-january-2025.md)
- [FlowX.AI 4.6.1 Release Notes](/release-notes/v4.x/v4.6.x/v4.6.1-february-2025/v4.6.1-february-2025.md)
- [FlowX.AI 5.3.0 Release Notes](/release-notes/v5.x/v5.3.0-december-2025/v5.3.0-december-2025.md)
- [FlowX.AI 5.2.0 Release Notes](/release-notes/v5.x/v5.2.0-november-2025/v5.2.0-november-2025.md)