team-ui

Orchestrate UI production from UX spec through implementation with approval gates.

72|7|Updated Apr 29, 2026
One-click install
npx skills add https://github.com/striderZA/OpenCodeGameStudios --skill team-ui-striderza
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: team-ui
Source: https://github.com/striderZA/OpenCodeGameStudios/tree/main/.opencode/skills/team-ui
Command: npx skills add https://github.com/striderZA/OpenCodeGameStudios --skill team-ui-striderza

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill eliminates stalled or inconsistent UI development by orchestrating a full UX-to-implementation pipeline with explicit phase gates and coordinated sub-agents.

Core Features & Use Cases

  • UX spec authoring with templates: Produces design/ux/[feature-name].md using the ux-spec.md template (or hud-design.md for HUD work).
  • Structured review with user approval gates: Runs /ux-review and requires an APPROVED verdict before proceeding to implementation.
  • Visual design + engine-ready implementation: Produces visual design guidance aligned to the art bible, then adds engine-specific implementation notes before delegating to ui-programmer.
  • Accessibility and interaction pattern governance: Enforces committed accessibility requirements and ensures UI behavior reuses (or updates) design/ux/interaction-patterns.md rather than inventing new patterns.
  • Parallel reviews and polish: Executes parallel review streams (UX, art, accessibility) and applies polish including motion-skip and audio event-system compliance.

Quick Start

Use /team-ui to generate and implement a complete UI feature by running: /team-ui "inventory screen".

Frequently Asked Questions about team-ui

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

FAQPage Schema
How do I manage a UI production pipeline from UX spec to engine implementation?

A UI production pipeline can be managed by orchestrating phases from UX specification through visual design, engine-aware implementation, review gates, and polish to ensure reliable end-to-end UI feature delivery.

How do I enforce interaction pattern reuse and accessibility requirements in UI development?

Enforcing interaction pattern reuse and accessibility requirements involves governance checks that validate UI behavior against an existing interaction pattern library and committed accessibility standards before implementation proceeds.

What is the best way to coordinate UX reviews and visual design for new HUD features?

Coordinating UX reviews and visual design for HUD features requires structured review gates with user approval, running parallel streams for UX, art, and accessibility before applying final polish.

Does this UI implementation approach support engine-specific guidance and localization-safe text?

Engine-specific UI guidance and localization-safe UI text are supported by generating implementation notes that align with engine requirements and delegate input-method support to sub-agents.

Why does UI development stall when building interaction-heavy flows?

UI development stalls when interaction-heavy flows lack explicit phase-gated decision points and coordinated sub-agents, causing inconsistent behavior and bypassing interaction pattern library updates.

Can I build a complete inventory screen UI without manually coordinating sub-agents?

Building a complete inventory screen UI without manual sub-agent coordination is possible by running a single command that orchestrates the entire UX-to-implementation pipeline with delegated roles and approval gates.