---
description: Create design within task constraints
argument-hint: "[task-id]"
agent: build
---

# Design: $ARGUMENTS

## Phase 0: Task Validation (MANDATORY)

### Check Task Exists

!`TASK_DIR="@backlog/tasks/$ARGUMENTS"`
!`if [ ! -d "$TASK_DIR" ]; then echo "ERROR: Task $ARGUMENTS not found. Use /task-with-spec first"; exit 1; fi`

### Load Design Constraints

!`echo "=== DESIGN CONSTRAINTS ==="`
!`grep -A 10 "Scope:" "$TASK_DIR/prd.md"`
!`grep -A 15 "Constraints:" "$TASK_DIR/spec.md"`
!`grep -A 10 "Testing Notes:" "$TASK_DIR/spec.md"`

## Phase 1: Constrained Design Planning

### Extract Design Requirements from Task

**From PRD:**

- User flow: $(grep -A 10 "User Flow:" "$TASK_DIR/prd.md")
- Success criteria: $(grep -A 10 "Success Criteria" "$TASK_DIR/prd.md")

**From Spec:**

- UI constraints: $(grep -A 5 "Naming Conventions:" "$TASK_DIR/spec.md")
- Framework requirements: $(grep -A 5 "Framework Requirements:" "$TASK_DIR/spec.md")
- Testing approach: $(grep -A 5 "Testing Notes:" "$TASK_DIR/spec.md")

### Design Boundaries (From Task)

- **Allowed elements:** [From PRD scope]
- **Forbidden patterns:** [From spec constraints]
- **Required components:** [From user flow]
- **Success metrics:** [From success criteria]

## Phase 2: Constraint-Based Design

### Design Within Task Specifications

```
@build Create design for task $ARGUMENTS

ANTI-HALLUCINATION DESIGN REQUIREMENTS:
1. Read $TASK_DIR/prd.md and $TASK_DIR/spec.md FIRST
2. Follow user flow from PRD exactly
3. Respect all constraints from spec
4. Use only allowed frameworks/libraries from spec
5. Design only components needed for success criteria
6. Stop if any constraint violation detected
7. Complete $TASK_DIR/review.md after work
8. Mark success criteria as completed

DESIGN BOUNDARIES:
- Scope: [From PRD scope section]
- Constraints: [From spec constraints section]
- User Flow: [From PRD user flow]
- Success Criteria: [From PRD success criteria]

NO EXCEPTIONS: Design must serve task requirements only
```

### Design Validation (Task-Aligned)

- [ ] Follows PRD user flow exactly
- [ ] Respects all spec constraints
- [ ] Uses only allowed frameworks
- [ ] Meets all success criteria
- [ ] Passes spec testing requirements

## Phase 3: Quality Assurance

### Design Review (Within Constraints)

```
session({
  mode: "message",
  agent: "code-auditor",
  text: "Review design for task $ARGUMENTS compliance with PRD+spec constraints"
})
```

### Design Validation:

- **Scope compliance:** Design stays within PRD boundaries
- **Constraint adherence:** All spec constraints followed
- **User flow accuracy:** PRD user flow implemented
- **Success criteria:** All criteria achievable through design

## Phase 4: Task Completion

### Update Design Documentation

!`if [ ! -f ".opencode/memory/design-guidelines.md" ]; then touch .opencode/memory/design-guidelines.md; fi`
!`echo "# Design Guidelines Update - $(date '+%Y-%m-%d')" >> .opencode/memory/design-guidelines.md`
!`echo "Task: $ARGUMENTS" >> .opencode/memory/design-guidelines.md`
!`echo "Constraints: $TASK_DIR/spec.md" >> .opencode/memory/design-guidelines.md`

### Complete Task

!`/complete-task $ARGUMENTS`

---

**ANTI-HALLUCINATION: Design must serve task constraints, not creative exploration**
