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.

2.50x

Quality

70%

Does it follow best practices?

Impact

95%

2.50x

Average score across 3 eval scenarios

Securityby

Passed

No findings from the security scan

Fix and improve this skill with Tessl

tessl review fix ./plugins/all-skills/skills/artifacts-builder/SKILL.md

Quality

Content

57%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 is concise and well-structured with solid init/bundle commands, but its central development step is a dangling reference with no guidance, the bundling workflow lacks any validation checkpoint, and one bundle asset is orphaned. These gaps hold actionability, workflow clarity, and progressive disclosure to the midpoint.

Suggestions

Replace the missing 'Common Development Tasks' section referenced in Step 2 with concrete guidance (e.g., where to add components, how to wire routing/state, common shadcn/ui patterns) — or remove the dangling pointer.

Add a verification checkpoint after bundling (e.g., open bundle.html and confirm it renders, or run a quick build/validate command) so the build workflow has a validation step instead of treating testing as optional-only.

Reference scripts/shadcn-components.tar.gz from the body (explain when/why to use it) or remove it from the bundle so every bundle file is discoverable.

Dimension	Reasoning	Score
Conciseness	The body is efficient, assumes Claude knows React/Tailwind/Vite, and avoids explaining basics; it stops short of 5 because the top-level 5-step list (lines 10-15) duplicates the Quick Start sections, and the optional-testing note is slightly padded.	4 / 5
Actionability	Init and bundle steps give copy-paste commands ('bash scripts/init-artifact.sh <project-name>', 'bash scripts/bundle-artifact.sh'), but Step 2 — the core development step — only points to a 'Common Development Tasks' section that does not exist, leaving the central task without concrete guidance.	3 / 5
Workflow Clarity	A clear 5-step sequence is present, but there are no validation or verification checkpoints anywhere, and bundling is a batch/build operation; per the rubric cap, a batch workflow without validation cannot score above 3.	3 / 5
Progressive Disclosure	Sections are well-organized and lean, but navigation is not clean: the body references a 'Common Development Tasks' section that is absent, and the bundle asset 'shadcn-components.tar.gz' is never referenced from the body, leaving an orphan file and a broken pointer.	3 / 5
	Total	13 / 20 Passed

Description

82%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-scoped description that clearly states what the skill does and when to use it, with a sharp negative boundary that aids routing. Its only weakness is action variety — it describes one action ('creating') rather than enumerating several concrete operations.

Dimension	Reasoning	Score
Specificity	The description names the domain ('creating elaborate, multi-component claude.ai HTML artifacts') and the tech stack (React, Tailwind, shadcn/ui), but the only concrete action is 'creating' — it does not list several distinct actions, so it sits at the '1-2 concrete actions' anchor rather than 'several specific actions'.	3 / 5
Completeness	It explicitly answers both 'what' ('Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts...') and 'when' ('Use for complex artifacts requiring state management, routing, or shadcn/ui components'), with concrete trigger phrases and a negative boundary.	5 / 5
Trigger Term Quality	Phrases like 'claude.ai HTML artifacts', 'state management', 'routing', and 'shadcn/ui components' are natural terms users say when requesting complex artifacts, giving good coverage; it falls short of 5 because it lacks synonyms and file-extension variants (.html).	4 / 5
Distinctiveness Conflict Risk	The narrow niche (complex multi-component artifacts with state management/routing/shadcn) plus the explicit negative boundary ('not for simple single-file HTML/JSX artifacts') gives it a clear, distinct trigger set with minimal conflict risk.	5 / 5
	Total	17 / 20 Passed

Validation

93%

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 — 15 / 16 Passed

Validation for skill structure

Criteria	Description	Result
frontmatter_unknown_keys	Unknown frontmatter key(s) found; consider removing or moving to metadata	Warning

	Total	15 / 16 Passed

Repository: davepoon/buildwithclaude
Path: plugins/all-skills/skills/artifacts-builder/SKILL.md
Commit: a9fa86d

Reviewed: about 20 hours 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.