Task Breakdown
Language Configuration
Before generating any content, check aico.json in project root for language field to determine the output language. If not set, default to English.
Process
- •Read story/PRD: Load from
docs/reference/pm/stories/ordocs/reference/pm/versions/ - •Read design (if exists): Load from
docs/reference/frontend/designs/ - •Identify components: What UI elements are needed
- •Identify interactions: What logic and events are needed
- •Break into tasks: Independently testable, single responsibility
- •Order by dependencies: Setup → Static UI → Dynamic → Tests
- •Save output: ALWAYS write to
docs/reference/frontend/tasks/{story-name}.md
Task File Template
markdown
# [Story Name] - Frontend Tasks
> Project: [project-name]
> Created: YYYY-MM-DD
> Last Updated: YYYY-MM-DD
> Source: docs/reference/pm/stories/[story].md
> Design: docs/reference/frontend/designs/[name].md
> Status: in_progress
## Progress
| Task | Status | Notes |
| ---------------------------- | -------------- | ----- |
| 1. Setup component structure | ✅ completed | |
| 2. Implement header section | 🔄 in_progress | |
| 3. Implement content section | ⏳ pending | |
## Tasks
### Task 1: [Task Name]
**Status**: ⏳ pending
**Goal**: What this task achieves
**Scope**: Files to create/modify
**Acceptance Criteria**:
- [ ] Criterion 1
- [ ] Criterion 2
**Dependencies**: Task X (if any)
Task Types
| Type | Examples |
|---|---|
| Setup | Create component structure, setup state |
| UI | Implement section/component layout |
| Logic | Add form validation, API integration |
| Interaction | Implement hover, click, animations |
| Testing | Unit tests, integration tests |
Granularity Rules
- •Each task = independently testable
- •Each task = single responsibility
- •Each task = clear scope (not too big, not too small)
Ordering Rules
- •Setup tasks first
- •Static UI before dynamic
- •Core functionality before edge cases
- •Tests after implementation
Key Rules
- •ALWAYS include test tasks at the end
- •MUST note dependencies between tasks
- •ALWAYS save to
docs/reference/frontend/tasks/directory - •Keep tasks focused - not too big, not too small
Common Mistakes
- •❌ Tasks too large (full page) → ✅ Break into sections
- •❌ Tasks too small (add one button) → ✅ Group related work
- •❌ Skip dependencies → ✅ Note which tasks depend on others
- •❌ Forget testing → ✅ Always include test tasks