open-design-landing

Produce a world-class single-page editorial landing site in the Atelier Zero visual language (Monocle / Apartamento / Études editorial collage) — the same aesthetic OpenDesign uses for its own marketing surface. The agent fills a typed `inputs.json` from a brand brief, optionally generates 16 collage assets via gpt-image-2, then runs a pure-function composer that emits a self-contained HTML file. Drop-in scroll-reveal motion and a Headroom-style sticky nav are wired automatically.

Quality

73%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

Securityby

Passed

No findings from the security scan

Fix and improve this skill with Tessl

tessl review fix ./design-templates/open-design-landing/SKILL.md

Quality

Content

77%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-engineered skill body: the workflow is clearly sequenced with strong explicit validation, commands are concrete and copy-paste ready, and tone stays tight. Its main defects are a broken reference chain — several files the body treats as single sources of truth (schema.ts, styles.css, inputs.example.json, README.md, example.html) are missing from the bundle — and minor undefined placeholders like `<out>`.

Suggestions

Fix the progressive-disclosure chain: either ship the referenced files (`schema.ts`, `styles.css`, `inputs.example.json`, `README.md`, `example.html`) or update the body and the "Files in this skill" tree so every reference points at a file that actually exists.

Define `<out>` once (e.g., "`<out>` is the user's chosen output directory; default `./dist`") so the three CLI examples are fully executable as written.

Trim the ASCII pipeline diagram and the "What you get" section that duplicates the frontmatter's inputs/outputs, keeping only what the agent needs at execution time.

Dimension	Reasoning	Score
Conciseness	The body is dense and purposeful — tables for question groups and image strategies, exact CLI invocations, and a checklist — with no explanation of concepts Claude already knows. Minor over-length remains: the ASCII pipeline diagram, the "What you get" bullet list that restates the frontmatter inputs, and the promotional provenance line ("the very page you see at open-design") could be trimmed, placing it at the 4 anchor rather than the lean 5.	4 / 5
Actionability	Guidance is mostly executable: copy-paste commands for all three image strategies (`npx tsx scripts/placeholder.ts <out>/assets/`, `FAL_KEY=... npx tsx scripts/imagegen.ts <inputs.json> --out=<out>/assets/`, `npx tsx scripts/compose.ts <inputs.json> <out>/index.html`), a field-by-field question table, and a pointer to a worked example. It falls short of the 5 anchor because `<out>` is never defined, "AskQuestion (or the equivalent in your UI)" is environment-dependent, and the typed shape relies on `schema.ts`, which is not present in the bundle.	4 / 5
Workflow Clarity	The four-step workflow contract is explicitly sequenced ("complete each step before moving on"), each step has a decision table or command, and the "Self-check before delivering" section provides an eight-item explicit validation checklist (console errors, 404s, font rendering, reveal animation, responsive breakpoints, reduced-motion, Lighthouse) — matching the 5 anchor's clear sequence with validation steps and a checklist, plus a built-in fallback (print prompts without FAL_KEY) for error recovery.	5 / 5
Progressive Disclosure	Section structure is good (workflow contract, boundaries, see-also) and the "Files in this skill" tree aids navigation, but the disclosure chain is broken: the body's core references — `./schema.ts` ("single source of truth" for the typed shape), `./styles.css`, `./inputs.example.json` (the worked example), `./README.md`, and `./example.html` — do not exist in the bundle (verified against the actual directory listing, which contains only SKILL.md, the three scripts, and assets). Pointing at absent files is worse than the 4 anchor's 'minor organization gaps'.	3 / 5
	Total	16 / 20 Passed

Description

58%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 richly specific description that clearly conveys a distinctive design-system capability, weakened by marketing fluff ("world-class"), missing common trigger synonyms inside the description text, and the absence of any 'Use when...' clause. The detailed capability list earns high specificity, but completeness is capped by the missing explicit trigger guidance.

Suggestions

Append a 'Use when...' clause to the description itself (e.g., "Use when the user asks for a landing page, editorial site, one-pager, or marketing page") so the trigger guidance travels with the description instead of living only in the separate triggers field.

Trim promotional padding like "world-class" and the OpenDesign provenance sentence, and add natural synonyms users would say ("landing page", "one-pager", "homepage", "marketing site") to raise trigger-term quality.

State the interaction model in the description ("collects a brand brief from the user via focused questions") so the capability coverage includes the input-gathering step.

Dimension	Reasoning	Score
Specificity	The description names several concrete actions — "fills a typed `inputs.json` from a brand brief", "optionally generates 16 collage assets via gpt-image-2", "runs a pure-function composer that emits a self-contained HTML file", plus wired scroll-reveal and sticky nav — which is close to the comprehensive coverage of the 5 anchor, but "world-class" and the OpenDesign provenance sentence are promotional padding rather than capabilities, and the input-gathering step is absent, leaving minor gaps.	4 / 5
Completeness	The "what" is clear and detailed (fill inputs.json, optional image generation, compose a self-contained HTML file), but the description text contains no "Use when..." clause or equivalent explicit trigger guidance — the cap at 3 applies. It sits at the 3 anchor ('clear what, when missing or only weakly implied'), not 4, because the 'when' lives entirely in the separate triggers field rather than in the description.	3 / 5
Trigger Term Quality	Natural phrases present include "single-page editorial landing site" and "editorial collage", but common user variations like "landing page", "one-pager", "marketing page", "homepage", or "website" do not appear in the description text itself, matching the 'some relevant keywords but missing common variations' anchor; the separate frontmatter triggers list covers these but is not part of the description field.	3 / 5
Distinctiveness Conflict Risk	Distinctive markers — "Atelier Zero visual language", "Monocle / Apartamento / Études editorial collage", "16 collage assets", "OpenDesign" — carve a clear niche, but a generic request for a "landing page" or "marketing site" could plausibly match sibling web-page or deck skills, so minor overlap risk remains rather than the 5 anchor's minimal conflict.	4 / 5
	Total	14 / 20 Passed

Validation

87%

Warnings & errors only

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

Validation — 14 / 16 Passed

Validation for skill structure

Criteria	Description	Result
frontmatter_unknown_keys	Unknown frontmatter key(s) found; consider removing or moving to metadata	Warning
relative_links	Relative link issues: 2 missing, 3 suspicious	Warning

	Total	14 / 16 Passed

Repository: nexu-io/open-design
Path: design-templates/open-design-landing/SKILL.md
Commit: 53231d4

Reviewed: 3 days ago

Table of Contents

Discovery Implementation Validation

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.