# Turn a screen into a flowchart, spec or tasks

> Use AI to convert a wireframe into another board item, such as a flowchart, a customer journey, a document or a kanban board, placed beside the screen.

Source: https://mockflow.com/docs/convert-wireframe-to-other-items

A screen often needs more than a picture of the UI: the flow behind it, a spec for developers, or the tasks to build it. **Convert to** reads a wireframe and creates that item with AI, right beside the screen on the same board. The wireframe stays as it is.

![A food delivery phone wireframe connected to the Food Order Tracking Flow flowchart that AI made from it](https://assets.mockflow.com/docs/media/7abc7a0aa24c4ed981970d227a231e6b.webp)

## Convert a wireframe

![The AI menu of a wireframe with the Convert to list open and filtered to Flowchart; AI, Convert to and the search box numbered](https://assets.mockflow.com/docs/media/51e32b8d7492470383f3872795188e3e.webp)

1. Select the wireframe and click **AI** (1) in its toolbar.
2. Point to **Convert to** (2). A list of board components opens.
3. Type in the search box (3) to find one quickly, then click it.
4. Optionally describe what you want, for example "user flow to order tracking", and click the send button.

AI builds the new item next to the screen and connects the two, so the board shows where it came from.

![Selecting a phone wireframe, opening AI, Convert to, searching for flow, choosing Flowchart / Diagram and sending a prompt; a flowchart appears beside the screen, connected to it](https://assets.mockflow.com/docs/media/ef666018e5814f07810b80bcc43f61b5.webp)

## What a screen can become

The list covers most of the board's components. Some useful choices for a screen:

| Convert to | What you get |
| --- | --- |
| Flowchart / Diagram | The user flow behind the screen, with steps and decisions. |
| CustomerJourney | The journey a user takes through the product. |
| Document | A spec or notes describing the screen. |
| CodeBlock | Code for the screen. |
| Kanban | A board of tasks to build it. |
| Tree Diagram | A sitemap of the app or site. |

You can also convert a screen into a mind map, a table, a checklist, a timeline, a chart, a moodboard or a prototype, among others. To make a clickable prototype from your screens, see [Make a clickable prototype](/docs/make-a-clickable-prototype).

> **Note** Converting uses AI credits.

## Related articles

- [Generate and edit screens with AI](/docs/generate-wireframes-with-ai)
- [Render a hi-fi screen or device mockup](/docs/render-hi-fi-screen)
- [Export a wireframe](/docs/export-a-wireframe)