skills.rest
BeiBei-Clic
BeiBei-ClicCOMMUNITY
Explore all skills by this author →
GitHub

gsd-ui-phase

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

Updated Aug 23, 2026
Search Tags:#documentation#workflow-orchestration#phase-planning#design-validation#gsd#frontend-ux#ui-specified-contract
One-click install
npx skills add https://github.com/BeiBei-Clic/ai-skills --skill gsd-ui-phase-beibei-clic
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: gsd-ui-phase
Source: https://github.com/BeiBei-Clic/ai-skills/tree/main/gsd-ui-phase
Command: npx skills add https://github.com/BeiBei-Clic/ai-skills --skill gsd-ui-phase-beibei-clic

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Frontend teams often lose time when phase requirements are unclear or UI work starts without a concrete, reviewable contract. This skill generates a UI design contract (UI-SPEC.md) for a given frontend phase while preserving the project’s workflow gates.

Core Features & Use Cases

  • Phase-scoped UI-SPEC generation: Produces a UI design contract for the specified frontend phase number, using the next unplanned phase automatically when omitted.
  • Orchestrated research → verification pipeline: Coordinates UI research and then verifies the resulting UI-SPEC.md against the required gates.
  • Workflow gate preservation: Ensures the end-to-end flow validates inputs, performs research, verifies the contract, and marks completion.

Use case: When starting a new frontend phase, you can generate a contract that developers and designers can align on immediately, reducing back-and-forth and preventing UI drift.

Quick Start

Run the skill for your next frontend phase by saying: Generate the UI design contract for phase 3.

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 specification for a frontend phase to prevent ambiguous requirements?▼

A UI design contract provides a concrete, reviewable UI-SPEC.md document for a specified frontend phase. It coordinates UI research and verification to ensure developers and designers align immediately, reducing back-and-forth and preventing UI drift.

What is a UI design contract and when do I need one for frontend phase planning?▼

A UI design contract is a reviewable UI-SPEC.md document generated for a specific frontend phase. You need it when starting a new phase to preserve workflow gates, validate requirements, and prevent UI drift before development begins.

Can I automatically generate a UI-SPEC for the next unplanned frontend phase?▼

Yes, you can automatically generate a UI-SPEC by running the workflow without a specific argument. The system auto-detects the next unplanned frontend phase number and executes the research and verification pipeline to produce the contract.

How does UI research and verification work in a phased frontend workflow?▼

The workflow orchestrates UI research and verification by first coordinating research on the specified frontend phase, then verifying the resulting UI-SPEC.md against required workflow gates. This end-to-end flow validates inputs and marks completion to ensure quality.

Does generating a phase-scoped UI specification preserve existing workflow gates?▼

Yes, generating a phase-scoped UI specification preserves your project's workflow gates. The orchestrated pipeline ensures the end-to-end flow validates inputs, performs research, verifies the contract, and marks phase completion without bypassing existing checks.

Related Skills

Explore More Design & Creative Skills→
gesmith0606gesmith0606

gsd-ui-phase

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

Community
Intermediate
Pear-CommercePear-Commerce

gsd-ui-phase

Generate standardized UI-SPEC.md design contracts for GSD frontend phases.

Official
Intermediate
Poom5741Poom5741

gsd-ui-phase

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

Community
Advanced
yusaduymazyusaduymaz

gsd-ui-phase

Generate a UI design contract for a frontend phase.

Community
Advanced