skills.rest
tinner-deinno
tinner-deinnoCOMMUNITY
Explore all skills by this author →
GitHub

gsd-ui-phase

Generate a UI-SPEC.md design contract for a frontend phase.

1|Updated May 24, 2026
Search Tags:#workflow orchestration#ui design#requirements validation#ui-spec#spec verification#design contract#frontend phases
One-click install
npx skills add https://github.com/tinner-deinno/innova-skills-lib --skill gsd-ui-phase-tinner-deinno
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: gsd-ui-phase
Source: https://github.com/tinner-deinno/innova-skills-lib/tree/main/core/gsd/gsd-ui-phase
Command: npx skills add https://github.com/tinner-deinno/innova-skills-lib --skill gsd-ui-phase-tinner-deinno

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It removes uncertainty in frontend planning by producing a consistent UI design contract (UI-SPEC.md) for each phase, based on validated research and review gates.

Core Features & Use Cases

  • UI design contract generation: Creates UI-SPEC.md for the specified frontend phase so implementation has clear, agreed requirements.
  • Research + verification orchestration: Runs the full flow that coordinates gsd-ui-researcher and gsd-ui-checker to Validate → Research UI → Verify UI-SPEC.
  • Phase-aware execution: Supports an optional phase argument and uses workflow gates to keep outputs stable and reviewable.
  • Use Case: When starting a new frontend phase (e.g., onboarding screen iteration), generate the UI-SPEC.md contract from scratch and ensure it passes the checker before development proceeds.

Quick Start

Ask the AI to run the gsd-ui-phase workflow to generate UI-SPEC.md for your next frontend phase.

Frequently Asked Questions about gsd-ui-phase

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

FAQPage Schema
How do I generate a UI design contract for a frontend phase?▼

To generate a UI design contract, you orchestrate validated UI research and verification to produce a UI-SPEC.md file for a specified frontend phase. This ensures implementation has clear, agreed requirements before development proceeds.

What is a UI-SPEC and when do I need it for frontend planning?▼

A UI-SPEC is a complete UI design contract (UI-SPEC.md) that removes uncertainty in frontend planning by translating validated research into implementation-ready requirements. You need it when starting a new frontend phase to ensure stable, reviewable outputs.

Can I auto-detect the next frontend phase if I don't specify one?▼

Yes, when the phase argument is omitted, the workflow can optionally auto-detect the next unplanned frontend phase. It then generates the UI-SPEC.md for that phase while preserving workflow gates.

What's the best way to validate UI requirements before development?▼

The best way to validate UI requirements is running the Validate, Research UI, and Verify UI-SPEC flow. This orchestrates research and checker components to ensure your UI design contract passes review gates before development proceeds.

Does UI spec generation work for iterative frontend phases?▼

Yes, UI spec generation applies to frontend planning workflows across iterative phases. It supports an optional phase argument and uses workflow gates to keep outputs stable and reviewable during each iteration cycle.

Why does my frontend phase need a design contract before implementation?▼

A frontend phase needs a design contract to remove uncertainty by translating validated research into clear, agreed requirements. The UI-SPEC.md ensures the phase passes verification checks before development begins.

Related Skills

Explore More Design & Creative Skills→
ev3rlitev3rlit

gsd-ui-phase

Orchestrate gsd-ui-researcher and gsd-ui-checker to generate a validated UI-SPEC.md.

Community
Advanced
rkz91rkz91
264

gsd-ui-phase

Generate a UI-SPEC.md contract with phase-specific UI criteria for frontend workflows.

Community
Advanced
Poom5741Poom5741

gsd-ui-phase

Generate a standardized UI-SPEC.md for frontend phases.

Community
Advanced
MINT-IAMINT-IA

gsd-ui-phase

Generate UI-SPEC.md design contracts with phase objectives and verification steps.

Official
Intermediate