Generate HTML UI screen variations and reusable component catalogs from declarative schemas.
npx skills add https://github.com/dmedina-dev/dev-forge --skill ui-forge
Please help me install this Agent Skill. Skill: ui-forge Source: https://github.com/dmedina-dev/dev-forge/tree/main/plugins/forge-ui-forge/skills/ui-forge Command: npx skills add https://github.com/dmedina-dev/dev-forge --skill ui-forge
Designers and developers often need to explore multiple UI variations and build reusable components without altering production code, leading to slow iteration and fragmented design assets.
.ui-forge/.Ask ui-forge to prototype a new dashboard screen for the sales analytics project.
High-intent search queries and answers about installing and using this skill.
To prototype UI screens with reusable components, you generate multiple HTML screen variations from a declarative schema stored in a `.ui-forge` directory. This approach produces framework-agnostic screen specs and component specifications ready for downstream implementation.
The best way to generate mock data for UI prototypes is to use a tool that creates realistic data scenarios alongside your HTML screen variations. This allows thorough validation of interface states without altering production code.
You do not need external dependencies to prototype HTML UI variations. The process requires a project root with a `.ui-forge` directory, bash for bootstrap, Tailwind token defaults, and standard HTML/JS.
Yes, you can annotate UI mockups during design exploration by applying an annotation overlay. This lets you capture feedback and extract component ideas directly from the screen, saving them as JSON.
Component reuse works by promoting UI pieces into a growing registry of versioned components. As you iterate on screen prototypes, these cataloged components are applied across multiple HTML variations to maintain consistency.
Using standard HTML, JS, and bash for UI screen prototyping limits you to Tailwind token defaults and a local `.ui-forge` directory schema. It focuses on generating static variations rather than running a live coded application environment.
narcisolcfBundle a React shadcn/ui prototype into a single HTML artifact.
ichabodcoleGenerate technology-agnostic specification documents from existing codebases.
majesticlabs-devGenerate responsive Tailwind CSS styles for React components.
ArieGoldkinConvert HTML prototypes into React components with shadcn/ui and validation.