adapt
Adapt designs to work across different screen sizes, devices, contexts, or platforms. Implements breakpoints, fluid layouts, and touch targets. Use when the user mentions responsive design, mobile layouts, breakpoints, viewport adaptation, or cross-device compatibility.
73
67%
Does it follow best practices?
Impact
Pending
No eval scenarios have been run
Passed
No known issues
Optimize this skill with Tessl
npx tessl skill review --optimize ./source/skills/adapt/SKILL.mdQuality
Discovery
100%Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.
This is a well-crafted skill description that clearly communicates specific capabilities (breakpoints, fluid layouts, touch targets), uses third-person voice correctly, and includes an explicit 'Use when...' clause with natural trigger terms. It covers the responsive design domain comprehensively and distinctively with minimal risk of conflicting with other skills.
| Dimension | Reasoning | Score |
|---|---|---|
Specificity | Lists multiple specific concrete actions: 'Adapt designs to work across different screen sizes, devices, contexts, or platforms', 'Implements breakpoints, fluid layouts, and touch targets' — these are concrete, actionable capabilities. | 3 / 3 |
Completeness | Clearly answers both 'what' (adapt designs across screen sizes, implement breakpoints/fluid layouts/touch targets) and 'when' with an explicit 'Use when...' clause listing specific trigger scenarios. | 3 / 3 |
Trigger Term Quality | Includes strong natural keywords users would say: 'responsive design', 'mobile layouts', 'breakpoints', 'viewport adaptation', 'cross-device compatibility'. These cover common variations of how users would phrase requests in this domain. | 3 / 3 |
Distinctiveness Conflict Risk | Clearly occupies a distinct niche around responsive/adaptive design with specific triggers like 'breakpoints', 'viewport adaptation', and 'cross-device compatibility' that are unlikely to conflict with other skills. | 3 / 3 |
Total | 12 / 12 Passed |
Implementation
35%Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.
This skill reads more like a comprehensive responsive design textbook than a targeted skill file for Claude. It contains extensive general knowledge about responsive design that Claude already possesses, resulting in poor token efficiency. While the structure follows a logical sequence and includes some specific values, the lack of executable code examples and the monolithic presentation of all adaptation strategies inline significantly reduce its effectiveness.
Suggestions
Drastically reduce content by removing general responsive design knowledge Claude already knows (CSS Grid, media queries, touch targets, etc.) and focus only on project-specific conventions, preferred breakpoints, or non-obvious patterns.
Add executable code examples for key techniques (e.g., a responsive breakpoint mixin, a container query pattern, a responsive navigation component) instead of just listing technique names.
Split platform-specific adaptation strategies (mobile, tablet, desktop, print, email) into separate reference files and keep SKILL.md as a concise overview with links.
Add concrete validation steps in the Verify section, such as specific commands for running lighthouse audits, browser testing tools, or a checklist format with pass/fail criteria.
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | The skill is extremely verbose with extensive lists of obvious design knowledge that Claude already knows (touch targets, CSS Grid, media queries, responsive breakpoints, etc.). Much of this reads like a textbook on responsive design rather than novel, project-specific guidance. The print and email adaptation sections add significant length for niche cases. | 1 / 3 |
Actionability | The skill provides specific values (44x44px touch targets, 600px email width, breakpoint ranges) and names concrete techniques (CSS Grid, container queries, clamp()), but lacks any executable code examples. Everything remains at the descriptive/instructional level without copy-paste ready implementations. | 2 / 3 |
Workflow Clarity | There is a clear high-level sequence (Assess → Plan → Implement → Verify), but the verification step is just a checklist of things to test with no concrete validation commands or feedback loops. For a multi-step design adaptation process, there are no explicit checkpoints or error recovery steps between phases. | 2 / 3 |
Progressive Disclosure | The skill references an external command (frontend-design, teach-impeccable) which is good, but the body itself is a monolithic wall of content covering mobile, tablet, desktop, print, and email adaptations all inline. These platform-specific strategies could be split into separate reference files with the SKILL.md serving as a concise overview. | 2 / 3 |
Total | 7 / 12 Passed |
Validation
90%Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.
Validation — 10 / 11 Passed
Validation for skill structure
| Criteria | Description | Result |
|---|---|---|
frontmatter_unknown_keys | Unknown frontmatter key(s) found; consider removing or moving to metadata | Warning |
Total | 10 / 11 Passed | |
- Repository
- pbakaus/impeccable
- Commit
3a4fc70
- 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.