fbpx
Wireflows

Wireflows

Wireflows are a design-specification format that combines wireframe-style page layout designs  with a simplified flowchart-like way of representing interactions.

Wireflows emerged as a common practice among teams designing mobile apps, where each step in the flowchart is represented by a wireframe for a full mobile-screen design. Because of the relatively small size of mobile screens, actual page designs (i.e., wireframes) could easily replace abstract symbols in flowcharts. However, wireflows are not merely limited to documenting mobile apps and websites — they can also be used for desktop products, typically by showing a portion of a screen or webpage that changes based on user interactions. Many designs for ecommerce shopping carts and checkout pages are suited to be specified as wireflows.

Wireflows are an emerging UX deliverable for documenting user workflows and complex interactions for mobile and webapps. They are well suited for representing dynamic changes on one or few pages inside an app, and work less well for capturing flows through a large number of relatively static pages linked together. Wireflows are also useful as a collaboration and ideation technique for teams to think through user workflows and tasks and to ideate screen designs at each step in the process.