require-prototype

Name: require-prototype
Availability: InStock
Author: Harries

Analyze prototype images to generate structured UI descriptions and element inventories.

1|Updated Dec 22, 2025

Search Tags:#prototype #design-review #image-analysis #element-identification #ui-description #page-descriptions

Ready to run

npx skills add https://github.com/Harries/hydpromptkit --skill require-prototype

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: require-prototype
Source: https://github.com/Harries/hydpromptkit/tree/main/skills/require-prototype
Command: npx skills add https://github.com/Harries/hydpromptkit --skill require-prototype

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

用户在设计评审和需求分析阶段往往需要将原型图转化为可理解的页面描述、元素清单以及交互关系。本 Skill 自动从原型图片中提取信息，生成结构化的页面描述，减少手动分析时间。

Core Features & Use Cases

自动识别原型中的界面元素（导航、按钮、表单、列表等）并输出页面描述
生成页面层级与模块关联的结构化信息，便于设计评审和开发对齐
使用场景：在设计评审中快速描述某一页面的布局和交互，或在需求落地前将原型转为实现规范

Quick Start

给出一张原型图片，系统自动分析并生成对应的页面描述。

Frequently Asked Questions about require-prototype

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

FAQPage Schema

How do I convert prototype images into structured UI descriptions?▼

You can convert prototype images into structured UI descriptions by providing the image path and optional location parameters to automatically extract interface elements, page names, module relationships, and interaction cues for design review and handoff documentation.

What is the best way to generate element inventories from design prototypes?▼

The best way to generate element inventories from design prototypes is through automated image analysis that identifies navigation, buttons, forms, and lists, then outputs structured page descriptions and module relationships to reduce manual analysis time.

Can I update existing handoff documentation after analyzing a new prototype image?▼

You can update existing handoff documentation after analyzing a new prototype image by specifying the output mode parameter, which supports updating documents with the latest extracted UI descriptions and element inventories.

What parameters are required to analyze a prototype image for requirements analysis?▼

To analyze a prototype image for requirements analysis, the image path parameter is required, while the image location and output mode are optional parameters that refine the extraction of UI descriptions and element inventories.

Does this tool work for design review and development alignment scenarios?▼

Yes, this tool works for design review and development alignment by automatically generating structured page descriptions, module relationships, and interaction cues from prototype images, ensuring teams share a clear understanding of layout and implementation specifications.