Claude-Code-Workflow team-ux-improve

Unified team skill for UX improvement. Systematically discovers and fixes UI/UX interaction issues including unresponsive buttons, missing feedback, and state refresh problems. Uses team-worker agent architecture with roles/ for domain logic. Coordinator orchestrates pipeline, workers are team-worker agents. Triggers on "team ux improve".

install
source · Clone the upstream repo
git clone https://github.com/catlog22/Claude-Code-Workflow
Claude Code · Install into ~/.claude/skills/
T=$(mktemp -d) && git clone --depth=1 https://github.com/catlog22/Claude-Code-Workflow "$T" && mkdir -p ~/.claude/skills && cp -r "$T/.codex/skills/team-ux-improve" ~/.claude/skills/catlog22-claude-code-workflow-team-ux-improve-4a09a8 && rm -rf "$T"
manifest: .codex/skills/team-ux-improve/SKILL.md
source content

Team UX Improve

Systematic UX improvement pipeline: scan -> diagnose -> design -> implement -> test. Built on team-worker agent architecture — all worker roles share a single agent definition with role-specific Phase 2-4 loaded from

roles/<role>/role.md
.

Architecture

Skill(skill="team-ux-improve", args="<project-path> [--framework react|vue]")
                    |
         SKILL.md (this file) = Router
                    |
     +--------------+--------------+
     |                             |
  no --role flag              --role <name>
     |                             |
  Coordinator                  Worker
  roles/coordinator/role.md    roles/<name>/role.md
     |
     +-- analyze → dispatch → spawn workers → STOP
                                    |
                    +-------+-------+-------+-------+
                    v       v       v       v       v
           [team-worker agents, each loads roles/<role>/role.md]
          scanner  diagnoser  designer  implementer  tester

Role Registry

RolePathPrefixInner Loop
coordinatorroles/coordinator/role.md
scannerroles/scanner/role.mdSCAN-*false
diagnoserroles/diagnoser/role.mdDIAG-*false
designerroles/designer/role.mdDESIGN-*false
implementerroles/implementer/role.mdIMPL-*true
testerroles/tester/role.mdTEST-*false

Utility Member Registry

Coordinator-only: Utility members can only be spawned by Coordinator. Workers CANNOT call spawn_agent() to spawn utility members.

Utility MemberPathCallable ByPurpose
explorerroles/explorer/role.mdCoordinator onlyExplore codebase for UI component patterns and framework-specific patterns

Role Router

Parse

$ARGUMENTS
:

  • Has
    --role <name>
    → Read
    roles/<name>/role.md
    , execute Phase 2-4
  • No
    --role
    roles/coordinator/role.md
    , execute entry router

Delegation Lock

Coordinator is a PURE ORCHESTRATOR. It coordinates, it does NOT do.

Before calling ANY tool, apply this check:

Tool CallVerdictReason
spawn_agent
,
wait_agent
,
close_agent
,
send_message
,
followup_task
ALLOWEDOrchestration
list_agents
ALLOWEDAgent health check
request_user_input
ALLOWEDUser interaction
mcp__ccw-tools__team_msg
ALLOWEDMessage bus
Read/Write
on
.workflow/.team/
files
ALLOWEDSession state
Read
on
roles/
,
commands/
,
specs/
ALLOWEDLoading own instructions
Read/Grep/Glob
on project source code
BLOCKEDDelegate to worker
Edit
on any file outside
.workflow/
BLOCKEDDelegate to worker
Bash("ccw cli ...")
BLOCKEDOnly workers call CLI
Bash
running build/test/lint commands
BLOCKEDDelegate to worker

If a tool call is BLOCKED: STOP. Create a task, spawn a worker.

No exceptions for "simple" tasks. Even a single-file read-and-report MUST go through spawn_agent.


Shared Constants

  • Session prefix:
    ux-improve
  • Session path:
    .workflow/.team/ux-improve-<timestamp>/
  • CLI tools:
    ccw cli --mode analysis
    (read-only),
    ccw cli --mode write
    (modifications)
  • Message bus:
    mcp__ccw-tools__team_msg(session_id=<session-id>, ...)
  • Max test iterations: 5

Worker Spawn Template

Coordinator spawns workers using this template:

spawn_agent({
  agent_type: "team_worker",
  task_name: "<task-id>",
  fork_turns: "none",
  message: `## Role Assignment
role: <role>
role_spec: <skill_root>/roles/<role>/role.md
session: <session-folder>
session_id: <session-id>
requirement: <task-description>
inner_loop: <true|false>

Read role_spec file (<skill_root>/roles/<role>/role.md) to load Phase 2-4 domain instructions.

## Task Context
task_id: <task-id>
title: <task-title>
description: <task-description>
pipeline_phase: <pipeline-phase>

## Upstream Context
<prev_context>`
})

After spawning, use

wait_agent({ timeout_ms: 1800000 })
to collect results. If
result.timed_out
, send STATUS_CHECK via followup_task (wait 3 min), then FINALIZE with interrupt (wait 3 min), then mark timed_out and close agents. Use
close_agent({ target })
each worker.

Model Selection Guide

UX improvement has an explorer utility member and a scan-diagnose-design-implement-test pipeline.

Rolereasoning_effortRationale
explorerlowFile reading and pattern summarization only (utility member)
scannermediumBroad UI/UX issue scanning, pattern-based detection
diagnoserhighRoot cause diagnosis of UX issues requires deep analysis
designerhighUX improvement design needs careful user experience reasoning
implementerhighUI code changes must preserve existing behavior
testermediumTest execution follows defined UX verification criteria

User Commands

CommandAction
check
/
status
View execution status graph
resume
/
continue
Advance to next step

Specs Reference

Session Directory

.workflow/.team/ux-improve-<timestamp>/
├── .msg/
│   ├── messages.jsonl      # Team message bus
│   └── meta.json           # Pipeline config + role state snapshot
├── artifacts/              # Role deliverables
│   ├── scan-report.md      # Scanner output
│   ├── diagnosis.md        # Diagnoser output
│   ├── design-guide.md     # Designer output
│   ├── fixes/              # Implementer output
│   └── test-report.md      # Tester output
├── explorations/           # Explorer cache
│   └── cache-index.json
└── wisdom/                 # Session knowledge base
    ├── contributions/      # Worker contributions (write-only for workers)
    ├── principles/
    ├── patterns/
    └── anti-patterns/

v4 Agent Coordination

Message Semantics

IntentAPIExample
Queue supplementary info (don't interrupt)
send_message
Send explorer findings to running scanner
Assign implementation from design
followup_task
Assign IMPL task from designer output
Check running agents
list_agents
Verify agent health during resume

Agent Health Check

Use

list_agents({})
in handleResume and handleComplete:

// Reconcile session state with actual running agents
const running = list_agents({})
// Compare with meta.json active tasks
// Reset orphaned tasks (in_progress but agent gone) to pending

Named Agent Targeting

Workers are spawned with

task_name: "<task-id>"
enabling direct addressing:

  • send_message({ target: "SCAN-001", message: "..." })
    -- send explorer findings to scanner
  • followup_task({ target: "IMPL-001", message: "..." })
    -- assign UX fix from designer output
  • close_agent({ target: "TEST-001" })
    -- cleanup after UX testing

Explorer-Assisted Scanning

Coordinator spawns explorer (utility member) early to gather codebase context, then sends findings to scanner via upstream context:

// Explorer results inform scanner's scope
send_message({
  target: "SCAN-001",
  message: `## Explorer Findings
component_patterns: <explorer's component inventory>
framework: <detected framework>
ui_library: <detected UI library>`
})

Error Handling

ScenarioResolution
Unknown commandError with available command list
Role not foundError with role registry
Project path invalidRe-prompt user for valid path
Framework detection failsrequest_user_input for framework selection
Session corruptionAttempt recovery, fallback to manual
Fast-advance conflictCoordinator reconciles on next callback
No UI issues foundComplete with empty fix list, generate clean bill report
Test iterations exceededAccept current state, continue to completion