How do I install the Design Prototype skill?

Run npx skillmds@latest add zereight/design-prototype in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

Is Design Prototype safe to use?

This skill has not completed SkillMD's automated safety review yet. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Design Prototype?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Design Prototype free to use?

Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.

Who published Design Prototype?

zereight (@zereight) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Design Prototype by zereight — Agent Skill

Name: Design Prototype
Author: zereight

Design Prototype

Move an idea up the fidelity ladder (content-first → wireframe → low-fi → high-fi → code) with a validation plan at each level, plus user-journey mapping and usability-testing scripts. Use when the user wants to prototype, wireframe, map a user flow, or plan/run usability testing.

zereight 84bad4f 1.9 KB Updated Sep 17, 2026

File contents

Skill: Prototype & Research

Guide work through the right fidelity level with validation.

Steps

Read workflows/prototyping.md (5-level fidelity ladder, journey mapping template, usability-testing script, sample data).
Identify the current need and pick the lowest fidelity that answers it — never skip levels:
- Content-first (info needs) → Wireframe (layout/nav) → Low-fi (task completion) → High-fi (visual/a11y) → Code (feasibility/perf).
For flows: produce a user-journey map with decision points, error paths, and edge cases.
For validation: define the usability test (tasks, success criteria, 5-user rule) using the script.
High-fi/code steps pull tokens (tokens/*), components (components/*), taste (taste/*), and a11y (accessibility/*).

Output

The artifact at the chosen fidelity + an explicit "what we validate next" plan.

Verification (before declaring done)

The fidelity matches the question being answered — no level skipped.
Flows include decision points, error paths, and edge cases (empty/loading/overflow), not just the happy path.
A concrete validation step is named (tasks + success criteria), not "test later".
High-fi/code artifacts pass the same token + a11y bar as design-code (no hardcoded values, contrast, states).

Kit location

This skill is part of ux-ui-agent-skills v2.4.0.

Resolve every relative path in the steps above against:

.agents/ux-ui-agent-skills/

(from repo root: /Users/tao.exe/Documents/skill/.agents/ux-ui-agent-skills)

Load .agents/ux-ui-agent-skills/CLAUDE.md when you need the full agent persona or Request Router.

---name: design-prototypedescription: Move an idea up the fidelity ladder (content-first → wireframe → low-fi → high-fi → code) with a validation plan at each level, plus user-journey mapping and usability-testing scripts. Use when the user wants to prototype, wireframe, map a user flow, or plan/run usability testing.---# Skill: Prototype & ResearchGuide work through the right fidelity level with validation.## Steps1. Read `workflows/prototyping.md` (5-level fidelity ladder, journey mapping template, usability-testing script, sample data).2. Identify the current need and pick the **lowest** fidelity that answers it — never skip levels: - Content-first (info needs) → Wireframe (layout/nav) → Low-fi (task completion) → High-fi (visual/a11y) → Code (feasibility/perf).3. For flows: produce a user-journey map with decision points, error paths, and edge cases.4. For validation: define the usability test (tasks, success criteria, 5-user rule) using the script.5. High-fi/code steps pull tokens (`tokens/*`), components (`components/*`), taste (`taste/*`), and a11y (`accessibility/*`).## OutputThe artifact at the chosen fidelity + an explicit "what we validate next" plan.## Verification (before declaring done)- The fidelity matches the question being answered — no level skipped.- Flows include decision points, **error paths, and edge cases** (empty/loading/overflow), not just the happy path.- A concrete validation step is named (tasks + success criteria), not "test later".- High-fi/code artifacts pass the same token + a11y bar as `design-code` (no hardcoded values, contrast, states).---## Kit locationThis skill is part of **ux-ui-agent-skills v2.4.0**.Resolve every relative path in the steps above against:`.agents/ux-ui-agent-skills/`(from repo root: `/Users/tao.exe/Documents/skill/.agents/ux-ui-agent-skills`)Load `.agents/ux-ui-agent-skills/CLAUDE.md` when you need the full agent persona or Request Router.

Frequently asked questions