CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

artifacts-builder

Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui). Use for complex artifacts requiring state management, routing, or shadcn/ui components - not for simple single-file HTML/JSX artifacts.

1.25x
Quality

78%

Does it follow best practices?

Impact

78%

1.25x

Average score across 3 eval scenarios

SecuritybySnyk

—

The risk profile of this skill

Fix and improve this skill with Tessl

tessl review fix ./data/03-developer-artifactsbuilder/SKILL.md

The canonical home for this skill is artifacts-builder in majiayu000/claude-skill-registry

SKILL.md
Quality
Evals
Security

Quality

Content

63%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 skill lays out a clear, well-sequenced workflow with copy-paste commands for initialization and bundling, and it stays lean. Its main weaknesses are that the central development step lacks any concrete guidance because its promised 'Common Development Tasks' section is missing, and the two scripts it depends on are not present in the bundle, leaving the actionable core unbacked.

Suggestions

Add the missing 'Common Development Tasks' section (or a reference file) with concrete examples of editing the generated project — adding routes, state, and shadcn/ui components — since Step 2 currently defers to it and it does not exist.

Ship the referenced scripts/init-artifact.sh and scripts/bundle-artifact.sh in the bundle, or replace the invocations with the actual inline commands.

Trim the ✅ feature list and version pins ('Tailwind CSS 3.4.1', Vite auto-pinning) to what the user needs to decide, letting the scripts report their own output, and add a quick bundle verification hint (e.g., open bundle.html to confirm it loads).

DimensionReasoningScore

Conciseness

The body is command-first and free of concept-teaching, but minor padding can be trimmed — the ✅ feature list partially duplicates what the init script already reports, and version pins like 'Tailwind CSS 3.4.1' and 'Node 18+ compatibility (auto-detects and pins Vite version)' are time-sensitive details that will rot.

4 / 5

Actionability

Init and bundling steps are executable ('bash scripts/init-artifact.sh <project-name>', 'bash scripts/bundle-artifact.sh') with a stated requirement ('must have an index.html in the root directory'), but Step 2 — the core development work — is only 'edit the generated files' and defers to a 'Common Development Tasks' section that does not exist anywhere in the document, a missing key detail that fits anchor 3 rather than anchor 4's minor gaps.

3 / 5

Workflow Clarity

Five clearly sequenced, headed steps (init → develop → bundle → share → optional test) with explicit preconditions and a deliberate, justified testing policy; it misses anchor 5 because there is no explicit checkpoint validating that the bundle built correctly, but exceeds anchor 3 since sequencing and requirements are explicit and the operation is non-destructive.

4 / 5

Progressive Disclosure

Sections are well organized and references are one level deep, but scored against the actual bundle the references are broken: 'scripts/init-artifact.sh' and 'scripts/bundle-artifact.sh' are invoked yet no scripts directory ships with the skill, and the pointer to a 'Common Development Tasks' section below is a dangling internal reference, matching anchor 3's structure-with-organizational-gaps.

3 / 5

Total

14

/

20

Passed

Description

83%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: it states concrete capabilities with a specific tech stack, gives an explicit 'Use for...' trigger clause with concrete conditions, and adds a useful negative boundary that reduces mis-triggering. The only gaps are a few missing natural synonyms and slight overlap risk with generic frontend-development skills.

Suggestions

Add one or two natural synonyms users might say, such as 'interactive web app' or 'single-page app', to broaden trigger coverage.

Replace the slightly generic 'Suite of tools' opening with the concrete actions performed (initialize a React project, develop, bundle to a single HTML file).

DimensionReasoningScore

Specificity

The description names concrete capability areas — 'creating elaborate, multi-component claude.ai HTML artifacts' with 'state management, routing, or shadcn/ui components' and an exact stack — but 'Suite of tools' is slightly generic and it stops short of the multiple distinct actions anchor 5 requires, sitting above anchor 3's 1-2 concrete actions.

4 / 5

Completeness

It explicitly answers both what ('Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using... React, Tailwind CSS, shadcn/ui') and when ('Use for complex artifacts requiring state management, routing, or shadcn/ui components - not for simple single-file HTML/JSX artifacts'), with a concrete negative boundary, matching anchor 5.

5 / 5

Trigger Term Quality

Good natural-keyword coverage ('HTML artifacts', 'React', 'shadcn/ui components', 'state management') that users would plausibly say, but common synonyms like 'web app', 'interactive page', or 'landing page' are missing, so it falls short of anchor 5's comprehensive synonym coverage.

4 / 5

Distinctiveness Conflict Risk

The claude.ai-artifact framing plus the explicit exclusion of simple artifacts carves a clear niche, but bare React/Tailwind/shadcn requests could still pull this skill ahead of general frontend skills, matching anchor 4's minor overlap risk with closely related skills.

4 / 5

Total

17

/

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.

Validation — 15 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

referenced_paths_exist

Referenced path issues: 4 missing

Warning

Total

15

/

16

Passed

Repository

majiayu000/claude-skill-registry-data

Path

data/03-developer-artifactsbuilder/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.