infer-experience-from-code

What problem does it solve?

It turns brownfield frontend code into an initial, evidence-backed structural experience blueprint (personas, screens, flows, and a design-token inventory) so product designers can proceed without guessing or fabricating visual and UX details.

Core Features & Use Cases

• Frontend route-to-screen inventory: Detects route/page surfaces and emits one screen stub per discovered route, including minimal state scaffolding (default/loading/error) and marked knowledge gaps.
• Navigation call-site-to-flow mapping: Scans route/components for navigation transitions and groups them into goal-oriented flows with Mermaid sequence diagrams.
• Auth-role-to-persona seeding: Infers lightweight JTBD persona drafts from auth entry points, RBAC/role definitions, and route namespaces, rejecting demographic-driven persona assumptions.
• Design-token harvesting from configuration: Builds a structural design-system token inventory from Tailwind/theme/style configs and global token definitions, explicitly listing what cannot be inferred.
• Design-spec consolidation for downstream work: Produces an index that links all generated artifacts so enrichment can focus on true knowledge gaps.

Quick Start

Run infer-experience-from-code during codify to generate personas, screens, flows, and a design-system token inventory from detected frontend code.