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

# Map a user flow

*See every step and decision in a journey before you design screens.*

[Map UX edge cases and user flows with Figr AI](https://www.youtube.com/embed/1hAOPDLPCuU)

A user flow shows how someone moves through your product to reach a goal: each step, each decision, and where they can drop off. Mapping it first helps you agree on the journey with your team before anyone opens a design file.

**1. Describe the journey**

Tell Figr who the user is, where they start, and what they're trying to do. For example: "Map the flow for a new user inviting a teammate, starting from the dashboard."

> [!TIP]
>
> Start with one goal per flow. "Invite a teammate" and "change billing plan" are easier to review as two flows than one.

**2. Attach your Context Pod**

Select your pod in the chat so the flow follows how your product works today, not a generic pattern.

**3. Review the flow on the canvas**

Figr draws the flow as a diagram with steps, decisions and branches. Check the happy path first, then the branches.

![Image](https://mintcdn.com/figr-1af7ae64/MWugUlEIv8OG0sG0/images/image-39.png?fit=max\&auto=format\&n=MWugUlEIv8OG0sG0\&q=85\&s=b8073023b7c7d9836107961630d60907)

**4. Refine it**

Ask Figr to add a missing step, split a branch, or cover a different entry point. For example: "Add what happens when the invite email bounces."

To fix one point in the flow, use select and edit: select the node on the canvas, then tell Figr what to change there. For example: "Ask for the teammate's role at this step." Figr focuses the change on that node instead of redrawing the whole flow.

![Screenshot 2026 10 21 At 3 20 10 PM](https://mintcdn.com/figr-1af7ae64/GFl9SXL01D1q0Z7d/images/Screenshot-2026-10-21-at-3.20.10-PM.png?fit=max\&auto=format\&n=GFl9SXL01D1q0Z7d\&q=85\&s=80a0d1c2ec129534756454c160c7a343)

**5. Ask Figr to design the screens**

For example: "Design the screens for this flow, including the error states." Figr places the screens on the canvas in the same order as the flow.

![Screenshot 2026 10 21 At 3 21 43 PM](https://mintcdn.com/figr-1af7ae64/GFl9SXL01D1q0Z7d/images/Screenshot-2026-10-21-at-3.21.43-PM.png?fit=max\&auto=format\&n=GFl9SXL01D1q0Z7d\&q=85\&s=297a85efe00e2bdd8186a3a99fa11b53)


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.