hermes-agent/optional-skills
Siddharth Balyan 9362ce2575
feat(skills): add html-artifact skill, fold in sketch + architecture-diagram + concept-diagrams (#48899)
* feat(skills): add html-artifact skill, fold in sketch + architecture-diagram + concept-diagrams

Adds a unified `html-artifact` creative skill that produces self-contained,
single-file HTML artifacts — concept explainers, implementation plans,
status/incident reports, code-review walkthroughs, technical + educational
SVG diagrams, multi-variant design comparisons, and throwaway editors that
export their state back to the clipboard. Grounded in Anthropic's
html-effectiveness gallery (MIT); the house style (token block, serif/sans/
mono split, hand-rolled diffs, inline-SVG diagrams, graceful degradation) is
distilled from reading all 20 reference files.

Supersedes and removes three overlapping skills, folding their unique value in:
- sketch              -> the fidelity dial (throwaway vs presentation) + the
                         multi-variant comparison layouts + the browser-vision
                         verify loop (references/fidelity-and-verify.md)
- architecture-diagram-> the dark "infra" token variant + double-rect masking +
                         semantic component palette (references/dark-tech.md,
                         templates/diagram.html infra mode)
- concept-diagrams    -> the 9-ramp educational color system + the concept
                         archetype library (references/concept-archetypes.md,
                         the light design system in templates/diagram.html)

Structure:
- SKILL.md (description exactly 60 chars), 6 references, 3 templates
- templates verified by headless-Chrome render + vision inspection
- editor export logic (file://-safe clipboard, Promise-normalized) verified in node

Cross-references updated in claude-design (new disambiguation table row drawing
the design-taste vs information-artifact boundary), design-md, pretext, spike,
and kanban-video-orchestrator. Website skill docs + catalogs regenerated;
stale EN/zh-Hans per-skill pages pruned and i18n cross-refs fixed.

Not folded (intentionally orthogonal): excalidraw (.excalidraw JSON), p5js
(generative canvas), claude-design / popular-web-designs / design-md (visual
design taste / brand vocab / token spec).

* feat(skills): ship html-effectiveness gallery as fetched reference examples

Add scripts/fetch-examples.sh (idempotent clone/pull of Anthropic's MIT
html-effectiveness gallery) + references/examples.md mapping each of the 20
example files to a mode so the agent reads the right worked example. The clone
lands in references/examples/ and is gitignored (it's a 384KB upstream repo,
not vendored). SKILL.md workflow + reference list now point at it; falls back to
the distilled pattern references when offline.

* feat(skills): make reading a gallery example a required authoring step

Reading the matching html-effectiveness example is now workflow step 2 (was an
optional aside in step 3): fetch the gallery, read_file the file for your mode,
mirror its structure. Models skip optional steps; the examples are the ground
truth, so consulting one is mandatory. Added an 'Example' column to the
mode->build quick-reference table and a 'don't skip the example' pitfall.

Also dogfooded the skill: read 03-code-review-pr.html and 13-flowchart-diagram.html
raw and reconciled the distilled references against source — aligned diff-row tint
opacity to the source's 0.15 (was 0.18) and added the .ctx/.hunk rows in
house-style.md + base.html so they match 03-code-review-pr.html verbatim.

* docs(skills): explain the consolidation + bundled-vs-optional rationale

The supersession note only stated *what* was folded, not *why* the prune is
sound. Expand SKILL.md's intro into a 'Why this skill exists' section: the three
former skills emitted the same artifact and overlapped, so consolidating removes
which-one-do-I-load ambiguity; and the optional->bundled promotion of
concept-diagrams is footprint-safe because this skill has zero deps (only cost is
the 60-char description; everything else is progressive-disclosure). States the
bundling dividing line explicitly: zero install cost + broadly useful gets
bundled, real install cost (hyperframes: Node+FFmpeg+Chromium) stays optional.

Regenerated website per-skill page to match.
2026-06-19 08:02:31 +00:00
..
autonomous-ai-agents fix(honcho): harden self-hosted setup paths 2026-05-29 22:29:48 -07:00
blockchain fix(skills): widen HERMES_HOME-aware .env resolution to all sibling skills 2026-06-10 15:10:11 -07:00
communication fix(skills): move platforms key out of folded description: > scalars 2026-05-08 14:27:40 -07:00
creative feat(skills): add html-artifact skill, fold in sketch + architecture-diagram + concept-diagrams (#48899) 2026-06-19 08:02:31 +00:00
devops fix(skills): widen HERMES_HOME-aware .env resolution to all sibling skills 2026-06-10 15:10:11 -07:00
dogfood feat(optional-skills): declare platforms frontmatter for all 63 undeclared skills 2026-05-08 14:27:40 -07:00
email/agentmail feat(optional-skills): declare platforms frontmatter for all 63 undeclared skills 2026-05-08 14:27:40 -07:00
finance chore: prune unused imports and duplicate import redefinitions 2026-05-28 22:26:25 -07:00
gaming refactor(skills): clean up bundled skill set + add environments: relevance gate (#39028) 2026-06-04 06:11:22 -07:00
health chore: prune unused imports and duplicate import redefinitions 2026-05-28 22:26:25 -07:00
mcp feat(optional-skills): declare platforms frontmatter for all 63 undeclared skills 2026-05-08 14:27:40 -07:00
migration docs(config): deprecate MESSAGING_CWD guidance 2026-05-29 12:06:22 -07:00
mlops chore(skills): move red-team skills (godmode, obliteratus) to optional-skills — Anthropic classifier (#43221) 2026-06-09 21:41:00 -07:00
payments Update Stripe Projects skill docs (#48673) 2026-06-19 04:43:15 +00:00
productivity chore(skills/shop): tighten description to ≤60 chars, credit contributor 2026-06-16 10:37:21 -07:00
research chore: prune unused imports and duplicate import redefinitions 2026-05-28 22:26:25 -07:00
security fix(skills): widen HERMES_HOME-aware .env resolution to all sibling skills 2026-06-10 15:10:11 -07:00
software-development fix(skills): widen HERMES_HOME-aware .env resolution to all sibling skills 2026-06-10 15:10:11 -07:00
web-development feat(optional-skills): declare platforms frontmatter for all 63 undeclared skills 2026-05-08 14:27:40 -07:00
DESCRIPTION.md fix: review fixes — path traversal guard, trust_style consistency, edge cases 2026-03-06 01:40:01 -08:00