Wireflows

The term "wireflow" combines "wireframe" and "flowchart," coined by Nielsen Norman Group.^[1] As the name suggests, wireflows merge the benefits of both wireframes and flow diagrams into a single documentation method.

Wireflows show visual UI changes as users interact with an application or website. They can also contain annotations indicating what happens in the back-end during each interaction. Think of wireflows as illustrated task flows and flowcharts.

Wireflows work best for mobile, desktop, or web apps that don't have many unique pages but feature core pages with content that changes dynamically based on user interaction. This lets designers show UI design in the context of common user tasks.