New: 98,000+ skills indexed from GitHub repos with 100+ stars · every skill safety-checkedBrowse top skillsTop skills
Esc to closeBrowse all skills
Submit a skillBrowse skills
Submit a skillBrowse skills

Agent skill

Iteration Prototype Fidelity

by hashgraph-online in hashgraph-online/awesome-codex-plugins

A skill your agent uses when picking the appropriate prototype fidelity for an iteration cycle — sketches vs.

Apache-2.0Auto-check passedFrontend & Design

Install Iteration Prototype Fidelity

skills CLI
$ npx skills add hashgraph-online/awesome-codex-plugins --skill iteration-prototype-fidelity -a claude-code

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

GitHub CLI
$ gh skill install hashgraph-online/awesome-codex-plugins iteration-prototype-fidelity --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/hashgraph-online/awesome-codex-plugins.git skills-src && mkdir -p .claude/skills && cp -r skills-src/plugins/HDeibler/universal-design-principles/plugins/process-and-robustness-principles/skills/iteration-prototype-fidelity .claude/skills/iteration-prototype-fidelity && 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
iteration-prototype-fidelity
GitHub stars
1.3k
Token cost
~1.7k tokens
SKILL.md length
880 words
Files
2 (incl. references)
Skills in repo
714
Repo updated
First seen
Licence
Apache-2.0

At a glance

A skill your agent uses when picking the appropriate prototype fidelity for an iteration cycle — sketches vs.

  • Works in 6 steps: Paper sketches → Wireframes (low-fidelity digital) → Mockups (high-fidelity static) → …
  • Picking the appropriate prototype fidelity for an iteration cycle — sketches vs
  • SKILL.md covers The fidelity ladder, Picking the right fidelity for…, When to stay low fidelity longer and When to go high fidelity earlier, plus 4 more sections
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

Iteration Prototype Fidelity is an agent skill from hashgraph-online/awesome-codex-plugins. Use this skill when picking the appropriate prototype fidelity for an iteration cycle — sketches vs. wireframes vs. clickable Figma vs. code prototypes vs. production beta. Trigger when planning a research session, when a project is over- or under-investing in prototypes, or when the prototype fidelity is mismatched to the question being asked. Sub-aspect of iteration; read that first.

Its SKILL.md is about 1.7k tokens, which your agent loads only when the skill is triggered. The skill folder holds 2 other files, including reference files (for example `references/prototyping-tools-and-research.md`).

It sits in Frontend & Design, covering UI design and Prototyping. It works with Figma and Visual Studio Code. The repository describes itself as: A curated list of awesome OpenAI Codex / ChatGPT plugins, skills, and resources. The 1 Codex Marketplace. See live plugins at: https://hol.org/plugins/best-codex-plugins. The licence is Apache-2.0.

When your agent uses it

  • Picking the appropriate prototype fidelity for an iteration cycle — sketches vs
  • Planning a research session
  • A project is over-
  • Under-investing in prototypes

Example prompts

  • “/iteration-prototype-fidelity”

Workflow steps

6 steps, taken from the step headings in SKILL.md.

  1. Paper sketches
  2. Wireframes (low-fidelity digital)
  3. Mockups (high-fidelity static)
  4. Clickable prototypes (Figma, Framer, ProtoPie)
  5. Code prototypes
  6. Production beta

What it can do on your machine

Read from SKILL.md and the folder at commit 9e7b281. 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

Iteration Prototype Fidelity loads about 1.7k tokens when it runs, and up to ~2.6k if it reads all its reference files. Until then it costs about 105 tokens; SKILL.md has 880 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~105
When it runs · the whole SKILL.md, loaded when a task matches
~1.7k
With references · SKILL.md plus every file in references/, read only if the agent opens them
~2.6k

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 hashgraph-online/awesome-codex-plugins at commit 9e7b281, republished under its Apache-2.0 licence (© hashgraph-online). 880 words, ~1,743 tokens.

Download SKILL.mdSave it as .claude/skills/iteration-prototype-fidelity/SKILL.md (or your agent's skills folder). This skill also uses 1 other file; get the full folder from GitHub.
name
iteration-prototype-fidelity
description
Use this skill when picking the appropriate prototype fidelity for an iteration cycle — sketches vs. wireframes vs. clickable Figma vs. code prototypes vs. production beta. Trigger when planning a research session, when a project is over- or under-investing in prototypes, or when the prototype fidelity is mismatched to the question being asked. Sub-aspect of `iteration`; read that first.

Picking the right prototype fidelity

Each prototype fidelity is a tool with a cost and a use. Sketches are nearly free but answer only structural questions. Code prototypes cost more but answer performance and behavior questions. The discipline is matching fidelity to the question being asked — not always going lowest, not always going highest.

The fidelity ladder

From cheapest to most expensive:

1. Paper sketches

A pen and paper. Cost: 5–30 minutes per option. Answers:

  • Does this layout structure make sense?
  • Are the right elements present?
  • What's the rough information architecture?

Doesn't answer:

  • How does it feel to interact with this?
  • Does the typography work?
  • Are colors right?

When to stop here: structural questions only; very early discovery.

2. Wireframes (low-fidelity digital)

Boxy, monochrome, no real content. Cost: 1–4 hours per screen. Answers:

  • Layout proportions on screen.
  • Reading order and hierarchy.
  • Information grouping.

Doesn't answer:

  • Visual style.
  • Interaction feel.
  • Real-content edge cases.

When to stop here: when structure is the question; before visual design begins.

3. Mockups (high-fidelity static)

Real fonts, colors, content; static image. Cost: 4–16 hours per screen. Answers:

  • Visual style.
  • Polish and brand fit.
  • Stakeholder alignment ("does this look right?").

Doesn't answer:

  • Interaction.
  • Edge cases.
  • Performance.

Common misuse: building high-fidelity mockups before structure is settled. The mockups become anchors that prevent structural changes.

4. Clickable prototypes (Figma, Framer, ProtoPie)

Mockups linked together with click-throughs. Cost: 1–3 days per major flow. Answers:

  • Does the interaction sequence make sense?
  • Where do users get confused?
  • Are the affordances clear?

Doesn't answer:

  • Real-content edge cases.
  • Performance.
  • Cross-device behavior.

Sweet spot for most user research; cheap enough to revise, real enough to test.

5. Code prototypes

Working code with real or seeded data, but not production-ready. Cost: 1–3 weeks. Answers:

  • Performance.
  • Cross-device behavior.
  • Real-data edge cases.
  • Implementation complexity.

Doesn't answer:

  • Long-term scale issues.
  • Production reliability.

Useful when implementation has unknowns or when performance is a concern.

6. Production beta

Shipped to a small percentage of real users. Cost: high (full implementation). Answers:

  • Real usage at scale.
  • Bug rates.
  • Long-term retention.
  • Real edge cases.

Doesn't answer (well):

  • Counterfactual: would users have liked the alternative more?

When to use: late-stage validation; gradual rollout.

Picking the right fidelity for each question

A useful rule: pick the cheapest fidelity that answers the question.

QuestionRecommended fidelity
Does the IA make sense?Sketches or wireframes
Is the visual style right?High-fidelity mockup
Does the flow work for users?Clickable prototype + 5 interviews
Will the load time be acceptable?Code prototype with seeded data
Will users adopt it?Production beta with measurement

Going higher than needed wastes time. Going lower means you don't get the answer.

When to stay low fidelity longer

Counterintuitively, low fidelity is often better for user research:

  • Users critique the prototype's polish, not its structure. A high-fidelity mockup gets feedback like "I don't love this blue" instead of "I don't understand what this page is for." The polish distracts.
  • Low fidelity invites criticism. Users feel comfortable suggesting changes to a sketch; they hesitate to challenge a polished mockup.
  • Low fidelity is faster to revise. You can make 5 sketch variations in the time it takes to make 1 mockup variation.

For early-stage user research, sketches and wireframes often outperform high-fidelity prototypes despite "feeling unprofessional."

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

When to go high fidelity earlier

A few cases where polish matters:

  • Stakeholder buy-in. Some stakeholders only react meaningfully to high-fidelity mockups. Build them for those reviews.
  • Brand-perception research. Testing whether a design feels like the brand requires polish.
  • Competitive comparison. Comparing your design's appeal to a competitor's polished product needs comparable polish.

Anti-patterns

  • Pixel-perfect early. Polishing visual details before structure is settled. The pixels then have to be redone.
  • Test with the prototype that was easy to build. Using a Figma prototype to test load-time performance, or a code prototype to test layout structure. Wrong fidelity for the question.
  • Skip prototyping entirely. "We're agile, we'll just build it." Then iterate expensively in production.
  • Production-quality prototypes. Building prototypes to production code quality. Defeats the cost advantage of prototyping.
  • Treating prototypes as products. Shipping a prototype as the product because it "works." Usually missing edge cases, accessibility, performance.

Worked example: layered prototyping for a new feature

A team designs a new collaboration feature.

  • Week 1: paper sketches; internal review. Decide structural concept.
  • Week 2: wireframes; design crit. Refine information architecture.
  • Week 3: clickable Figma prototype; 5 user interviews. Discover one critical flow is confusing; redesign.
  • Week 4: refined Figma prototype; 5 more interviews. Confirm the redesign works.
  • Week 5–6: code prototype with real data. Surface a performance issue; design adapts.
  • Week 7–10: production build. Ship to 10% beta.
  • Week 11–12: full release.

Each cycle uses the cheapest fidelity that answers the cycle's question.

Heuristics

  1. The "what question is this prototype answering?" check. Before building the prototype, name the question. Pick the fidelity that answers it.
  2. The "could a sketch have caught this?" retrospective. When issues are discovered late, ask whether earlier prototyping at lower fidelity would have caught them.
  3. The user-reaction signal. If users critique your prototype's visual polish, you're at too high fidelity for the question. Drop down.
  • iteration (parent).
  • iteration-design-vs-development — moving up the fidelity ladder is part of moving from design to development.
  • prototyping — the broader technique.
  • factor-of-safety — prototypes are a form of designing-with-margin.

© hashgraph-online, Apache-2.0. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 1 other file (references) in plugins/HDeibler/universal-design-principles/plugins/process-and-robustness-principles/skills/iteration-prototype-fidelity of hashgraph-online/awesome-codex-plugins.

  • SKILL.md
  • references/prototyping-tools-and-research.md

Open the folder on GitHubat commit 9e7b281

Compare with similar skills

Iteration Prototype Fidelity 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.

Iteration Prototype Fidelity compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Iteration Prototype Fidelity this skillhashgraph-online/awesome-codex-plugins1.3k—~1.7kAutomated safety check: PassApache-2.0
Prototype to Figmaalima-max/prototype-to-figma-skill141—~7.8kAutomated safety check: PassMIT
LobeHub Interactive Prototypelobehub/lobehub83k—~1.6kAutomated safety check: PassCustom licence
Figma Design to Codewarpdotdev/warp65k4 repos~2.9kAutomated safety check: PassAGPL-3.0
Cc DesignZeroZ-lab/cc-design827—~2.2kAutomated safety check: NotesNone
Visual Stylecalesthio/OpenMontage66k—~1.5kAutomated safety check: PassAGPL-3.0

Similar skills

  • Prototype to Figma

    alima-max/prototype-to-figma-skill

    Converts a working code prototype into a structured Figma file with one frame per interaction state, mapped to your design system and annotated with transitions.

    141 GitHub stars~7.8k tokensUpdated 2 mo ago
    Frontend & DesignAuto-check passed

  • LobeHub Interactive Prototype

    lobehub/lobehub

    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

  • Figma Design to Code

    warpdotdev/warp

    Turns a Figma frame or component into production code that matches the design, using the Figma MCP server and the project's own design system.

    65k GitHub starsUsed in 4 repos~2.9k tokens
    Frontend & DesignAuto-check passed

  • Cc Design

    ZeroZ-lab/cc-design

    High-fidelity HTML design and prototype creation. An agent skill from ZeroZ-lab/cc-design.

    827 GitHub stars~2.2k tokensUpdated 3 mo ago
    Frontend & DesignAuto-check: notes

  • Visual Style

    calesthio/OpenMontage

    Create, extract, and apply portable visual design systems via visual-style.md files.

    66k GitHub stars~1.5k tokensUpdated 5 days ago
    Frontend & DesignAuto-check passed

  • Variate Design Variations

    Nutlope/variate

    Puts four real design variations of one project file on your localhost behind a small card you flip with the arrow keys, then acts on your verdict.

    211 GitHub stars~3.5k tokensUpdated 1 mo ago
    Frontend & DesignAuto-check passed

More from hashgraph-online/awesome-codex-plugins

All 714 skills in this repo

  • Anime Reaction Gif

    hashgraph-online/awesome-codex-plugins

    Create original anime-style reaction stickers as looping GIFs and MP4 previews, using generated character pose sheets and timed key poses.

    1.3k GitHub stars~922 tokensUpdated today
    Auto-check passed

  • Calibredb

    hashgraph-online/awesome-codex-plugins

    Manage and query Calibre libraries with the calibredb CLI (local paths or Calibre Content server URLs).

    1.3k GitHub stars~1k tokensUpdated today
    Auto-check passed

  • Rust API Test Harness

    hashgraph-online/awesome-codex-plugins

    A skill your agent uses when adding, changing, testing, or debugging Rust HTTP APIs and services, especially when Codex needs black-box integration tests, random-port app startup, real database test…

    1.3k GitHub stars~1.7k tokensUpdated today
    Auto-check passed

  • Art

    hashgraph-online/awesome-codex-plugins

    Make a studio's game look like something at build time — a cover from a real frame of the game (free), painted covers, backdrops, textures and character plates from image models through the…

    1.3k GitHub stars~2.4k tokensUpdated today
    Auto-check passed

  • Calle

    hashgraph-online/awesome-codex-plugins

    Use CALL-E from Codex through the calle CLI. An agent skill from hashgraph-online/awesome-codex-plugins.

    1.3k GitHub stars~2.9k tokensUpdated today
    Auto-check passed

  • Game Balance Economy

    hashgraph-online/awesome-codex-plugins

    Balance game difficulty, resources, rewards, probability, progression, economies, and dominant strategies.

    1.3k GitHub stars~618 tokensUpdated today
    Auto-check passed

Works with

Categories

Questions about Iteration Prototype Fidelity

What does Iteration Prototype Fidelity do?

A skill your agent uses when picking the appropriate prototype fidelity for an iteration cycle — sketches vs. Iteration Prototype Fidelity is an agent skill from hashgraph-online/awesome-codex-plugins. Use this skill when picking the appropriate prototype fidelity for an iteration cycle — sketches vs.

When should I use Iteration Prototype Fidelity?

Iteration Prototype Fidelity fits situations like: picking the appropriate prototype fidelity for an iteration cycle — sketches vs; planning a research session; A project is over-; under-investing in prototypes.

How do I install Iteration Prototype Fidelity in Claude Code?

Run `npx skills add hashgraph-online/awesome-codex-plugins --skill iteration-prototype-fidelity -a claude-code`. Or copy the skill folder (plugins/HDeibler/universal-design-principles/plugins/process-and-robustness-principles/skills/iteration-prototype-fidelity in hashgraph-online/awesome-codex-plugins) into .claude/skills/iteration-prototype-fidelity in your project. Claude Code loads it when a task matches its description.

How do I install Iteration Prototype Fidelity in Codex?

Run `npx skills add hashgraph-online/awesome-codex-plugins --skill iteration-prototype-fidelity -a codex`. Or copy the skill folder (plugins/HDeibler/universal-design-principles/plugins/process-and-robustness-principles/skills/iteration-prototype-fidelity in hashgraph-online/awesome-codex-plugins) into .agents/skills/iteration-prototype-fidelity in your project. Codex loads it when a task matches its description.

Can I use Iteration Prototype Fidelity 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 hashgraph-online/awesome-codex-plugins --skill iteration-prototype-fidelity -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/iteration-prototype-fidelity, .gemini/skills/iteration-prototype-fidelity, .github/skills/iteration-prototype-fidelity and .opencode/skills/iteration-prototype-fidelity in your project.

What does Iteration Prototype Fidelity need to run?

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

Does Iteration Prototype Fidelity 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 Iteration Prototype Fidelity 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 Iteration Prototype Fidelity use?

Iteration Prototype Fidelity is published under the Apache-2.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Iteration Prototype Fidelity use?

About 1.7k tokens (SKILL.md is roughly 7k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 907 tokens, read only when the agent opens those files.

What are the alternatives to Iteration Prototype Fidelity?

Skills that share tags, products or a category with Iteration Prototype Fidelity: Prototype to Figma (alima-max/prototype-to-figma-skill, 141 stars), LobeHub Interactive Prototype (lobehub/lobehub, 83k stars), Figma Design to Code (warpdotdev/warp, 65k stars) and Cc Design (ZeroZ-lab/cc-design, 827 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Iteration Prototype Fidelity?

hashgraph-online (a GitHub organization) maintains it in hashgraph-online/awesome-codex-plugins, which has 1,255 GitHub stars. The repository holds 714 skills in this directory. The repository was last updated on October 9, 2026.

Source: hashgraph-online/awesome-codex-plugins on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.