CtrlK
BlogDocsLog inGet started
Tessl Logo

mockup-device-3d

Static iPhone and MacBook 3D-style showcase with real HTML embedded on screens, glass-lens refraction, and 360-degree turntable composition.

64

Quality

76%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

SecuritybySnyk

High

Do not use without reviewing

Fix and improve this skill with Tessl

tessl review fix ./skills/mockup-device-3d/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

87%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.

The body is lean, highly actionable, and well-structured for a single-file template spec, but it reads as a composition spec rather than a sequenced workflow with validation checkpoints, which limits workflow clarity.

Suggestions

Reframe the composition sections as an explicit ordered build sequence (1. canvas/background, 2. device frames, 3. screens, 4. glass/reflection, 5. optional flourishes).

Add a validation/check step, e.g. verify screen content scales to the viewport and that prefers-reduced-motion disables the turntable.

Add a final 'verify' checklist confirming no external image URLs were used and real user data fills the screens.

DimensionReasoningScore

Conciseness

The body is dense and directive with concrete specs (transforms, gradients, color codes) and no padding or explanations of concepts Claude already knows; every line earns its place.

5 / 5

Actionability

Provides fully executable CSS values such as 'rotateY(-12deg) rotateX(4deg) translateZ(40px)', '#a8a8ad', and 'border-radius 56px' that are copy-paste ready for generating the artifact.

5 / 5

Workflow Clarity

Content is organized by topic (composition, screen content, optional elements, design details) giving an implicit build order, but it is a spec rather than a sequenced workflow and lacks validation checkpoints.

3 / 5

Progressive Disclosure

A short single-file skill (~27 lines) with clear section headers and no need for external references, matching the simple-skill exception for a top progressive-disclosure score.

5 / 5

Total

18

/

20

Passed

Description

66%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.

The description is specific and distinctive, naming concrete visual capabilities, but it lacks an explicit 'Use when...' trigger clause, capping completeness. Adding trigger guidance would lift the weakest dimension.

Suggestions

Append an explicit trigger clause, e.g. 'Use when creating product launch visuals, app demo mockups, or device showcase posters.'

Add common natural synonyms such as 'mockup' or 'device showcase' to broaden trigger-term coverage.

Mention the output format/aspect (e.g. '1920×1080 poster') in the description so users know what they get.

DimensionReasoningScore

Specificity

Lists several concrete capabilities ('real HTML embedded on screens', 'glass-lens refraction', '360-degree turntable composition') rather than vague language, with minor gaps in coverage.

4 / 5

Completeness

The 'what' is clearly stated but there is no 'Use when...' clause or equivalent explicit trigger guidance, which per the rubric caps completeness at 3.

3 / 5

Trigger Term Quality

Includes natural terms a user would say ('iPhone', 'MacBook', '3D-style showcase', 'HTML') with good coverage, though common synonyms like 'mockup' or 'product display' are missing.

4 / 5

Distinctiveness Conflict Risk

The device-mockup showcase niche is mostly distinct with minimal conflict risk, though it could overlap with closely related product-display skills.

4 / 5

Total

15

/

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
nexu-io/open-design
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.