skills.rest
Tacuchi
TacuchiCOMMUNITY
Explore all skills by this author →
GitHub

ui-spec

Generate structured Screen JSON and Markdown render from UI requirements.

Updated May 2, 2026
Search Tags:#markdown#schema#design-system#screen#ui-spec#spec-refine-loop
One-click install
npx skills add https://github.com/Tacuchi/agent-workflow-cli --skill ui-spec-tacuchi
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-spec
Source: https://github.com/Tacuchi/agent-workflow-cli/tree/main/skills/w/roles/ui-spec
Command: npx skills add https://github.com/Tacuchi/agent-workflow-cli --skill ui-spec-tacuchi

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Author a structured, framework-agnostic UI Screen specification (the universal Screen model in JSON) plus its readable Markdown render, directly inside the design workflow.

Core Features & Use Cases

  • Built-in default for the ui-design capability to generate consistent Screen specifications.
  • Generates a camelCase Screen JSON and a human-readable Markdown render for easy review in docs.
  • Enables iterative refinement within the spec-refine-loop for screens, forms, dashboards, modals, and other UI surfaces.

Quick Start

Provide a UI requirement and have the skill generate a Screen JSON representation and its Markdown render.

Frequently Asked Questions about ui-spec

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

FAQPage Schema
How do I generate a structured UI specification from a requirement?▼

You generate a UI specification by providing a UI requirement, which produces a structured camelCase Screen JSON and a human-readable Markdown render for documentation.

What is the universal Screen schema for UI design specifications?▼

The universal Screen schema is a framework-agnostic JSON model using camelCase formatting with no null fields, designed to represent UI specifications for screens, forms, dashboards, and modals.

Can I use markdown rendering for UI specs across different screen types?▼

Yes, markdown rendering applies MarkdownFormatter rules to generate readable UI specs across screens, forms, dashboards, and modals within the iterative spec-refine-loop workflow.

How do I iterate on a UI screen design within the spec-refine-loop?▼

You iterate on a UI screen design by using the spec-refine-loop to repeatedly refine the Screen JSON and Markdown render based on updated UI requirements for your design workflow.

Does the Screen JSON specification support null fields for dashboards and modals?▼

No, the Screen JSON specification adheres to a strict universal Screen schema that uses camelCase formatting and explicitly excludes null fields for dashboards, modals, and other UI surfaces.

Related Skills

Explore More Design & Creative Skills→
jwmyersjwmyers

visual-style-guide

Define color palettes, SVG styling, and token designs for Zero-Day Attack interfaces.

Community
Intermediate
GiteshGitesh
1

design

Organize product design specifications using JSON and Markdown documentation.

Community
Intermediate
fmbp1981-hashfmbp1981-hash

frontend-design-workflow

Orchestrate a six-skill sequence to create, refine, and validate UI/UX components.

Community
Advanced
yashs33244yashs33244
1

design-shotgun

Generate multiple UI design variants and refine them with structured feedback.

Community
Advanced