skills.rest
ThiagoVitale
ThiagoVitaleCOMMUNITY
Explore all skills by this author →
GitHub

gsd-ui-phase

Generate UI design contracts for frontend development phases.

Updated May 3, 2026
Search Tags:#automation#workflow#frontend development#ui design#ui specification
One-click install
npx skills add https://github.com/ThiagoVitale/endless-crystal --skill gsd-ui-phase-thiagovitale
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: gsd-ui-phase
Source: https://github.com/ThiagoVitale/endless-crystal/tree/main/.codex/skills/gsd-ui-phase
Command: npx skills add https://github.com/ThiagoVitale/endless-crystal --skill gsd-ui-phase-thiagovitale

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires gsd-ui-researcher, gsd-ui-checker, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill automates the creation of UI design contracts (UI-SPEC.md) for frontend development phases, saving time and ensuring consistency.

Core Features & Use Cases

  • UI Design Contract Generation: Automatically generates UI design contracts for specified frontend phases.
  • Integration with gsd-ui-researcher and gsd-ui-checker: Orchestrates related tasks for validation, research, and verification.
  • Workflow Execution: Executes a predefined workflow to validate, research UI, verify UI-SPEC, and complete the phase.
  • Use Case: Use this Skill to quickly generate a UI design contract for the next phase in your frontend development project.

Quick Start

Generate the UI design contract for the frontend phase 3 with $gsd-ui-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 automate UI design contract generation for frontend development phases?▼

You can automate UI design contract generation by executing a predefined workflow that validates, researches the UI, and generates a UI-SPEC.md file for your frontend development phase. This ensures consistency and saves time across project phases.

What is a UI design contract and when do I need it for frontend workflow automation?▼

A UI design contract, outputted as a UI-SPEC.md file, defines the structural and visual specifications for a frontend phase. You need it when moving between development phases to ensure consistent UI implementation and automated validation.

Do I need gsd-ui-researcher and gsd-ui-checker to generate UI specifications?▼

Yes, gsd-ui-researcher and gsd-ui-checker are required dependencies. The workflow orchestrates these tasks to perform UI research, verify the UI-SPEC, and validate the final design contract before completing the frontend phase.

How do I generate a UI specification for a specific frontend phase using Claude Code?▼

To generate a UI specification for a specific phase, input the Claude Code syntax command with your target phase number. The workflow will parse the input, execute the research and validation tasks, and output the completed UI-SPEC.md.

What's the best way to orchestrate UI research and validation tasks in a frontend workflow?▼

The best way to orchestrate UI research and validation tasks is using an automated workflow that integrates research and checker components. This handles task orchestration and result parsing to validate, research, verify, and complete the phase sequentially.

Related Skills

Explore More Software Engineering Skills→
Poom5741Poom5741

gsd-ui-phase

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

Community
Advanced
gesmith0606gesmith0606

gsd-ui-phase

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

Community
Intermediate
cwijayasundaracwijayasundara
3

harness-core

Automate build, test, deployment, and code review in CI/CD pipelines.

Community
Advanced
electroheadfxelectroheadfx
4

gsd-ui-phase

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

Community
Advanced