Agent skill

Spectre Prototype

by joenandez in joenandez/spectre

Create one self-contained HTML prototype to resolve ambiguity, validate flows, or render UX before planning.

MITAuto-check passed

Install Spectre Prototype

skills CLI
$ npx skills add joenandez/spectre --skill spectre-prototype -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install joenandez/spectre spectre-prototype --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/joenandez/spectre.git skills-src && mkdir -p .claude/skills && cp -r skills-src/plugins/spectre/skills/spectre-prototype .claude/skills/spectre-prototype && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
spectre-prototype
GitHub stars
164
Token cost
~1.3k tokens
SKILL.md length
571 words
Files
1
Skills in repo
26
Repo updated
First seen
Licence
MIT

At a glance

Create one self-contained HTML prototype to resolve ambiguity, validate flows, or render UX before planning.

  • Works in 4 steps: Reply before tools, except FROM_UX=true… → Ask 2–4 focused questions. Confirm… → After the gate, dispatch in parallel;… → …
  • Prototype/mockup/preview requests and UX Stage 1→2
  • SKILL.md covers Purpose, Inputs, Working Set and Outputs + DONE, plus 3 more sections
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

Spectre Prototype is an agent skill from joenandez/spectre. Create one self-contained HTML prototype to resolve ambiguity, validate flows, or render UX before planning. Use for prototype/mockup/preview requests and UX Stage 1→2; not for production code, multi-file apps, scope, or planning.

Its SKILL.md is about 1.3k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

The repository describes itself as: Spectre is a battle-tested 6 stage agentic engineering workflow for building complex, production-ready features. You stay in the loop for the decisions that matter. Your agents…. The licence is MIT.

When your agent uses it

  • Prototype/mockup/preview requests and UX Stage 1→2
  • Not for production code
  • Multi-file apps

Example prompts

  • “/spectre-prototype”

Workflow steps

4 steps, taken from the first numbered list in SKILL.md.

  1. Reply before tools, except FROM_UX=true may begin by reading ux.md; if no arguments or context, ask what to prototype.
  2. Ask 2–4 focused questions. Confirm fidelity and a visual anchor (colors, fonts, URL, or named aesthetic); if skipped, declare one. Gate…
  3. After the gate, dispatch in parallel; each returns ≤2,000 tokens in-thread and writes no files
  4. After all findings return, the primary alone creates, edits, and validates the HTML; not even @spectre:dev modifies it.

What it can do on your machine

Read from SKILL.md and the folder at commit 931c9e8. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    No scripts in the folder and no shell commands in SKILL.md.

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Spectre Prototype loads about 1.3k tokens when it runs. Until then it costs about 62 tokens; SKILL.md has 571 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~62
When it runs · the whole SKILL.md, loaded when a task matches
~1.3k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from joenandez/spectre at commit 931c9e8, republished under its MIT licence (© joenandez). 571 words, ~1,279 tokens.

Download SKILL.mdSave it as .claude/skills/spectre-prototype/SKILL.md (or your agent's skills folder).
name
spectre-prototype
description
Create one self-contained HTML prototype to resolve ambiguity, validate flows, or render UX before planning. Use for prototype/mockup/preview requests and UX Stage 1→2; not for production code, multi-file apps, scope, or planning.
user-invocable
true
disable-model-invocation
true

prototype

Purpose

Produce one HTML prototype at {FEATURE_ROOT}/prototypes/{slug}_{MMDDYY}.html. The primary owns it; agents provide evidence only.

Inputs

  • $ARGUMENTS: feature root/name or descendant, description, optional --explore; marker FROM_UX=true.
  • Read existing concepts/scope.md, specs/prd.md, ux.md, then legacy specs/ux.md fully before questions.
  • Silently read repo-root product.md when present, plus design.md or fallback design/design.md; apply them; do not mention missing files.
ModeSignalFidelityContract
post-uxcomplete ux.md: Screens, Layouts, Components, Interactions, States, Contenthighrender faithfully; exact documented copy; no invented screens
flows-only uxFROM_UX=true or flows without complete Stage 2midpreserve approved flows; choose UI details
explore--explorelow, grayscale/layout-onlyvisualize an unvalidated concept
post-scopescope, no UXmidvalidate scope
standaloneno artifactmidestablish what to prototype

Working Set

  • Reuse a managed FEATURE_ROOT only when explicit/current-thread evidence ties it to this work (physical directory wins; never branch/recency/lifecycle/scans); distinct work ignores ambient roots. Otherwise, including on collision, standalone MUST first load and follow @skill-spectre:spectre-feature-root through DONE; orchestrated calls escalate. Keep writes beneath it and pass it unchanged.
  • Repair stale feature/root metadata in artifacts this workflow touches.

Outputs + DONE

The single HTML file contains:

  • <!DOCTYPE html>, viewport metadata, inline CSS, and inline end-of-body JavaScript.
  • A top-of-head comment beginning Feature: and Feature Root:, followed by Fidelity, Generated, Flow covered, Screens/states, Visual anchor, Source spec, Key assumptions, post-UX Filled assumptions, NOT included, and Next step.
  • A design-token comment for Primary, Accent, Surface, Text, Font, Border-radius, Spacing, mirrored as :root custom properties.
  • If multi-screen, vanilla-JS display:block/none navigation; one ordered <section> per screen, each with happy path plus an empty, error, or loading state.

DONE when mode/fidelity/anchor are explicit; available context and research preceded generation; the primary authored and validated the file; documented UX is faithful; content is realistic; components reuse named classes; interactions have no console errors; and states, reuse, and portability pass. Surface failures as caveats.

Show full SKILL.md (269 more words)Show less

Method / guardrails

  1. Reply before tools, except FROM_UX=true may begin by reading ux.md; if no arguments or context, ask what to prototype.
  2. Ask 2–4 focused questions. Confirm fidelity and a visual anchor (colors, fonts, URL, or named aesthetic); if skipped, declare one. Gate: wait unless FROM_UX=true.
  3. After the gate, dispatch in parallel; each returns ≤2,000 tokens in-thread and writes no files:
    • @spectre:web-research: 2–3 current references, interaction convention, and concrete palette/type/layout values; <400 words with citations.
    • @spectre:analyst: post-UX extracts required sections and copy verbatim, marking spec-silent details as filled assumptions; otherwise synthesizes flow, screen states, realistic content, and components.
    • @spectre:patterns: only for an existing app; return actual tokens and interaction conventions.
  4. After all findings return, the primary alone creates, edits, and validates the HTML; not even @spectre:dev modifies it.

Use inline SVG/data URIs/CSS shapes only: no remote images, relative assets, custom WOFF, filler, Inter/Roboto defaults, purple-on-white gradients, broken href="#", happy-path-only screens, or inline restyling of recurring components. Use one Google family (≤2 weights) or system fonts. Tailwind CDN is mid/high-fi only.

Handoff

HandoffDetails
🧭 Current phaseDone
📦 What was just doneResult
▶️ Proposed next stepRender resolved action.

Return path/screens/fidelity/anchor/assumptions/NOT included; opens/shareable; revalidate edits/research; promote post-UX to ux.md. explore → Scope; flows-only UX → Stage 2; post-UX contradiction/assumption → UX, else Plan; post-scope unresolved UX → UX, post-scope validated scope → /spectre:spectre-plan; standalone no scope → Scope, else reclassify as post-scope. One route/conditional/pause.

Escalate-If

  • A post-UX contradiction exists: ask which is authoritative, update ux.md and HTML together, then revalidate.
  • A required mode artifact is missing/unreadable, or neither the user nor context supplies a usable visual anchor/aesthetic.

Next step: follow the mode-specific handoff above.

© joenandez, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

Just SKILL.md in plugins/spectre/skills/spectre-prototype of joenandez/spectre.

Open the folder on GitHubat commit 931c9e8

Compare with similar skills

Spectre Prototype next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Spectre Prototype compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Spectre Prototype this skilljoenandez/spectre164—~1.3kAutomated safety check: PassMIT
LobeHub Interactive Prototypelobehub/lobehub83k—~1.6kAutomated safety check: PassCustom licence
PrototypeDonchitos/Claude-Code-Game-Studios26k—~8.1kAutomated safety check: NotesMIT
PrototypeEpicenterHQ/epicenter4.8k—~767Automated safety check: PassCustom licence
Compound Engineering PrototypeEveryInc/compound-engineering-plugin25k—~1.9kAutomated safety check: PassMIT
Apple Containersickn33/agentic-awesome-skills47k1 repos~2.5kAutomated safety check: PassApache-2.0

Similar skills

  • Builds single-file interactive HTML prototypes rendered with the real LobeHub UI components and written as production-style React, so they can later be split into files.

    83k GitHub stars~1.6k tokensUpdated today
    Frontend & DesignAuto-check passed
  • Prototype

    Donchitos/Claude-Code-Game-Studios

    Concept prototype before GDDs — throwaway HTML, Engine or Paper build, PROCEED/PIVOT/KILL/NOT ASSESSED.

    26k GitHub stars~8.1k tokensUpdated 9 days ago
    Game DevelopmentAuto-check: notes
  • Prototype

    EpicenterHQ/epicenter

    Build a throwaway prototype to answer a focused logic, state-model, or UI question before committing to production design.

    4.8k GitHub stars~767 tokensUpdated today
    DevelopmentAuto-check passed
  • Compound Engineering Prototype

    EveryInc/compound-engineering-plugin

    Builds a throwaway prototype at just the fidelity needed to settle a specific how-it-should-work-or-feel question, before committing to an approach other work will treat as fixed.

    25k GitHub stars~1.9k tokensUpdated today
    DevelopmentAuto-check passed
  • Apple Container

    sickn33/agentic-awesome-skills

    Build, run, and manage OCI/Linux containers as lightweight per-container VMs on Apple-silicon macOS using Apple's open-source container CLI, no Docker daemon required.

    47k GitHub starsUsed in 1 repo~2.5k tokens
    DevOps & CloudAuto-check passed
  • Prototype

    vinvcn/mattpocock-skills-zh-CN

    构建一次性原型来回答一个设计问题。适用于用户想验证某个 state model 或 logic 是否感觉对,或探索 UI 应该长什么样时。

    4.7k GitHub stars~406 tokensUpdated 10 days ago
    DevelopmentAuto-check passed

More from joenandez/spectre

All 26 skills in this repo
  • Verify Spectre

    joenandez/spectre

    A skill your agent uses when validating that the Spectre plugin itself still works after ANY change to this repo — skills, prompts, agents, hooks, the CLI, the Codex mirror, or a release.

    164 GitHub stars~1.5k tokensUpdated 5 days ago
    Auto-check passed
  • A skill your agent uses when modifying the Codex SPECTRE install flow, SessionStart continuity, project skill syncing, registry injection, or Codex-specific runtime files.

    164 GitHub stars~2.2k tokensUpdated 5 days ago
    Auto-check passed
  • Spectre Handoff

    joenandez/spectre

    Save a quiet, branch-keyed session snapshot with continuity, active work, and optional task/todo state for automatic resume.

    164 GitHub stars~1.3k tokensUpdated 5 days ago
    Auto-check passed
  • Spectre Learn

    joenandez/spectre

    User-invoked front door for durable capture. An agent skill from joenandez/spectre.

    164 GitHub stars~1k tokensUpdated 5 days ago
    Auto-check passed
  • Spectre Rewrite Skill

    joenandez/spectre

    Rewrite a verbose SPECTRE skill into a compact, contract-form Spectre skill proposal — clear on WHAT, silent on HOW — grounded in the spectre-light distillation and freedom-tier budget.

    164 GitHub stars~3k tokensUpdated 5 days ago
    Auto-check passed
  • Spectre Rewrite Subagent

    joenandez/spectre

    Rewrite Spectre subagent definitions into compact, contract-driven agents with clear routing, least-privilege tools, output schemas, and an auditable rewrite trail.

    164 GitHub stars~1.8k tokensUpdated 5 days ago
    Auto-check passed

Questions about Spectre Prototype

What does Spectre Prototype do?

Create one self-contained HTML prototype to resolve ambiguity, validate flows, or render UX before planning. Spectre Prototype is an agent skill from joenandez/spectre. Create one self-contained HTML prototype to resolve ambiguity, validate flows, or render UX before planning.

When should I use Spectre Prototype?

Spectre Prototype fits situations like: prototype/mockup/preview requests and UX Stage 1→2; not for production code; multi-file apps.

How do I install Spectre Prototype in Claude Code?

Run `npx skills add joenandez/spectre --skill spectre-prototype -a claude-code`. Or copy the skill folder (plugins/spectre/skills/spectre-prototype in joenandez/spectre) into .claude/skills/spectre-prototype in your project. Claude Code loads it when a task matches its description.

How do I install Spectre Prototype in Codex?

Run `npx skills add joenandez/spectre --skill spectre-prototype -a codex`. Or copy the skill folder (plugins/spectre/skills/spectre-prototype in joenandez/spectre) into .agents/skills/spectre-prototype in your project. Codex loads it when a task matches its description.

Can I use Spectre Prototype in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add joenandez/spectre --skill spectre-prototype -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/spectre-prototype, .gemini/skills/spectre-prototype, .github/skills/spectre-prototype and .opencode/skills/spectre-prototype in your project.

What does Spectre Prototype need to run?

SKILL.md names no scripts, command-line tools or credentials: Spectre Prototype is instructions for the agent only.

Does Spectre Prototype access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Spectre Prototype safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Spectre Prototype use?

Spectre Prototype is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Spectre Prototype use?

About 1.3k tokens (SKILL.md is roughly 5.1k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Spectre Prototype?

Skills that share tags, products or a category with Spectre Prototype: LobeHub Interactive Prototype (lobehub/lobehub, 83k stars), Prototype (Donchitos/Claude-Code-Game-Studios, 26k stars), Prototype (EpicenterHQ/epicenter, 4.8k stars) and Compound Engineering Prototype (EveryInc/compound-engineering-plugin, 25k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Spectre Prototype?

joenandez (a GitHub user) maintains it in joenandez/spectre, which has 164 GitHub stars. The repository holds 26 skills in this directory. The repository was last updated on October 2, 2026.

Source: joenandez/spectre on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.