gsd-ui-phase

Generate UI-SPEC.md defining interface behavior and design constraints for a frontend phase.

264|11|Updated Apr 25, 2026

Search Tags:#workflow #ui #frontend #specification #validation #design contract

Ready to run

npx skills add https://github.com/coco-research/coco --skill gsd-ui-phase-coco-research

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: gsd-ui-phase
Source: https://github.com/coco-research/coco/tree/main/systems/gsd/skills/gsd-ui-phase
Command: npx skills add https://github.com/coco-research/coco --skill gsd-ui-phase-coco-research

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill turns a frontend phase into a clear UI design contract so teams can move from planning to implementation with fewer ambiguities, fewer rework cycles, and a shared source of truth.

Core Features & Use Cases

UI-SPEC Generation: Produces a phase-specific UI-SPEC.md that defines the intended interface behavior and design constraints.
Workflow Orchestration: Coordinates the research and checking steps needed to validate the UI specification before the phase is marked complete.
Phase Planning Support: Useful when a product or engineering team needs a disciplined handoff for a new frontend phase, especially when requirements must be validated and documented consistently.

Quick Start

Ask the assistant to generate the UI design contract for the target frontend phase and verify that the resulting UI-SPEC.md follows the phase workflow.

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 generate a UI specification, provide the phase context and workflow guidance to produce a UI-SPEC.md file that defines interface behavior, design constraints, and validation steps for your frontend phase.

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

A UI design contract is a structured specification document that defines intended interface behavior for a frontend phase. You need one during planning and handoff to reduce ambiguities and create a shared source of truth for implementation.

How do I validate UI requirements before completing a frontend phase?▼

Validate UI requirements by applying workflow orchestration that coordinates research and specification checking against the generated UI-SPEC.md, ensuring all design constraints are verified before the phase workflow gates mark it complete.

Does this UI specification workflow support disciplined handoff for engineering teams?▼

Yes, the UI specification workflow supports disciplined handoff by generating a phase-specific UI-SPEC.md that documents requirements consistently, allowing product and engineering teams to move from planning to implementation with fewer rework cycles.

Can I preserve workflow gates while coordinating UI research and specification checking?▼

Yes, the specification generation process preserves workflow gates while coordinating UI research and specification checking, ensuring a complete phase outcome that validates the interface design contract before progressing.

What are the limitations of generating UI specs for frontend phases?▼

The UI spec generation focuses specifically on frontend planning and interface specification scenarios, requiring existing phase context and workflow guidance to produce a valid UI-SPEC.md, and may not cover backend or non-interface design constraints.