User Interface Flows

Excerpt from a design tool concept.

User Interface Flows helps designers to focus on efficient interaction design and edge case discovery before they invest time in composing layouts during a wireframe phase.

The top part of the card is used to describe what user should see or hear while interacting with the interface.

The bottom part lists different actions which user can take to interact with the content they process. First action is the primary action which leads to completing the main task described by the interface flow.

Model on the right presents the scenario of updating one of the interaction’s types from click to select and typing in more details about the interaction.