CtrlK
BlogDocsLog inGet started
Tessl Logo

macos-design

Design and build native-feeling macOS application UIs. Use this skill whenever the user asks to create a desktop app, macOS app, Mac-style interface, Apple-style UI, system utility, or anything that should look and feel like a native Mac application. Also trigger when users mention "native feel", "desktop app design", "Apple design patterns", "sidebar layout", "traffic lights", or want to build tools/utilities that feel like they belong on macOS. This skill covers layout, composition, interaction patterns, animations, light/dark mode, and all the subtle details that make an app feel like Apple built it.

72

Quality

90%

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

SKILL.md
Quality
Evals
Security

Quality

Content

80%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 well-structured, actionable skill body: concrete implementation specifics, a useful pre-flight checklist, and clean one-level-deep references that are all real files. The main gap is the absence of any executable window-chrome code block and any explicit validation/verify checkpoint in the build workflow.

Suggestions

Add one copy-paste-ready code block for the macOS window chrome (title bar, traffic-light dots, rounded corners) so actionability reaches fully executable coverage.

Insert an explicit verify/validate checkpoint in the workflow (e.g., 'Preview in both light and dark mode; confirm traffic lights, drag zone, and shortcuts before finishing').

Trim the 'Core Philosophy' opener ('A native app is not a destination...') or fold it into the checklist to tighten token efficiency.

DimensionReasoningScore

Conciseness

Lean body that assumes Claude's competence — concrete font stacks, pixel radii, and a tight checklist rather than explaining what macOS or vibrancy is. A few phrases ('not websites crammed into a window', Core Philosophy paragraph) are slightly editorial but not padded; not a 5 only because the opening philosophy line could be trimmed.

4 / 5

Actionability

Provides concrete, executable specifics: font stack `-apple-system, BlinkMacSystemFont, "SF Pro Display"...`, `backdrop-filter: blur()`, exact radii (10px/8px/6px/4px), `prefers-color-scheme`. Not a 5 because there is no actual code block for the window chrome and the Electron/Tauri section is high-level guidance rather than copy-paste commands.

4 / 5

Workflow Clarity

The 10-item Quick-Start Checklist is a clear pre-flight sequence with concrete checkpoints (drag zone ~50px, every primary action needs a shortcut). The 'Before You Code' section sequences reference-reading by need. Not a 5 because it lacks an explicit validate/verify step and the build workflow has no error-recovery feedback loop.

4 / 5

Progressive Disclosure

Clear overview with well-signaled one-level-deep references mapped to need ('All macOS apps → references/layout-and-composition.md (required)'; interaction-patterns.md; visual-design.md). All three referenced paths are real files in ./references/, and the SKILL.md body itself stays an overview rather than inlining their content.

5 / 5

Total

17

/

20

Passed

Description

100%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, well-formed description: concrete capabilities, comprehensive natural trigger terms, explicit what-and-when clauses, and a distinct niche. Minor note: it leans slightly long/keyword-dense, but verbosity is not penalized for descriptions and every clause earns its place.

DimensionReasoningScore

Specificity

Lists multiple concrete actions and coverage areas — 'Design and build native-feeling macOS application UIs', 'layout, composition, interaction patterns, animations, light/dark mode' — giving comprehensive, non-abstract capability coverage.

5 / 5

Completeness

Explicitly answers both 'what' ('Design and build native-feeling macOS application UIs', 'covers layout, composition, interaction patterns, animations, light/dark mode') and 'when' with two explicit 'Use when...' / 'Also trigger when...' trigger clauses.

5 / 5

Trigger Term Quality

Comprehensive natural terms including synonyms and near-synonyms users actually say: 'desktop app', 'macOS app', 'Mac-style interface', 'Apple-style UI', 'native feel', 'traffic lights', 'sidebar layout', covering the full natural vocabulary.

5 / 5

Distinctiveness Conflict Risk

Clear niche — native macOS desktop UI design — with highly specific triggers ('traffic lights', 'sidebar layout', 'native feel') that are unlikely to conflict with other skills.

5 / 5

Total

20

/

20

Passed

Validation

93%

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

Validation15 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

frontmatter_unknown_keys

Unknown frontmatter key(s) found; consider removing or moving to metadata

Warning

Total

15

/

16

Passed

Repository
davepoon/buildwithclaude
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.