breadboard-ui-flow-diagram-template

Breadboard (UI Flow Diagram)

Drawing out every state of a flow is too time-consuming, so we’ll use words for everything instead of pictures. That's Breadboarding. A lightweight notation for user flows.

Drawing out every state of a flow is too time-consuming, so we’ll use words for everything instead of pictures. That's Breadboarding. A lightweight notation for user flows.

Breadboarding is like state diagram. It allows us to play out an idea and judge if the sequence of actions serves the use case we’re trying to solve. Once we get to a place where we play through the use case and the flow seems like a fit, we’ve got the elements we need to move on to start defining the project more clearly.

Read more here.

There are times when text alone isn't enough, and you need to sketch out an idea. A drag and drop interface of some sort comes to mind. They can be complicated enough that breadboarding alone wouldn't be sufficient.

For that, use the Fat Marker Sketching technique. Both techniques are quick and cheap enough to do often. That said, they are ideal for supporting conversations in the earliest stages of an idea for a solution. Visually externalizing representations of our mental models is imperative to continuously maintain a shared understanding of the work.

Breadboard (UI Flow Diagram)

Get started with this template right now.

Related Templates
Azure Guidebook template thumb
Preview
Azure Guidebook
flow-diagrams-template-thumb
Preview
Flow Diagrams
Cross-Account EC2 Status Monitoring for High Performance Computing (HPC) Clusters-thumb-web
Preview
Cross-Account EC2 Status Monitoring for HPC Clusters Template
Blogging System-thumb-web
Preview
ERD Blogging System Template
Spaghetti diagram template-thumb
Preview
Spaghetti Diagram Template
GENOGRAM -web-1
Preview
Genogram Template