CtrlK
BlogDocsLog inGet started
Tessl Logo

laws-of-ux

Review and guide UI implementations using the 21 Laws of UX. Identifies usability issues in HTML, CSS, and JavaScript by applying established cognitive, visual, and behavioral principles. Use when reviewing UI code, building new interfaces, or auditing user experience.

64

Quality

77%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

SecuritybySnyk

Passed

No findings from the security scan

Fix and improve this skill with Tessl

tessl review fix ./skills/laws-of-ux/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

71%Weight 40%Scale 1-5

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

A highly actionable, well-organized reference with concrete code examples and precise review heuristics across all 21 laws. Its weaknesses are verbosity from restating well-known law definitions and a monolithic structure with no progressive disclosure into separate reference files.

Suggestions

Trim or collapse the 'Definition' fields for widely-known laws (Miller's, Hick's, Fitts's, Jakob's, Occam's Razor) to one phrase, since Claude already knows them; keep the full definitions only for the more niche laws.

Split the per-law detailed GOOD/BAD examples and review flags into one-level-deep reference files (e.g. references/cognitive-laws.md, references/visual-laws.md, references/behavioral-laws.md) and make SKILL.md an overview + Review Checklist that links to them, improving progressive disclosure and token efficiency.

Add an explicit numbered review workflow (1. scan the checklist, 2. identify relevant laws, 3. inspect code per law, 4. group findings via Cross-Cutting Concerns, 5. report) so the process is sequenced rather than implied.

DimensionReasoningScore

Conciseness

The body is well-structured but ~970 lines and restates definitions of well-known laws (Miller's, Hick's, Fitts's, Jakob's, Occam's Razor) that Claude already knows; the 'Definition' + 'Key Takeaway' fields for obvious laws could be trimmed, though the GOOD/BAD examples and review flags earn their place.

3 / 5

Actionability

Every law provides concrete 'What to look for in code' bullets, copy-paste-ready GOOD/BAD HTML/CSS examples, and specific review flags with numeric thresholds (e.g., '>7 top-level nav items', '44x44px targets', '>10 ungrouped <select> options').

5 / 5

Workflow Clarity

Clear usage sequence ('check the Review Checklist first... then refer to the detailed sections') plus the Review/Guidance mode distinction and Cross-Cutting Concerns grouping guidance; minor gaps in that there is no explicit numbered review-process workflow.

4 / 5

Progressive Disclosure

Internal structure is solid (clear headers, a scannable checklist table, per-law subsections, cross-cutting grouping), but the file is monolithic with no bundle files and no overview-to-reference navigation; the detailed per-law GOOD/BAD examples that could live in separate reference files are all inlined in SKILL.md.

3 / 5

Total

15

/

20

Passed

Description

83%Weight 40%Scale 1-5

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

A strong, third-person description that explicitly covers both what the skill does and when to use it, with concrete trigger phrases and a clear UX-review niche. The main weakness is that the named actions are slightly abstract and a few natural synonyms are missing.

Suggestions

Tighten specificity by naming more granular actions (e.g., 'flag accessibility and usability violations, suggest concrete fixes, score against the 21 laws') rather than the abstract 'Review and guide'.

Add a couple of natural synonyms users might say ('frontend review', 'design review', 'web UI review') to broaden trigger coverage.

DimensionReasoningScore

Specificity

Names the domain (UI/UX, HTML/CSS/JavaScript) and several concrete actions ('Review and guide UI implementations', 'Identifies usability issues', 'applying established...principles'), but the actions are somewhat abstract compared to a fully granular list, leaving minor coverage gaps.

4 / 5

Completeness

Clearly answers both 'what' ('Review and guide UI implementations...Identifies usability issues...') and 'when' ('Use when reviewing UI code, building new interfaces, or auditing user experience') with concrete trigger phrases.

5 / 5

Trigger Term Quality

Good natural-term coverage (UX, UI, user experience, usability, Laws of UX, audit, interfaces, HTML/CSS/JS) including some synonym pairs, but a few natural synonyms (frontend, web design, design review) are missing and file extensions are N/A for this domain.

4 / 5

Distinctiveness Conflict Risk

The '21 Laws of UX' framing is a clear niche with distinct triggers, but it has minor overlap risk with general frontend code-review or accessibility skills.

4 / 5

Total

17

/

20

Passed

Validation

87%

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation14 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

skill_md_line_count

SKILL.md is long (980 lines); consider splitting into references/ and linking

Warning

metadata_version

'metadata.version' is missing

Warning

Total

14

/

16

Passed

Repository
RoleModel/rolemodel-skills
Reviewed

Table of Contents

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.