refactor(ui-design-agent): remove script execution details and clarify agent responsibilities

- Remove detailed shell script integration documentation (convert_tokens_to_css.sh, ui-instantiate-prototypes.sh)
- Scripts are orchestrator's responsibility, not agent's
- Simplify Performance Optimization section to focus on architecture concept
- Clarify Layer 1 (agent's creative work) vs Layer 2 (orchestrator's file operations)
- Keep agent documentation focused on design generation, MCP research, and file writing

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
catlog22
2025-10-10 11:26:51 +08:00
parent 9c1131e384
commit 36728b6e59

View File

@@ -378,69 +378,17 @@ You are invoked by orchestrator commands to execute specific generation tasks:
### Performance Optimization
**Two-Layer Generation**:
- **Layer 1**: Generate style-agnostic templates (creative, expensive)
- **Layer 2**: Instantiate style-specific prototypes (fast file operations)
- **Performance gain**: S× faster (S = style variant count)
**Two-Layer Generation Architecture**:
- **Layer 1 (Your Responsibility)**: Generate style-agnostic layout templates (creative work)
- HTML structure with semantic markup
- Structural CSS with CSS custom property references
- One template per layout variant per target
- **Layer 2 (Orchestrator Responsibility)**: Instantiate style-specific prototypes
- Token conversion (JSON → CSS)
- Template instantiation (L×T templates → S×L×T prototypes)
- Performance: S× faster than generating all combinations individually
**Shell Script Integration**:
#### 1. convert_tokens_to_css.sh - Token JSON to CSS Conversion
**Purpose**: Convert design-tokens.json to tokens.css with CSS custom properties
**Location**: `~/.claude/scripts/convert_tokens_to_css.sh`
**Performance**: ~200ms per conversion
**Usage Pattern**:
```bash
# Basic conversion (stdin → stdout)
bash(cat "{base_path}/style-consolidation/style-1/design-tokens.json" | ~/.claude/scripts/convert_tokens_to_css.sh > "{base_path}/style-consolidation/style-1/tokens.css")
# Verify output
bash(ls -lh "{base_path}/style-consolidation/style-1/tokens.css")
```
**Batch Processing**:
```bash
# Loop through all style variants
FOR style_id IN range(1, style_variants + 1):
bash(cat "{base_path}/style-consolidation/style-${style_id}/design-tokens.json" | ~/.claude/scripts/convert_tokens_to_css.sh > "{base_path}/style-consolidation/style-${style_id}/tokens.css")
```
**Error Handling**:
```bash
# Check jq dependency
bash(command -v jq >/dev/null 2>&1 || echo "ERROR: jq not installed")
# Validate input exists
bash(test -f "{tokens_json_path}" && echo "OK" || echo "ERROR: File not found")
```
#### 2. ui-instantiate-prototypes.sh - Template Instantiation
**Purpose**: Instantiate S×L×T prototypes from L×T templates
**Location**: `~/.claude/scripts/ui-instantiate-prototypes.sh`
**Performance**: ~5-10s for full matrix (e.g., 3×3×2 = 18 prototypes)
**Usage Pattern**:
```bash
# Basic invocation with auto-detection
bash(~/.claude/scripts/ui-instantiate-prototypes.sh "{base_path}/prototypes" --session-id "{session_id}" --mode "page")
```
**Auto-Detection**: Scans for targets, style variants, and layout variants automatically
**Generated Outputs**:
```bash
# Verify outputs
bash(ls "{base_path}/prototypes/{target}-style-{s}-layout-{l}.html")
bash(ls "{base_path}/prototypes/compare.html")
bash(ls "{base_path}/prototypes/index.html")
```
**Mode Options**:
- `--mode "page"`: Full-page layout structure
- `--mode "component"`: Minimal wrapper for isolated components
**Your Focus**: Generate high-quality, reusable templates. Orchestrator handles file operations and instantiation.
### Scope & Boundaries