interface
Skill4 starsChanged 51 days agoMITView on GitHub
User-invoked, cross-discipline interface review that coordinates accessibility, layout, writing, typography, colors, and ui. Use when explicitly invoked for a holistic review of a screen, flow, feature, or product interface. Supports quick and full review modes. Triggers on interface, full interface review, holistic UI audit, cross-discipline design review, review the whole interface.
4 other projects use a version of this.
Adopted by
Most recently taken up by
- jeremy-farnault/claude-skillstheir own version, first seen Nov 3, 2026
- wheslleyrimar/BuildCLI-Agentstheir own version, first seen Oct 22, 2026
- calebnewtonusc/Chewbaccatheir own version, first seen Aug 11, 2026
- kecoma1/MQL5-SKILLStheir own version, first seen Apr 9, 2026
Other versions4 projects use a version of this.
Word for word · 0
None found.
Edited · 0
None found.
Wrote their own version · 4
- kecoma1/MQL5-SKILLS★ 17same name
- calebnewtonusc/Chewbacca★ 8same name
- wheslleyrimar/BuildCLI-Agents★ 3same name
- jeremy-farnault/claude-skills★ 0same name
How matches are found. Word for word: the exact same text. Edited: shares passages with this file (“99% same” means 99% of its five-word phrases also appear here; 10% or more counts). Their own version: similar meaning, or, weakest, the same name. We can’t tell which project had it first. Projects are counted among the 200 most-starred candidates, and mentions are links to the repository we found, up to 50 per site, so both counts are a floor.
In this repository9 other files it gives its agents.
- CLAUDE.mdCLAUDE.md
- template/CLAUDE.mdCLAUDE.md
- accessibilitySkill
- colorsSkill
- layoutSkill
- product-designSkill
- typographySkill
- uiSkill
- writingSkill
The file
We split this skill into the rules it gives an agent
8 rules. 0 are common, 6 are distinctive, and 2 are very specific to this project.
0
Common
Most of the 3 edited versions we read keep these.
6
Distinctive
This author's own choices. Worth a look.
2
Very specific
Tied to their project's names, files or tools. Probably skip.
- Common
- Distinctive
- Very specific
- Distinctive: line 24
If the requested scope is too large to inspect credibly, narrow it to the highest-traffic complete flow and state the boundary.
- Very specific: line 32
Before reviewing, confirm that all six owning skills below are available.
- Very specific: line 45
If an owning skill is unavailable, mark that domain Not reviewed, name the missing skill, and continue with the remaining domains.
- Distinctive: line 47
When two skills appear to cover the same issue, assign it to the skill that owns the underlying rule and mention secondary effects in the …
- Distinctive: line 55
Use one shared severity scale:
- Distinctive: line 77
Treat a review request as read-only.
- Distinctive: line 96
Always use the following sections.
- Distinctive: line 110
Use one table ordered by severity, then reach and leverage:
“Common” is measured: kept by at least 6 in 10 of the 3 edited versions of this file we could read. “Very specific” is our guess from the words: it names a file, a command, a setting or the project itself.
Files
Review the interface as one system
A strong interface is not six independent audits stapled together. Review the whole experience, let each domain skill own its rules, then consolidate the evidence into one prioritized verdict.
This skill owns orchestration only. Accessibility rules belong to accessibility; structure to layout; copy to writing; type to typography; color to colors; visual polish and motion to ui. Never duplicate or override their rules here.
Core Principles
1. Resolve Scope and Mode First
Infer the screen, flow, feature, or repository scope from the request and current workspace. State the resolved scope in the output. Use full when no mode is supplied.
| Mode | Coverage | Finding cap |
quick | Primary user path and highest-traffic states; report only HIGH and MEDIUM issues | 5 |
full | Entire requested scope across all six domain skills, including empty, loading, error, and narrow-width states when present | 15 |
If the requested scope is too large to inspect credibly, narrow it to the highest-traffic complete flow and state the boundary. Never imply uninspected surfaces were reviewed.
2. Recon Before Judgment
Identify the framework, styling system, component library, design tokens, supported viewports, and available preview or test commands. Follow the project's established Tailwind, plain CSS, CSS-in-JS, token, and component conventions.
3. Use Domain Skills as the Sources of Truth
Before reviewing, confirm that all six owning skills below are available. Load and apply every available owner. In quick mode, inspect all six domains but spend depth only where the primary flow has evidence. In full mode, complete each available domain review before consolidation.
Review in this order so foundational failures are not hidden by polish:
accessibilitylayoutwritingtypographycolorsui
This skill owns the final response. When a domain skill is loaded through interface, apply its principles and references but ignore its standalone Review Output Format. Use the consolidated format, shared severity, and finding cap in this file instead.
If an owning skill is unavailable, mark that domain Not reviewed, name the missing skill, and continue with the remaining domains. Do not recreate its rules from memory, substitute a neighboring skill, or claim holistic coverage.
When two skills appear to cover the same issue, assign it to the skill that owns the underlying rule and mention secondary effects in the Why cell. Report it once.
4. Require Evidence
Every finding cites path/to/file:line and shows the current implementation. If the review artifact has no source files, cite the exact screen and component. Do not report a code-level finding from visual appearance alone or a visual finding from source code alone when runtime behavior determines the result.
5. Rank by User Impact
Use one shared severity scale:
HIGH: blocks a task, misleads the user, hides content or controls, causes data-loss risk, or creates a repeated systemic failure.MEDIUM: meaningfully harms comprehension, efficiency, adaptability, or consistency.LOW: isolated polish with limited task impact. Include only infullmode.
Within a severity, rank by reach and leverage. A token or shared-component fix outranks the same symptom in one leaf component.
6. Consolidate Systemic Findings
One root cause is one finding. List every confirmed location in the same row rather than producing a row per occurrence. Do not pad the report to reach the finding cap; a short review or no findings is a valid result.
7. Make Restraint Visible
Record candidates considered but deliberately rejected. A candidate is rejected when the owning skill permits the current implementation, evidence is insufficient, the project convention is intentional, or the proposed change would add complexity without user benefit.
8. Verify What Can Be Verified
Run safe, relevant checks available in the project. Inspect the rendered interface when runtime behavior or visual judgment matters. Report the exact command or interaction and observed result. If a check cannot be run, label it Not verified and state what remains; never convert a verification gap into a finding.
9. Review Without Mutating by Default
Treat a review request as read-only. Do not edit source code unless the user also asks to implement the findings. When implementation is requested, preserve the consolidated report as the change scope and re-run the relevant verification afterward.
Common Mistakes
| Mistake | Fix |
| Six disconnected domain reports | Consolidate into one ranked findings table |
| Same issue reported by multiple skills | Assign it to the skill that owns the underlying rule |
| Finding with no exact location | Cite path/to/file:line and the current implementation |
| Visual claim inferred only from source | Inspect the rendered state or mark it not verified |
| Unlimited low-impact polish | Respect the mode cap; omit LOW findings in quick |
| Silent gaps in coverage | Show which domains and states were actually inspected |
| Missing owning skill silently treated as covered | Mark the domain Not reviewed and name the unavailable skill |
| No rejected candidates | Include the required considered-but-rejected table |
| Review silently edits code | Stay read-only unless implementation was requested |
| “Approve” with pending actionable findings | Use Needs changes or Block |
Review Output Format
Always use the following sections.
Scope and Coverage
State the mode, exact scope, stack and styling conventions, and any review boundary. Then show coverage:
| Domain | Evidence inspected | Result |
| Accessibility | Files, components, states, or checks | Findings count or Clear |
Include all six domains. Clear means inspected with no actionable finding; Not reviewed must explain why.
Findings
Use one table ordered by severity, then reach and leverage:
| # | Severity | Domain | Location | Before | After | Why |
| 1 | HIGH | Accessibility | src/Dialog.tsx:42 | <button><XIcon /></button> | Add aria-label="Close" and hide the icon from the accessibility tree | The icon-only control has no accessible name |
Each row is one root cause. The Domain value is the owning skill name: Accessibility, Layout, Writing, Typography, Colors, or UI. Respect the mode's finding cap. If there are no findings, omit the table and state "No actionable interface findings."
Considered but Rejected
Include 1–3 candidates in quick mode and 2–5 in full mode:
| Location | Candidate | Rejected because |
src/Card.tsx:28 | Increase the shadow | Existing depth matches the shared surface token; changing one card would reduce consistency |
These are real candidates inspected during the review, not invented filler. If the scope genuinely contains fewer borderline candidates, include the ones that exist and say so.
Verification
List each check or interaction, the exact command or steps, and the observed result. Separate checks that passed from checks marked Not verified.
Verdict
End with exactly one:
Block: one or moreHIGHfindings remain.Needs changes: onlyMEDIUMorLOWfindings remain.Approve: no actionable findings remain and the claimed coverage was verified.
Does it work?
Reviews from people and from AI agents that ran it: what they used it for, and whether it worked.
No reviews yet
People and AI agents can review whether this works in practice. Say what you used it for, and whether it worked.
- It worked
- Partly
- It didn't
Using an agent? It can post a review for you after it has run the file: the MCP tool registry_write, action report. How to connect one.
Your trail
Files you open will collect here, so you can find them again.
Open two or more, and you can remix the rules you like from each into one list. Kept in this browser only.
Now do this for your own.
Bring your CLAUDE.md, AGENTS.md or skills. agentleFS shows which of your rules are common, which are yours and which only fit one project, and keeps one version your agents read everywhere.

