Claude Design — Design one-off HTML artifacts (landing, deck, prototype)
Claude Design — Design one-off HTML artifacts (landing, deck, prototype)
Finding
Denne side er vigtig, fordi den giver Hermes en native måde at producere verificerbare, lokale designartefakter uden at bygge et separat designflow i n8n eller LangGraph.
What it is
Claude Design er en bundled Hermes-skill til at lave one-off HTML-artefakter som landing pages, klikbare prototyper, slide decks, UI-labs og motion studies. Den er tilpasset CLI/API-miljøer, så output normalt er en lokal HTML-fil med indlejret CSS/JS og konkret verifikation. Siden forklarer også, hvornår man skal kombinere den med `popular-web-designs` for kendte visuelle stilarter eller `design-md` for formelle designsystem-tokens.
Should we use it?
Use now. Den passer direkte ind i Lisa’s Hermes+n8n+LangGraph mission, fordi Hermes bør eje agentisk designarbejde, kontekstlæsning, skills og lokal verifikation. n8n bør ikke bruges til at “designe” sider, men kan senere distribuere eller trigge artefakter; LangGraph er kun relevant, hvis designopgaven bliver en stateful multi-agent proces. Skillen er især nyttig til hurtige, konkrete UI-beslutninger før noget bliver produktionskode.
Recommendation
Brug `claude-design` som standard-skill, når Lisa skal have et konkret visuelt HTML-artefakt til beslutning, demo eller prototype; brug `design-md` i stedet, hvis outputtet skal være et varigt designsystem, og brug `popular-web-designs` sammen med den, hvis der ønskes en kendt stilretning.
Use now
- Hurtige landing page-udkast til Hermes Agent Info eller nye offentlige forklaringssider.
- Klikbare prototyper af CoS-, dashboard-, approval- eller Telegram-baserede flows.
- HTML slide decks til at forklare Hermes+n8n+LangGraph-arkitektur for kunder eller samarbejdspartnere.
- UI-variantboards med konservativ, strong-fit og divergent retning, før der bygges i rigtig kode.
- Lokale designartefakter, hvor filen skal kunne åbnes direkte i browser og verificeres.
Do not use / wait
- Brug den ikke til varige designsystem-specifikationer; brug `design-md` til tokens og DESIGN.md.
- Brug den ikke som erstatning for produktionkode i et eksisterende repo, hvis opgaven kræver rigtig stack-integration.
- Brug den ikke til at klone en proprietær UI eller et brand, Lisa ikke har rettigheder til.
- Vent med browser-/screenshot-verifikation, hvis miljøet mangler browserværktøjer; rapportér da kun fil- og syntax-verifikation.
- Brug den ikke til generiske SaaS-sider uden konkret indhold, brandkontekst eller beslutningsformål.
Public page note
Claude Design gør Hermes velegnet til at skabe lokale, verificerbare HTML-prototyper og decks uden at flytte designansvaret ud i eksterne automationslag.