SkillsAdd

heyeddi-com/heyeddi-skills

ux-flow-auditor

Traces user task flows with Playwright: click depth, step success, friction: and writes reports to .heyeddi/docs/ux-flows/.

First seen Jul 6, 2026

Installation

$ npx skills add heyeddi-com/heyeddi-skills --skill ux-flow-auditor
View on skills.sh ↗ GitHub repository ↗

Summary

  • Traces user task flows with Playwright: click depth, step success, friction: and writes reports to .heyeddi/docs/ux-flows/.
  • Use when measuring ease of use, clicks to complete a task, or onboarding friction.
  • Not for static visual critique (use heyeddi-design critique) or layout screenshots (use visual-auditor).

Similar popular skills

Related neighbors and high-traction skills in the same topics — useful to compare before installing.

agent-browser Shared topics
vercel-labs/agent-browser

Browser automation CLI for AI agents. Use when the user needs to interact with websites, includ…

810.4K installs
azure-diagnostics Shared topics
microsoft/azure-skills

Debug Azure production issues on Azure using AppLens, Azure Monitor, resource health, and safe …

568.9K installs
azure-validate Shared topics
microsoft/azure-skills

Pre-deployment validation for Azure readiness. Run deep checks on configuration, infrastructure…

567.7K installs
supabase-postgres-best-practices Shared topics
supabase/agent-skills

Postgres best practices maintained by Supabase, for Postgres running anywhere. Load this skill …

391.6K installs
firebase-security-rules-auditor Similar name
firebase/agent-skills

>- Audits Firebase (Firestore, Cloud Storage) security rules for vulnerabilities, privilege esc…

111K installs
firestore-security-rules-auditor Similar name
firebase/agent-skills 20.4K installs

Also in this package

Other skills from heyeddi-com/heyeddi-skills · top by installs.

npx skills add heyeddi-com/heyeddi-skills
flutter-engineering 72 project-engineering 71 design-handoff-flutter 69 engineering-excellence 69 pre-merge-gate 69 design-system-generalizer 69 heyeddi-design 69 visual-auditor 69 verify-build 69 primevue-openprops-architect 69

Browse all from heyeddi-com/heyeddi-skills

More details

Agent compatibility

Declared targets from SKILL.md / docs. Unmarked agents are not listed — the skill may still install via the CLI.

Claude Code Not declared
Cursor Not declared
Codex Not declared
GitHub Copilot Not declared
Windsurf Not declared
Gemini CLI Not declared
Cline Not declared
OpenCode Not declared

Repository health

License LICENSE
Default branch main
Open issues 0
Status Active

Skill metadata

Parsed from SKILL.md frontmatter.

Version1.0.0

Package contents

Files included with this skill beyond the listing page.

  • skill md SKILL.md 3,058 B
  • docs SUMMARY.md 334 B

History

  1. First seen on skills.sh
  2. First recorded snapshot · 70 installs

SKILL.md

UX Flow Auditor

Task-oriented UX: how many clicks to achieve a goal, where users get stuck.

All artifacts go under .heyeddi/docs/ and .heyeddi/audits/: never repo root.

Cross-pillar sync (mandatory)

Read reference/cross-pillar-handoff.md. Bookend every flow trace:

@heyeddi-orchestrator  load_workflow_context --route /path
trace_flow …
update ux-flows report + friction notes
@heyeddi-orchestrator  append_pillar_opinion --pillar ux …
→ @heyeddi-product updates AC if needed; @heyeddi-design notes layout friction

When to use

  • "How many clicks to update settings?"
  • Post-ship ease-of-use check
  • Compare desktop vs mobile flow (separate flow JSON or viewport)
  • Product acceptance: task completes within click budget

Subagents (default)

See reference/subagents.md. Run trace_flow.py via Task shell (needs dev server + Playwright).

Pipeline

init_ux_flows          → ux-flows.md index + example .flow.json
define steps in ux-flows/<task>.flow.json
trace_flow --task-id   → ux-flows/<task>.md + audit screenshot
agent adds friction notes to report

Instructions

  1. Ensure .heyeddi/product.md defines user tasks (optional context).
  2. python scripts/inituxflows.py --project-root <root> once per project.
  3. Add or edit .heyeddi/docs/ux-flows/<task-id>.flow.json with steps (expect, fill, click).
  4. Start dev server; set DEVSERVERURL if not http://localhost:5173.
  5. python scripts/trace_flow.py --task-id <id> --project-root <root> --check
  6. Append Friction notes to the generated markdown report.

Flow JSON schema

{
  "task_id": "update-profile",
  "goal": "User saves profile",
  "start_route": "/settings",
  "max_clicks": 4,
  "viewport_width": 1440,
  "steps": [
    { "action": "expect", "selector": ".settings .p-inputtext", "label": "Form visible" },
    { "action": "fill", "selector": ".settings input >> nth=0", "value": "Alex", "label": "Name" },
    { "action": "click", "selector": "button:has-text('Save')", "label": "Save" }
  ]
}

.heyeddi/ outputs

Path Purpose
.heyeddi/docs/ux-flows.md Index of tasks, budgets, last run
.heyeddi/docs/ux-flows/<task>.flow.json Machine-readable steps
.heyeddi/docs/ux-flows/<task>.md Human report + friction notes
.heyeddi/audits/ux-flow/ Step screenshots

Chain

  • After @heyeddi-handoff / @heyeddi-design: verify tasks are completable
  • @visual-auditor: layout proof; this skill: interaction proof
  • @engineering-excellence: separate concern (code structure)