How to use the Loft Design Prototyper agent skill

What the loft skill makes the agent do

Loft is for design questions that talking cannot settle, such as two plausible state models or two different page layouts. Instead of arguing further, the agent builds a runnable artifact that you react to, and your reaction becomes the decision.

There are two forks. The logic fork is for questions about state, business rules, data shape or algorithms: the agent isolates the core logic as a pure module with no DOM, I/O or framework, and wraps it in one clickable HTML shell. The UI fork is for questions of shape and arrangement: the agent builds one route with three variants that differ in structure, such as information architecture, navigation model or density, with a switcher to cycle between them.

• The prototype is kept on a separate loft/<name> branch and never merged into main.
• It has no persistence, tests, abstractions or error handling beyond the happy path, on purpose.
• Confirmed logic modules re-enter the real codebase as normal work; UI variants are not copied, the real page is built fresh from the decision.

Install the loft skill

Download the ZIP for the loft skill from this page. The skill is a single file, SKILL.md. There are two ways to install it.

Option one is a personal install for Claude Code: unzip the download into ~/.claude/skills/ so the agent can use it in any project. Option two is a project install: unzip it into the .claude/skills/ folder of a specific repository, so it applies only there.

Option three is for the Claude apps: upload the skill under Settings → Capabilities → Skills.

• Personal: ~/.claude/skills/
• Project: .claude/skills/ inside your repository
• Claude apps: Settings → Capabilities → Skills

Trigger the skill with natural requests

You do not need a special command. The skill's description says to use it when a design question stalls in words, when a navigator map carries a loft ticket, or when a spec discussion reaches "we would have to see it". So you can ask in plain language that describes the stuck decision.

Be specific about the question. Name the thing being decided and the two options you are weighing. The skill is designed around one question per loft, so a request that bundles several decisions will be split or refined.

• "Does unlocking a level regress when a player retakes it? Build something I can click through."
• "Should the checkout steps be a stepper or a single page of cards? Show me three layouts on one route."
• "We keep going around on where progress should live. Loft it before we write the spec."

Know what the skill needs and what it runs

The skill requires Claude Code or a compatible SKILL.md agent. It also needs the target repository's existing serve command to run the prototype locally, and Git, because the work is organised on a loft/<name> branch. The skill runs scripts and does not use the network, according to its listing.

The skill says to run the repository's simplest existing serve command and to avoid adding a build step beyond what the repo already has. If a file:// module load would hit CORS problems, the agent is told to inline the module into the shell.

• Claude Code or a compatible SKILL.md agent
• The repo's existing serve command
• Git, for the loft/<name> branch

Safety notes on scripts and network

The skill runs scripts, so review what the agent executes in your repository before approving it, as you would with any script-running tool. The listing states that it does not use the network.

Keep the prototype off main. The skill's rules say nothing from the artifact should land in main, and that the artifact should be something you would not want to ship. Treat the branch as a record of the decision, not as code to deploy.

• Scripts: yes. Network: no, per the listing.
• Do not merge loft/<name> branches into main.
• Do not ship a prototype as-is; it has no error handling or tests.

Tips for getting a useful prototype

Expect the first shape to be argued with. The skill says to revise on the branch within the same session, and the final shape you confirm is the decision. If nobody pushes back on the first version, the question may not have needed a prototype.

If a loft starts growing into production code, the skill says to stop, because that work belongs in a normal launch effort. Keep each loft to a single question.

• Name the decision and the two options before you ask.
• React concretely to the prototype: say what you would pick and why.
• Record the decision in the issue, spec or pending-decision note, with one line of reasoning.