Discover and structure UI redesign requirements before changing a website or dashboard. Use when an agent should inventory the current UI, ask targeted questions about the user's desired journey, and turn that into an approved UX/UI brief before implementation.
Use this skill when the user wants a website or dashboard UI rebuilt, simplified, or reorganized and the requirements are still fuzzy, incomplete, or mixed with taste-level feedback.
This is a discovery-first workflow. Do not jump from "make the UI better" straight into code changes. First make the current state and the target journey explicit.
current UI, target journey, and redesign brief as separate artifacts.Produce these artifacts in order:
Current UI inventoryTarget user journeyInteraction and information rulesApproved redesign briefUse the templates in references/worksheet.md when you need a copyable format.
Goal: make the existing UI explicit.
Write down:
Rules:
The output must be easy for the user to copy and trim. Use a checklist-style block, not a paragraph.
If no current UI exists:
No current UI to inventoryGoal: find out what the user actually wants to do in the product.
Ask for the intended user journey in the order the user would expect it to happen.
Prioritize questions like:
Do not start with:
If the user answers loosely, rewrite the answer into a numbered journey and ask for confirmation or correction.
Turn the user's raw description into a short, structured flow:
For each step, capture:
Keep the main path separate from side paths and exceptions.
Turn the journey into concrete UI rules.
Cover at least:
Useful pressure tests:
Write a brief that can drive implementation without forcing the user to restate everything.
The brief should contain:
Do not hide uncertainty. If something is assumed rather than confirmed, label it clearly.
Use this order when reporting the requirements work:
Concrete checklist of what exists now.
Short numbered flow in the user's language.
Explicit rules for visibility, sequence, emphasis, and removal.
Concise implementation-ready summary.
agent-browser when you need to inspect a live website or dashboard.ui-essential-flow after requirements are clear and you need to cut noise.ui-clarity-loop while iterating on the actual redesign and reviewing what still feels wrong.