skills.rest
deerawan
deerawanCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

gsd-ui-phase

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

1|Updated Sep 6, 2015
Search Tags:#frontend#ui-verification#phase-planning#ui-spec#design-contract#workflow-gates#ui-research
One-click install
npx skills add https://github.com/deerawan/dotfiles --skill gsd-ui-phase-deerawan
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: gsd-ui-phase
Source: https://github.com/deerawan/dotfiles/tree/main/claude/skills/gsd-ui-phase
Command: npx skills add https://github.com/deerawan/dotfiles --skill gsd-ui-phase-deerawan

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

It helps you produce a consistent UI design contract for a specific frontend phase, reducing back-and-forth between product, design, and engineering.

Core Features & Use Cases

  • Phase-based UI contract generation: Generates a UI-SPEC.md aligned to the requested phase number and the workflow’s gate checks.
  • Orchestrated research and verification: Coordinates a research step and a checker step to validate the resulting UI-SPEC.md before completion.
  • Workflow-gated end-to-end flow: Ensures the process follows the validate → research UI → verify UI-SPEC → done sequence.

Quick Start

Ask the assistant to run the gsd-ui-phase skill for phase 2 so it generates the UI-SPEC.md for that frontend phase with all workflow gates preserved.

Frequently Asked Questions about gsd-ui-phase

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

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

A UI design contract for frontend phases is a UI-SPEC.md document that defines phase-specific UI behavior, branding alignment, and gatekeeping checks to maintain consistency across product, design, and engineering iterations.

What is the best way to ensure frontend UI specifications pass workflow gates?▼

The best way to ensure UI specifications pass workflow gates is to follow an orchestrated validate, research UI, and verify UI-SPEC sequence before completion, ensuring all phase-based planning checks are met.

Can I generate a UI-SPEC contract without running the UI research and verification steps?▼

Generating a UI-SPEC contract requires running both the UI research and verification steps. The workflow mandates a validate, research, and verify sequence to ensure the resulting UI-SPEC.md passes all gatekeeping checks before completion.

How do I maintain frontend branding alignment across multiple UI iterations?▼

You maintain branding alignment across iterations by generating a phase-based UI-SPEC.md contract that enforces validation, UI research, and gatekeeping checks, ensuring consistent frontend behavior throughout the workflow.

When do I need a phase-based UI-SPEC contract for frontend planning?▼

You need a phase-based UI-SPEC contract when frontend planning requires preserving specific UI behavior, branding alignment, and workflow gate checks across iterations to reduce back-and-forth between product, design, and engineering teams.

Related Skills

Explore More Design & Creative Skills→
onelee85onelee85

gsd-new-milestone

Plan and initialize a new milestone cycle by updating planning files and routing to requirements.

Community
Advanced
MINT-IAMINT-IA

gsd-ui-phase

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

Official
Intermediate
yusaduymazyusaduymaz

gsd-ui-phase

Generate a UI design contract for a frontend phase.

Community
Advanced
electroheadfxelectroheadfx
4

gsd-ui-phase

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

Community
Advanced