ux-flow-specification

Solid

Document the complete user experience of a product - information architecture, user journeys, screen-by-screen flows, and every UI state (loading, empty, error, success) - independent of visual styling. Use to define exactly how a user moves through a product before or alongside implementation, so navigation and edge-case behavior are decided upfront rather than improvised.

Web & Frontend 6 stars 2 forks Updated 6 days ago MIT

Install

View on GitHub

Quality Score: 84/100

Stars 20%
28
Recency 20%
100
Frontmatter 20%
70
Documentation 15%
100
Issue Health 10%
80
License 10%
100
Description 5%
100

Skill Content

## Purpose Produce a UX flow specification that documents how a user moves through a product: the information architecture, the step-by-step journey for each key task, every screen involved, and every state each screen can be in. **A flow spec is not a visual design.** It says "after a failed payment, the user sees an inline error on the same screen with the amount preserved and a retry button" - it does not say what color that error is. Visual language belongs in `design-system-specification`; this document belongs to behavior and structure. ## Input **Works best with:** The name of the product or feature and the primary task(s) a user is trying to accomplish. **Also valuable:** Existing personas or user research, known edge cases, any regulatory or accessibility requirements affecting flow (e.g., mandatory confirmation steps). **Example invocation:** `Document the user flow for account signup through first successful login. Users sign up with email, verify via a emailed code, set a password, and land on an empty-state dashboard. Needs to handle: expired verification code, wrong code entry, and a user who already has an account.` ## Key Concepts ### Information Architecture (IA) The structural map of every screen/page in the product and how they nest or relate - the site map. IA answers "where does this screen live and how does a user get there," independent of any single task flow. ### User Journeys vs. Screen Flows - **User Journey:** The end-to-end narrative of a ...

Details

Author
fattain-naime
Repository
fattain-naime/engineering-docs
Created
2 months ago
Last Updated
6 days ago
Language
JavaScript
License
MIT

Bundled in these plugins

Similar Skills

Semantically similar based on skill content — not just same category