Skip to content

LinzLos/FLOWIE

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

29 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

🧩 FLOWIE v2.6

FLOWIE is a structured, versioned, machine-readable reference that an agent reads to run a consistent UX-flow critique — extracting a UI's structure, checking it against usability heuristics and coupling invariants, and reporting what would confuse a real user.

The point isn't a clever one-off prompt. It's that the critique logic lives in a repo as a structured artifact: readable by both collaborators and machines, version-controlled, and reusable across projects. You improve the critique by editing the script and bumping the version — and every project that references FLOWIE picks up the change.

What it is today

A single structured script (.xml + .txt, see manifest.json for the current version) that an LLM or agent can load and run. Given a screenshot, code, a Figma link, or a written description of a screen, FLOWIE:

  • Extracts the structure — reads the nav, content sections, controls, their order and labels — from whatever artifact you give it. You don't hand-inventory anything.
  • Checks coupling invariants — verifies that coupled parts of the UI stay consistent: that a side nav's order matches the content it indexes, labels match their targets, counts line up, controls actually do something, and paths in have paths out.
  • Traces interactions — evaluates what happens after an action (click a nav item → where do you land, in what order), not just how the screen looks at rest.
  • Applies usability heuristics — Shneiderman's 8 Golden Rules and Wickens et al.'s 13 display-design principles.1
  • Outputs a contract — a short checklist of the invariants that must hold, so a later edit to one side flags what else must change.
  • Exports builder schema — structured output for Figma, Framer, and V0.

It's also a clean teaching reference for human-centered UX critique — the structure makes the reasoning legible to students and junior designers, not just machines.

Where it's going

FLOWIE is built to be operated, not just pasted. The direction — not yet built — is for a scheduled agent to run the current version against a project automatically: re-checking invariants as a design changes, rolling out critique updates by version bump, and firing notifications when a check fails. The structured, versioned format is the groundwork for that; this section is a roadmap, not a description of shipped features.

🚀 How to use

The script lives in scripts/versions/; manifest.json always points at the current version.

Primary — reference it from an agent. Point your agent at the current script file and have it run FLOWIE's passes against the project or artifact you're reviewing. Because it's versioned, the agent always reads the same defined logic, and updates propagate by bumping the version.

Fallback — paste it into a chat. If you don't have an agent set up, you can still upload the .txt or .xml to any LLM (ChatGPT, Claude) and say "Use this FLOWIE script to analyze a UI flow I'm about to describe." It will prompt you for anything it needs. This is the manual path — fine to start with, but the structure exists so you can automate past it.

🛠️ Features

  • Structure extraction from screenshots, code, Figma, or prose — no manual inventory.
  • Coupling / invariant checks against a named, extensible invariant library (indexed order, label parity, count parity, control-has-effect, reversible nav).
  • Interaction-consequence tracing — reviews resulting state, not just resting layout.
  • Usability heuristics — Shneiderman's 8 Golden Rules + Wickens et al.'s 13 display-design principles.
  • Builder schema export for Figma, Framer, and V0.
  • Regression cases in cases/ — known failure modes FLOWIE should catch, so each version can be scored against the last.
  • Guided or Quick Start input; support for conditional, role-based, and bulk flow variants.

On the roadmap: role-based critique lenses (e.g. navigator, friction-tester, accessibility) mapped to FLOWIE's existing passes. Direction, not a shipped feature.

🙌 Contributors

People who used FLOWIE on real work and genuinely shaped it:

  • Taylor Cornelius — Early tester of FLOWIE v1. Shared reactions and refinement opportunities after using it on live prototypes.
  • Mubarak Haruna — Used FLOWIE v2.2 on BRIDGEGOOD's apprentice database; helped shape onboarding clarity and schema logic.

Created with ❤️ by Lindsay Zuñiga. Please credit when remixing or adapting. Feedback welcome.

Footnotes

  1. Heuristic sources — 8 Golden Rules: Shneiderman & Plaisant, Designing the User Interface. 13 Principles of Display Design: Wickens, Lee, Liu & Gordon-Becker, An Introduction to Human Factors Engineering (2nd ed.). FLOWIE's framework, passes, and invariant logic are original; these established heuristic sets are credited to their authors.

About

Versioned, machine-readable UX-flow critique you operate, not paste — extracts a UI's structure, checks coupling invariants, traces interactions, and flags what would confuse a real user.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors