CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

design-taste-frontend

tasteskill v2, the anti-slop frontend skill. Art direction for websites, distilled from a study of 247 curated gallery sites (One Page Love, Awwwards Sites of the Day). Deals researched directions (idea, composition, type, palette, photographs, section blueprints) from a library, enforces a strict no-slop house style with a real-browser inspector, and runs a look-and-fix loop on screenshots. Use this whenever you build, design, redesign, restyle, polish or review a landing page, marketing site, portfolio, product page, one-pager, hero or any public-facing web page, in any stack (HTML/CSS, React, Next.js, Vue, Svelte, Astro, Tailwind) — also when the user says a page looks generic, templated, "AI-made", sloppy, or asks to make it look designed, premium, award-level or less like every other site. Also for app screens: dashboards, admin and analytics views, settings, inboxes and other screens people work in, with their own run and rules.

Quality

88%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide
SecuritybySnyk

Low

Low-risk findings worth noting

SKILL.md
Quality
Evals
Security

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.

An unusually actionable, well-sequenced procedural skill: every step carries executable commands, numeric thresholds, explicit validation gates, and bounded feedback loops. Its weaknesses are stylistic verbosity in the narrative passages and — more seriously — two referenced bundle paths (`library/` and the per-scene `assets/scenes/` files with demos) that are documented in the body and Files table but absent from the actual bundle, making step 6 unexecutable as shipped.

Suggestions

Ship the missing bundle paths or remove them from the documentation: either include `library/` and the per-scene `assets/scenes/<id>.js`, `<id>.css`, and `demo/<id>.html` files, or drop the `library/` and scene-file rows from the Files table and rewrite step 6 to obtain scene files another way (progressive_disclosure).

Tighten the narrative passages — the opening manifesto ("Nothing in it is wrong and nothing in it was decided"), "One warning learned in testing", and "Why these, honestly" — into single-line rationales attached to the rules they justify, keeping the instruction and dropping the storytelling (conciseness).

Consolidate guidance that currently appears in both the run steps and the Files table (e.g., scene building in step 6 vs. the `scenes.md` and `assets/scenes/` rows) so each fact is stated once and cross-referenced (conciseness).

DimensionReasoningScore

Conciseness

The 528-line body is dense with genuinely non-generic substance (study numbers, concrete house rules, command flags), but multiple narrative passages — "Nothing in it is wrong and nothing in it was decided", "One warning learned in testing", "Why these, honestly" — are rhetorical padding that could be tightened to instruction without loss. It sits between anchor 4's "minor instances" and anchor 2's "several padded sections": several sections could be trimmed, not just minor spots, yet almost every paragraph carries load-bearing guidance, so 3 fits best.

3 / 5

Actionability

Commands are copy-paste ready with the `<skill>` convention explained up front (`draw.mjs --sector <sector> --brief ... --options 3`, `lint.mjs`, `inspect.mjs`, `scenes.mjs`, `assets.mjs --get <ref>`), and the body is saturated with executable specifics (1440/768/390 viewports, 120–240px section gaps, ~32-char headline arithmetic, eight moving elements, `--redraw section:<role>=<id>`). This matches anchor 5: fully executable commands covering the common cases.

5 / 5

Workflow Clarity

A numbered 10-step run with an explicit validation gate ("Fix every `FAIL`... Re-run until there are no `FAIL`s"), a look-and-fix feedback loop bounded at three rounds, production-build inspection, and a report checklist gated on verified conditions. This matches anchor 5: clear sequence, explicit validation, feedback loops for error recovery, and a checklist.

5 / 5

Progressive Disclosure

Signaling is excellent — a Files table with a "Read it when" column, one-level-deep references, and inline pointers like "Read `references/app-screens.md` whole before you start" — and all 11 references/*.md, all scripts, and base assets exist. However, scored against the actual bundle: the Files table and step 6 reference `library/` ("The data the draw reads") and per-scene `assets/scenes/<id>.js|.css` plus `demo/<id>.html`, none of which exist in the bundle (`assets/scenes/` holds only `stage.css`/`stage.js`, and `draw.mjs` would fail to load `../library`), leaving two documented paths broken. That is more than anchor 4's "minor organization gaps", while the structure itself is far better than anchor 3's poorly-signaled references, so 3 with the breakage as the deciding factor.

3 / 5

Total

16

/

20

Passed

Description

96%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 description: concrete capabilities, an explicit "Use this whenever..." clause with concrete user-side trigger phrasings, and near-exhaustive natural keyword coverage including stack names and app-screen vocabulary. Its only weakness is breadth — "any public-facing web page, in any stack" plus dashboard triggers create minor overlap risk with general frontend and charting skills.

DimensionReasoningScore

Specificity

"Deals researched directions (idea, composition, type, palette, photographs, section blueprints) from a library, enforces a strict no-slop house style with a real-browser inspector, and runs a look-and-fix loop on screenshots" lists multiple specific concrete actions, grounded in a named study, with coverage across page design, redesign, restyle, review, and app screens. This matches anchor 5's comprehensive coverage; anchor 4 would require a noticeable capability gap, and none is present.

5 / 5

Completeness

The "what" is explicit (art direction for websites: deals directions, enforces a house style with an inspector, runs a look-and-fix loop) and the "when" is explicit and concrete: "Use this whenever you build... — also when the user says a page looks generic, templated, 'AI-made'... Also for app screens: dashboards...". Both are answered with concrete trigger phrases, matching the anchor-5 example exactly in structure.

5 / 5

Trigger Term Quality

"Build, design, redesign, restyle, polish or review a landing page, marketing site, portfolio, product page, one-pager, hero", named stacks (React, Next.js, Vue, Svelte, Astro, Tailwind), user phrasings ("generic, templated, 'AI-made', sloppy") and outcome asks ("premium, award-level") plus "dashboards, admin and analytics views, settings, inboxes" give comprehensive natural-term coverage including synonyms. A user needing this skill would say almost exactly these words, matching anchor 5.

5 / 5

Distinctiveness Conflict Risk

The anti-slop art-direction niche is clear and most triggers are distinct, but "whenever you build... any public-facing web page, in any stack" is very broad, and the app-screen triggers ("dashboards, admin and analytics views") overlap with data-visualization/charting skills. This fits anchor 4 — mostly distinct with minor overlap risk against closely related skills — rather than anchor 5's minimal conflict risk.

4 / 5

Total

19

/

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.

Validation — 14 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

skill_md_line_count

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

Warning

referenced_paths_exist

Referenced path issues: 1 missing, 1 deeper-than-1-level

Warning

Total

14

/

16

Passed

Repository

Leonxlnx/taste-skill

Path

skills/taste-skill/SKILL.md

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.