opencodekit 0.3.3 → 0.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +1 -1
- package/dist/template/.opencode/agent/vision.md +95 -60
- package/dist/template/.opencode/command/accessibility-check.md +66 -0
- package/dist/template/.opencode/command/analyze-mockup.md +43 -0
- package/dist/template/.opencode/command/design-audit.md +53 -0
- package/dist/template/.opencode/command/edit-image.md +40 -0
- package/dist/template/.opencode/command/generate-diagram.md +48 -0
- package/dist/template/.opencode/command/generate-icon.md +40 -0
- package/dist/template/.opencode/command/generate-image.md +27 -0
- package/dist/template/.opencode/command/generate-pattern.md +41 -0
- package/dist/template/.opencode/command/generate-storyboard.md +41 -0
- package/dist/template/.opencode/command/new-feature.md +137 -0
- package/dist/template/.opencode/command/research-ui.md +34 -27
- package/dist/template/.opencode/command/restore-image.md +39 -0
- package/dist/template/.opencode/command/revert-feature.md +127 -0
- package/dist/template/.opencode/command/setup-project.md +152 -0
- package/dist/template/.opencode/command/ui-review.md +26 -34
- package/dist/template/.opencode/memory/project/README.md +28 -0
- package/dist/template/.opencode/opencode.json +470 -457
- package/dist/template/.opencode/package.json +1 -1
- package/dist/template/.opencode/skills/accessibility-audit/SKILL.md +180 -0
- package/dist/template/.opencode/skills/design-system-audit/SKILL.md +141 -0
- package/dist/template/.opencode/skills/frontend-aesthetics/SKILL.md +40 -65
- package/dist/template/.opencode/skills/mockup-to-code/SKILL.md +158 -0
- package/dist/template/.opencode/skills/ui-ux-research/SKILL.md +60 -131
- package/dist/template/.opencode/skills/visual-analysis/SKILL.md +130 -0
- package/package.json +1 -1
|
@@ -0,0 +1,137 @@
|
|
|
1
|
+
---
|
|
2
|
+
description: Create a new feature with bead, spec, and plan
|
|
3
|
+
argument-hint: "<feature-name> [--priority=high|medium|low] [--type=feature|bug|refactor]"
|
|
4
|
+
agent: planner
|
|
5
|
+
model: proxypal/gemini-3-flash-preview
|
|
6
|
+
---
|
|
7
|
+
|
|
8
|
+
# New Feature: $ARGUMENTS
|
|
9
|
+
|
|
10
|
+
Create a complete feature track with bead, specification, and implementation plan.
|
|
11
|
+
|
|
12
|
+
## Instructions
|
|
13
|
+
|
|
14
|
+
Parse from `$ARGUMENTS`:
|
|
15
|
+
|
|
16
|
+
- Feature name (required)
|
|
17
|
+
- Priority (default: medium)
|
|
18
|
+
- Type (default: feature)
|
|
19
|
+
|
|
20
|
+
## Workflow
|
|
21
|
+
|
|
22
|
+
### Step 1: Create Bead
|
|
23
|
+
|
|
24
|
+
```bash
|
|
25
|
+
bd new [type] "[feature-name]" --priority [priority]
|
|
26
|
+
```
|
|
27
|
+
|
|
28
|
+
Capture the bead ID from output.
|
|
29
|
+
|
|
30
|
+
### Step 2: Create Specification
|
|
31
|
+
|
|
32
|
+
Create `.beads/[bead-id]/spec.md`:
|
|
33
|
+
|
|
34
|
+
```markdown
|
|
35
|
+
# [Feature Name] Specification
|
|
36
|
+
|
|
37
|
+
## Overview
|
|
38
|
+
|
|
39
|
+
[Brief description of the feature]
|
|
40
|
+
|
|
41
|
+
## Problem Statement
|
|
42
|
+
|
|
43
|
+
[What problem does this solve?]
|
|
44
|
+
|
|
45
|
+
## User Stories
|
|
46
|
+
|
|
47
|
+
- As a [user], I want [goal], so that [benefit]
|
|
48
|
+
|
|
49
|
+
## Acceptance Criteria
|
|
50
|
+
|
|
51
|
+
- [ ] [Criterion 1]
|
|
52
|
+
- [ ] [Criterion 2]
|
|
53
|
+
- [ ] [Criterion 3]
|
|
54
|
+
|
|
55
|
+
## Technical Considerations
|
|
56
|
+
|
|
57
|
+
- [Consideration 1]
|
|
58
|
+
- [Consideration 2]
|
|
59
|
+
|
|
60
|
+
## Out of Scope
|
|
61
|
+
|
|
62
|
+
- [What we're NOT doing]
|
|
63
|
+
|
|
64
|
+
## Dependencies
|
|
65
|
+
|
|
66
|
+
- [Other features/systems this depends on]
|
|
67
|
+
```
|
|
68
|
+
|
|
69
|
+
### Step 3: Create Plan
|
|
70
|
+
|
|
71
|
+
Create `.beads/[bead-id]/plan.md`:
|
|
72
|
+
|
|
73
|
+
```markdown
|
|
74
|
+
# [Feature Name] Implementation Plan
|
|
75
|
+
|
|
76
|
+
## Phases
|
|
77
|
+
|
|
78
|
+
### Phase 1: [Name]
|
|
79
|
+
|
|
80
|
+
**Estimate:** [X hours]
|
|
81
|
+
|
|
82
|
+
Tasks:
|
|
83
|
+
|
|
84
|
+
1. [ ] [Task 1]
|
|
85
|
+
2. [ ] [Task 2]
|
|
86
|
+
|
|
87
|
+
### Phase 2: [Name]
|
|
88
|
+
|
|
89
|
+
**Estimate:** [X hours]
|
|
90
|
+
|
|
91
|
+
Tasks:
|
|
92
|
+
|
|
93
|
+
1. [ ] [Task 1]
|
|
94
|
+
2. [ ] [Task 2]
|
|
95
|
+
|
|
96
|
+
## Testing Strategy
|
|
97
|
+
|
|
98
|
+
- [ ] Unit tests for [what]
|
|
99
|
+
- [ ] Integration tests for [what]
|
|
100
|
+
|
|
101
|
+
## Rollout Plan
|
|
102
|
+
|
|
103
|
+
1. [Step 1]
|
|
104
|
+
2. [Step 2]
|
|
105
|
+
|
|
106
|
+
## Rollback Plan
|
|
107
|
+
|
|
108
|
+
[How to revert if needed]
|
|
109
|
+
```
|
|
110
|
+
|
|
111
|
+
### Step 4: Update Bead
|
|
112
|
+
|
|
113
|
+
```bash
|
|
114
|
+
bd update [bead-id] --status planning
|
|
115
|
+
```
|
|
116
|
+
|
|
117
|
+
## Output
|
|
118
|
+
|
|
119
|
+
Report:
|
|
120
|
+
|
|
121
|
+
- Bead ID created
|
|
122
|
+
- Spec file path
|
|
123
|
+
- Plan file path
|
|
124
|
+
- Next command to run: `/implement [bead-id]`
|
|
125
|
+
|
|
126
|
+
## Follow-up Commands
|
|
127
|
+
|
|
128
|
+
```bash
|
|
129
|
+
# View the feature
|
|
130
|
+
bd show [bead-id]
|
|
131
|
+
|
|
132
|
+
# Start implementation
|
|
133
|
+
/implement [bead-id]
|
|
134
|
+
|
|
135
|
+
# Check status
|
|
136
|
+
/status [bead-id]
|
|
137
|
+
```
|
|
@@ -1,48 +1,55 @@
|
|
|
1
1
|
---
|
|
2
|
-
description:
|
|
3
|
-
argument-hint: "[bead-id]
|
|
2
|
+
description: Research UI/UX patterns across codebase or topic
|
|
3
|
+
argument-hint: "<topic-or-path> [bead-id]"
|
|
4
4
|
agent: vision
|
|
5
|
+
model: proxypal/gemini-3-flash-preview
|
|
5
6
|
---
|
|
6
7
|
|
|
7
8
|
# Research UI: $ARGUMENTS
|
|
8
9
|
|
|
9
|
-
use_skill("gemini-large-context")
|
|
10
10
|
use_skill("ui-ux-research")
|
|
11
11
|
|
|
12
|
-
|
|
12
|
+
Research UI/UX patterns, implementations, or design topics.
|
|
13
13
|
|
|
14
|
-
|
|
14
|
+
## Instructions
|
|
15
15
|
|
|
16
|
-
|
|
16
|
+
Parse research topic/path and optional bead ID from `$ARGUMENTS`.
|
|
17
17
|
|
|
18
|
-
|
|
18
|
+
## Research Approach
|
|
19
19
|
|
|
20
|
-
|
|
20
|
+
For **codebase paths**:
|
|
21
21
|
|
|
22
|
-
|
|
22
|
+
- Scan component and style directories
|
|
23
|
+
- Identify current patterns and implementations
|
|
24
|
+
- Assess consistency across files
|
|
25
|
+
- Find improvement opportunities
|
|
23
26
|
|
|
24
|
-
For
|
|
27
|
+
For **topics**:
|
|
25
28
|
|
|
26
|
-
|
|
29
|
+
- Research best practices
|
|
30
|
+
- Find relevant examples
|
|
31
|
+
- Compare approaches
|
|
32
|
+
- Recommend implementation
|
|
27
33
|
|
|
28
|
-
|
|
34
|
+
## Common Topics
|
|
29
35
|
|
|
30
|
-
|
|
36
|
+
- Design system consistency
|
|
37
|
+
- Component inventory
|
|
38
|
+
- Typography usage
|
|
39
|
+
- Color token patterns
|
|
40
|
+
- Animation/motion usage
|
|
41
|
+
- Responsive patterns
|
|
42
|
+
- Accessibility compliance
|
|
31
43
|
|
|
32
|
-
|
|
33
|
-
# Save to .beads/artifacts/<bead-id>/research-ui.md
|
|
34
|
-
bd edit <bead-id> --note "UI research completed: <key findings summary>"
|
|
35
|
-
```
|
|
36
|
-
|
|
37
|
-
### Without Bead ID
|
|
38
|
-
|
|
39
|
-
Save to memory for general reference:
|
|
40
|
-
`.opencode/memory/research/YYYY-MM-DD-<topic>.md`
|
|
41
|
-
|
|
42
|
-
## Common Research Topics
|
|
44
|
+
## Output
|
|
43
45
|
|
|
44
|
-
|
|
46
|
+
Provide:
|
|
45
47
|
|
|
46
|
-
|
|
48
|
+
1. Research summary
|
|
49
|
+
2. Key findings
|
|
50
|
+
3. Specific recommendations
|
|
51
|
+
4. Code examples where helpful
|
|
52
|
+
5. Next steps
|
|
47
53
|
|
|
48
|
-
|
|
54
|
+
If bead ID provided, save findings to bead artifacts.
|
|
55
|
+
Otherwise, save to `.opencode/memory/design/research/`.
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
---
|
|
2
|
+
description: Restore, enhance, or upscale images
|
|
3
|
+
argument-hint: "<image-path> [mode: enhance|upscale|restore|denoise]"
|
|
4
|
+
agent: vision
|
|
5
|
+
model: proxypal/gemini-3-pro-image-preview
|
|
6
|
+
---
|
|
7
|
+
|
|
8
|
+
# Restore Image: $ARGUMENTS
|
|
9
|
+
|
|
10
|
+
Restore, enhance, or improve image quality.
|
|
11
|
+
|
|
12
|
+
## Instructions
|
|
13
|
+
|
|
14
|
+
Parse from `$ARGUMENTS`:
|
|
15
|
+
|
|
16
|
+
- Image path
|
|
17
|
+
- Mode (default: enhance)
|
|
18
|
+
|
|
19
|
+
## Modes
|
|
20
|
+
|
|
21
|
+
- **enhance**: Improve overall quality, colors, sharpness
|
|
22
|
+
- **upscale**: Increase resolution
|
|
23
|
+
- **restore**: Fix artifacts, compression, damage
|
|
24
|
+
- **denoise**: Remove noise while preserving detail
|
|
25
|
+
|
|
26
|
+
## Process
|
|
27
|
+
|
|
28
|
+
1. Analyze image quality issues
|
|
29
|
+
2. Apply appropriate restoration
|
|
30
|
+
3. Save to `.opencode/memory/design/restored/`
|
|
31
|
+
|
|
32
|
+
## Output
|
|
33
|
+
|
|
34
|
+
Report:
|
|
35
|
+
|
|
36
|
+
- Issues detected
|
|
37
|
+
- Improvements applied
|
|
38
|
+
- Before/after comparison notes
|
|
39
|
+
- Output path
|
|
@@ -0,0 +1,127 @@
|
|
|
1
|
+
---
|
|
2
|
+
description: Smart git-aware revert for a bead/feature
|
|
3
|
+
argument-hint: "<bead-id> [--phase=N] [--task=N] [--soft]"
|
|
4
|
+
agent: build
|
|
5
|
+
model: proxypal/gemini-3-flash-preview
|
|
6
|
+
---
|
|
7
|
+
|
|
8
|
+
# Revert Feature: $ARGUMENTS
|
|
9
|
+
|
|
10
|
+
Intelligently revert changes for a bead with git awareness.
|
|
11
|
+
|
|
12
|
+
## Instructions
|
|
13
|
+
|
|
14
|
+
Parse from `$ARGUMENTS`:
|
|
15
|
+
|
|
16
|
+
- Bead ID (required)
|
|
17
|
+
- `--phase=N`: Revert only specific phase
|
|
18
|
+
- `--task=N`: Revert only specific task
|
|
19
|
+
- `--soft`: Stage reverts without committing
|
|
20
|
+
|
|
21
|
+
## Workflow
|
|
22
|
+
|
|
23
|
+
### Step 1: Analyze Bead History
|
|
24
|
+
|
|
25
|
+
```bash
|
|
26
|
+
bd show [bead-id] --history
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
Identify:
|
|
30
|
+
|
|
31
|
+
- All commits associated with this bead
|
|
32
|
+
- Files changed per phase/task
|
|
33
|
+
- Current phase and task
|
|
34
|
+
|
|
35
|
+
### Step 2: Determine Revert Scope
|
|
36
|
+
|
|
37
|
+
**Full revert (no flags):**
|
|
38
|
+
|
|
39
|
+
- All commits for this bead
|
|
40
|
+
- Reset bead status to initial
|
|
41
|
+
|
|
42
|
+
**Phase revert (--phase=N):**
|
|
43
|
+
|
|
44
|
+
- Only commits tagged with phase N
|
|
45
|
+
- Reset bead to previous phase
|
|
46
|
+
|
|
47
|
+
**Task revert (--task=N):**
|
|
48
|
+
|
|
49
|
+
- Only commits for specific task
|
|
50
|
+
- Keep bead in current phase
|
|
51
|
+
|
|
52
|
+
### Step 3: Git Analysis
|
|
53
|
+
|
|
54
|
+
```bash
|
|
55
|
+
# Find commits for this bead
|
|
56
|
+
git log --oneline --all --grep="[bead-id]"
|
|
57
|
+
|
|
58
|
+
# Show files that would be affected
|
|
59
|
+
git diff --stat [commit-range]
|
|
60
|
+
```
|
|
61
|
+
|
|
62
|
+
Present:
|
|
63
|
+
|
|
64
|
+
- Commits to revert
|
|
65
|
+
- Files affected
|
|
66
|
+
- Potential conflicts
|
|
67
|
+
|
|
68
|
+
### Step 4: Confirm and Execute
|
|
69
|
+
|
|
70
|
+
Ask for confirmation before reverting.
|
|
71
|
+
|
|
72
|
+
**Hard revert (default):**
|
|
73
|
+
|
|
74
|
+
```bash
|
|
75
|
+
git revert --no-commit [commits...]
|
|
76
|
+
git commit -m "revert: [bead-id] [scope]"
|
|
77
|
+
```
|
|
78
|
+
|
|
79
|
+
**Soft revert (--soft):**
|
|
80
|
+
|
|
81
|
+
```bash
|
|
82
|
+
git revert --no-commit [commits...]
|
|
83
|
+
# Leave changes staged for review
|
|
84
|
+
```
|
|
85
|
+
|
|
86
|
+
### Step 5: Update Bead
|
|
87
|
+
|
|
88
|
+
```bash
|
|
89
|
+
bd update [bead-id] --status reverted --note "Reverted [scope]"
|
|
90
|
+
```
|
|
91
|
+
|
|
92
|
+
## Safety Checks
|
|
93
|
+
|
|
94
|
+
Before reverting:
|
|
95
|
+
|
|
96
|
+
- [ ] Check for uncommitted changes
|
|
97
|
+
- [ ] Verify bead exists and has commits
|
|
98
|
+
- [ ] Check for dependent beads
|
|
99
|
+
- [ ] Identify potential merge conflicts
|
|
100
|
+
|
|
101
|
+
If conflicts detected:
|
|
102
|
+
|
|
103
|
+
1. List conflicting files
|
|
104
|
+
2. Offer to abort or continue with manual resolution
|
|
105
|
+
3. Provide conflict resolution guidance
|
|
106
|
+
|
|
107
|
+
## Output
|
|
108
|
+
|
|
109
|
+
Report:
|
|
110
|
+
|
|
111
|
+
- Commits reverted
|
|
112
|
+
- Files restored
|
|
113
|
+
- Bead status updated
|
|
114
|
+
- Next steps
|
|
115
|
+
|
|
116
|
+
## Related Commands
|
|
117
|
+
|
|
118
|
+
```bash
|
|
119
|
+
# View bead history
|
|
120
|
+
bd show [bead-id] --history
|
|
121
|
+
|
|
122
|
+
# Check current status
|
|
123
|
+
bd status
|
|
124
|
+
|
|
125
|
+
# Re-implement after revert
|
|
126
|
+
/implement [bead-id]
|
|
127
|
+
```
|
|
@@ -0,0 +1,152 @@
|
|
|
1
|
+
---
|
|
2
|
+
description: Initialize project context for AI-assisted development
|
|
3
|
+
argument-hint: "[--full] [--minimal]"
|
|
4
|
+
agent: planner
|
|
5
|
+
model: proxypal/gemini-3-flash-preview
|
|
6
|
+
---
|
|
7
|
+
|
|
8
|
+
# Setup Project: $ARGUMENTS
|
|
9
|
+
|
|
10
|
+
Initialize project context files that AI agents and beads can reference.
|
|
11
|
+
|
|
12
|
+
## Instructions
|
|
13
|
+
|
|
14
|
+
Parse options from `$ARGUMENTS`:
|
|
15
|
+
|
|
16
|
+
- `--full`: Create all context files with detailed prompts
|
|
17
|
+
- `--minimal`: Create only essential files (default)
|
|
18
|
+
|
|
19
|
+
## Context Files to Create
|
|
20
|
+
|
|
21
|
+
### Essential (always created)
|
|
22
|
+
|
|
23
|
+
**`.opencode/memory/project/product.md`**
|
|
24
|
+
|
|
25
|
+
```markdown
|
|
26
|
+
# Product Context
|
|
27
|
+
|
|
28
|
+
## Vision
|
|
29
|
+
|
|
30
|
+
[What is this product? What problem does it solve?]
|
|
31
|
+
|
|
32
|
+
## Target Users
|
|
33
|
+
|
|
34
|
+
[Who uses this? What are their needs?]
|
|
35
|
+
|
|
36
|
+
## Key Features
|
|
37
|
+
|
|
38
|
+
1. [Feature 1]
|
|
39
|
+
2. [Feature 2]
|
|
40
|
+
|
|
41
|
+
## Success Metrics
|
|
42
|
+
|
|
43
|
+
- [How do we measure success?]
|
|
44
|
+
```
|
|
45
|
+
|
|
46
|
+
**`.opencode/memory/project/tech-stack.md`**
|
|
47
|
+
|
|
48
|
+
```markdown
|
|
49
|
+
# Tech Stack
|
|
50
|
+
|
|
51
|
+
## Languages
|
|
52
|
+
|
|
53
|
+
- [Primary language and version]
|
|
54
|
+
|
|
55
|
+
## Frameworks
|
|
56
|
+
|
|
57
|
+
- [Framework 1]: [Purpose]
|
|
58
|
+
|
|
59
|
+
## Infrastructure
|
|
60
|
+
|
|
61
|
+
- [Hosting, CI/CD, etc.]
|
|
62
|
+
|
|
63
|
+
## Key Dependencies
|
|
64
|
+
|
|
65
|
+
| Package | Version | Purpose |
|
|
66
|
+
| ------- | ------- | ------- |
|
|
67
|
+
| [name] | [ver] | [why] |
|
|
68
|
+
|
|
69
|
+
## Development Setup
|
|
70
|
+
|
|
71
|
+
[How to get started locally]
|
|
72
|
+
```
|
|
73
|
+
|
|
74
|
+
### Full Setup (with --full)
|
|
75
|
+
|
|
76
|
+
**`.opencode/memory/project/workflow.md`**
|
|
77
|
+
|
|
78
|
+
```markdown
|
|
79
|
+
# Development Workflow
|
|
80
|
+
|
|
81
|
+
## Branch Strategy
|
|
82
|
+
|
|
83
|
+
- main: Production
|
|
84
|
+
- develop: Integration
|
|
85
|
+
- feature/\*: New features
|
|
86
|
+
- fix/\*: Bug fixes
|
|
87
|
+
|
|
88
|
+
## Code Review
|
|
89
|
+
|
|
90
|
+
[Review requirements]
|
|
91
|
+
|
|
92
|
+
## Testing Requirements
|
|
93
|
+
|
|
94
|
+
[What must be tested]
|
|
95
|
+
|
|
96
|
+
## Deployment Process
|
|
97
|
+
|
|
98
|
+
[How code gets to production]
|
|
99
|
+
```
|
|
100
|
+
|
|
101
|
+
**`.opencode/memory/project/conventions.md`**
|
|
102
|
+
|
|
103
|
+
```markdown
|
|
104
|
+
# Coding Conventions
|
|
105
|
+
|
|
106
|
+
## Naming
|
|
107
|
+
|
|
108
|
+
- Files: [convention]
|
|
109
|
+
- Components: [convention]
|
|
110
|
+
- Variables: [convention]
|
|
111
|
+
|
|
112
|
+
## Structure
|
|
113
|
+
|
|
114
|
+
- [Directory structure rules]
|
|
115
|
+
|
|
116
|
+
## Patterns
|
|
117
|
+
|
|
118
|
+
- [Design patterns used]
|
|
119
|
+
|
|
120
|
+
## Anti-patterns
|
|
121
|
+
|
|
122
|
+
- [What to avoid]
|
|
123
|
+
```
|
|
124
|
+
|
|
125
|
+
## Process
|
|
126
|
+
|
|
127
|
+
1. Check if context files already exist
|
|
128
|
+
2. If exists, offer to update or skip
|
|
129
|
+
3. Analyze codebase to pre-fill where possible:
|
|
130
|
+
- Detect tech stack from package.json, go.mod, etc.
|
|
131
|
+
- Identify patterns from existing code
|
|
132
|
+
- Extract project info from README
|
|
133
|
+
4. Create files with intelligent defaults
|
|
134
|
+
5. Report what was created
|
|
135
|
+
|
|
136
|
+
## Integration with Beads
|
|
137
|
+
|
|
138
|
+
After setup, beads can reference:
|
|
139
|
+
|
|
140
|
+
```bash
|
|
141
|
+
bd new feature "Add login" --context .opencode/memory/project/
|
|
142
|
+
```
|
|
143
|
+
|
|
144
|
+
## Output
|
|
145
|
+
|
|
146
|
+
Report:
|
|
147
|
+
|
|
148
|
+
- Files created/updated
|
|
149
|
+
- Detected tech stack
|
|
150
|
+
- Suggested next steps
|
|
151
|
+
|
|
152
|
+
Save to `.opencode/memory/project/`
|
|
@@ -1,52 +1,44 @@
|
|
|
1
1
|
---
|
|
2
|
-
description: Review UI/UX design
|
|
3
|
-
argument-hint: "[bead-id]
|
|
2
|
+
description: Review UI/UX design for quality and aesthetics
|
|
3
|
+
argument-hint: "<image-or-component-path> [bead-id]"
|
|
4
4
|
agent: vision
|
|
5
|
+
model: proxypal/gemini-3-pro-preview
|
|
5
6
|
---
|
|
6
7
|
|
|
7
8
|
# UI Review: $ARGUMENTS
|
|
8
9
|
|
|
9
|
-
use_skill("ui-ux-research")
|
|
10
10
|
use_skill("frontend-aesthetics")
|
|
11
|
+
use_skill("visual-analysis")
|
|
11
12
|
|
|
12
|
-
|
|
13
|
+
Review UI/UX design for quality, aesthetics, and best practices.
|
|
13
14
|
|
|
14
|
-
|
|
15
|
+
## Instructions
|
|
15
16
|
|
|
16
|
-
|
|
17
|
+
Parse image/component path and optional bead ID from `$ARGUMENTS`.
|
|
17
18
|
|
|
18
|
-
|
|
19
|
+
## What to Evaluate
|
|
19
20
|
|
|
20
|
-
|
|
21
|
+
1. **Typography** - Avoid generic fonts (Inter/Roboto without purpose)
|
|
22
|
+
2. **Colors** - Check for overused AI patterns (purple gradients, flat white)
|
|
23
|
+
3. **Layout** - Hierarchy, spacing, visual rhythm
|
|
24
|
+
4. **Motion** - Micro-interactions, transitions
|
|
25
|
+
5. **Atmosphere** - Texture, depth, personality
|
|
26
|
+
6. **Accessibility** - Contrast, focus states, ARIA
|
|
21
27
|
|
|
22
|
-
|
|
28
|
+
## Anti-Patterns to Flag
|
|
23
29
|
|
|
24
|
-
|
|
30
|
+
- Cookie-cutter card layouts
|
|
31
|
+
- Excessive rounded corners
|
|
32
|
+
- Glassmorphism without purpose
|
|
33
|
+
- Generic stock illustration style
|
|
25
34
|
|
|
26
|
-
##
|
|
27
|
-
|
|
28
|
-
Provide specific, actionable improvements: suggest alternative fonts, propose color palette changes, identify opportunities for subtle animations, and recommend layout enhancements. Include code snippets when they would help clarify the suggestion.
|
|
29
|
-
|
|
30
|
-
## Record Findings
|
|
31
|
-
|
|
32
|
-
### With Bead ID
|
|
33
|
-
|
|
34
|
-
Update the bead with review findings:
|
|
35
|
-
|
|
36
|
-
```bash
|
|
37
|
-
bd edit <bead-id> --note "UI Review: <summary of issues found and recommendations>"
|
|
38
|
-
```
|
|
39
|
-
|
|
40
|
-
If review reveals implementation tasks, create child beads:
|
|
41
|
-
|
|
42
|
-
```bash
|
|
43
|
-
bd create --title "<specific UI fix>" --type task --parent <bead-id>
|
|
44
|
-
```
|
|
45
|
-
|
|
46
|
-
### Without Bead ID
|
|
35
|
+
## Output
|
|
47
36
|
|
|
48
|
-
|
|
37
|
+
Provide:
|
|
49
38
|
|
|
50
|
-
|
|
39
|
+
1. Summary of issues found
|
|
40
|
+
2. Specific actionable recommendations
|
|
41
|
+
3. Code snippets for improvements
|
|
42
|
+
4. Before/after suggestions
|
|
51
43
|
|
|
52
|
-
|
|
44
|
+
If bead ID provided, record findings to the bead.
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
# Project Context Template
|
|
2
|
+
|
|
3
|
+
Use `/setup-project` command to initialize these files.
|
|
4
|
+
|
|
5
|
+
## Files Created
|
|
6
|
+
|
|
7
|
+
| File | Purpose |
|
|
8
|
+
| ---------------- | ----------------------------------- |
|
|
9
|
+
| `product.md` | Product vision, users, features |
|
|
10
|
+
| `tech-stack.md` | Languages, frameworks, dependencies |
|
|
11
|
+
| `workflow.md` | Branch strategy, review, deployment |
|
|
12
|
+
| `conventions.md` | Coding standards, patterns |
|
|
13
|
+
|
|
14
|
+
## Integration with Beads
|
|
15
|
+
|
|
16
|
+
Beads can reference project context:
|
|
17
|
+
|
|
18
|
+
```bash
|
|
19
|
+
bd new feature "Add auth" --context .opencode/memory/project/
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
## Integration with Commands
|
|
23
|
+
|
|
24
|
+
Commands automatically check:
|
|
25
|
+
|
|
26
|
+
- `/implement` - Reads tech-stack for implementation guidance
|
|
27
|
+
- `/plan` - Reads product for feature alignment
|
|
28
|
+
- `/review-codebase` - Reads conventions for compliance
|