Skip to content

About

Claude Code plugin: client brief to research, moodboard and website prototypes in one working day.

Topics

Resources

Stars

0 stars

Watchers

0 watching

Forks

Latest commit

 

History

3 Commits

Folders and files

Repository files navigation

ELT Design

Client brief in the morning, clickable website prototypes by evening.

A Claude Code plugin · Install · Hub from a real run

A run: brief, intake, checkpoint 1 where the operator decides, research, moodboard, checkpoint 2 where the operator decides, variants, hub.

2 h 31 min 78 2
from intake to three deployed variants and a hub measured reference sections on one moodboard checkpoints where a person decides

From two runs: a sign company in Los Angeles on 24 Sep 2026, and my own portfolio site on 1 Oct 2026. Each run log records when every phase started and ended.

Install

/plugin marketplace add prodelt/elt-design
/plugin install elt-design@prodelt

Open Claude Code in the client's folder and run /elt-design:elt-design. It starts a run or continues the open one. Add status to see where the run is, or polish for one round of changes after the client has seen the hub. Everything the plugin writes goes into elt-design/ in that folder, and the client's own files stay untouched.

Link the skill folder instead (development)
# Windows (PowerShell)
New-Item -ItemType Junction -Path "$HOME\.claude\skills\elt-design" -Target "<clone>\skills\elt-design"
# macOS, Linux
ln -s "<clone>/skills/elt-design" ~/.claude/skills/elt-design

A linked skill answers to /elt-design.

What you get

Research dossier: the brief on the left, findings about competitors with a decision under each.
A research dossier: what competitors show and what they skip, with a decision for each finding.
Moodboard section with three palettes, each with measured hex values and the site it came from.
A moodboard of real sections from reference sites, with measured colours, type and sizes.
Home page of a prototype: name, one line about the work, two entry buttons, three numbers.
Three to five site variants, each built from the code of its references.
Hub page with tabs for variants, dossier, moodboard and compare.
A hub page that presents the variants, the dossier and the moodboard to the client.

Frames from the run for my own portfolio site on 1 October 2026. A second mode, Creative Set, makes stories, posts and carousels on a Figma canvas that both Claude and a person can edit.

How a run goes
  1. Start: sp env checks Node and Chrome, and the run gets its folder.
  2. Intake: the brief, the client's rules and files. At checkpoint 1 the operator confirms the brief.
  3. Research: agents study competitors and reference sites in parallel.
  4. Moodboard: cards with measurements and a draft recipe for each variant. At checkpoint 2 the operator approves, changes or replaces the recipes.
  5. Variants: one agent per recipe builds a site.
  6. Review, then 6. the hub the client sees.
  7. Retro: the run log with the time each phase took.

The toolkit keeps the next phase closed until the checkpoint file holds the operator's own words, and it copies those words into every later agent's assignment.

Status

v1 is in progress. Runs, checkpoints and agent assignments work; most phase instructions are still being written, so the runs so far were driven by hand along the same phases.

Requirements

Claude Code, Node.js 20 or newer, Google Chrome, and the grilling skill from mattpocock/skills.

Development

sp is the Node toolkit the skill drives: node skills/elt-design/toolkit/sp.mjs --help lists its commands. Tests: npm test in skills/elt-design/toolkit/.

License

MIT

About

Claude Code plugin: client brief to research, moodboard and website prototypes in one working day.

Topics

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages