skills.rest
SensLiao
SensLiaoCOMMUNITY
Explore all skills by this author →
GitHub

anchor-prototype-wave

Generate HTML prototypes from visual anchors and page lists.

Updated May 28, 2026
Search Tags:#html#prototyping#prototype generation#prototype#ui/ux design
One-click install
npx skills add https://github.com/SensLiao/Claude-code-setting --skill anchor-prototype-wave
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: anchor-prototype-wave
Source: https://github.com/SensLiao/Claude-code-setting/tree/main/skills/anchor-prototype-wave
Command: npx skills add https://github.com/SensLiao/Claude-code-setting --skill anchor-prototype-wave

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires codex@openai-codex, ux-principles, taste-skill, prototyping-ui-directions, ai-regression-testing, luxury-editorial-site-builder, grill-with-docs, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill automates the creation of high-fidelity HTML prototypes from visual anchors and page lists, saving time and reducing manual effort in UI/UX design.

Core Features & Use Cases

  • Prototype Generation: Converts visual anchors and page lists into interactive HTML prototypes.
  • Parallel Subagent Execution: Runs multiple subagents in parallel for efficient processing.
  • Verification: Performs deterministic validation and LLM grading for quality control.
  • Cross-AI Review: Includes optional AI review for additional validation.
  • Use Case: Ideal for teams developing UI/UX designs, where rapid prototyping and quality assurance are essential.

Quick Start

Use the anchor-prototype-wave skill to generate prototypes from the visual anchor 'C5 Base v2' and the page list 'myproject/pages.md', saving the output to 'ui-lab/my-prototypes/'.

Frequently Asked Questions about anchor-prototype-wave

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate HTML prototypes from visual anchors and a page list?▼

To generate HTML prototypes from visual anchors and a page list, provide a visual anchor file and a page list markdown file to trigger parallel subagent execution, which outputs interactive high-fidelity HTML prototypes to your specified directory.

Can I automate UI/UX design validation for generated HTML prototypes?▼

Yes, automated UI/UX design validation is handled through deterministic validation checks and LLM grading mechanisms, ensuring quality control for generated HTML prototypes with an optional cross-AI review for additional assurance.

Does parallel subagent execution speed up prototype generation for multiple pages?▼

Parallel subagent execution runs multiple processing agents concurrently to speed up prototype generation, converting visual anchors and page lists into high-fidelity HTML prototypes efficiently for rapid UI/UX workflows.

What is the best way to convert visual design anchors into interactive HTML?▼

The best way to convert visual design anchors into interactive HTML is orchestrating parallel subagent processing with deterministic validation and LLM grading, yielding high-fidelity HTML prototypes suitable for rapid UI/UX prototyping workflows.

Do I need markdown page lists to start rapid prototyping with visual anchors?▼

Yes, a markdown page list and a visual anchor are required inputs to start rapid prototyping, enabling the orchestration engine to generate high-fidelity HTML prototypes and save them to your designated output directory.

Related Skills

Explore More Design & Creative Skills→
dallenpyrahdallenpyrah

emil-design-eng

Apply design engineering principles to UI/UX component and animation decisions.

Community
Advanced
majiayu000majiayu000
37

eval-harness

Quantify AI-generated code quality using pass@k and pass^k metrics.

Community
Advanced
ZiadNagarZiadNagar

premium-web-design

Generate React UI components aligned with design system tokens.

Community
Advanced
nandinhosnandinhos
13

grill-with-docs

Validate project plans against the CONTEXT.md glossary and detect terminology contradictions.

Community
Advanced