catlog22/Claude-Code-Workflow
1
0
Fork 0
mirror of https://github.com/catlog22/Claude-Code-Workflow.git synced 2026-02-13 02:41:50 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: integrate Exa MCP for design trend research in UI workflow

Browse Source 
Enhance UI Design Workflow with intelligent design trend research capabilities:
- Add design trend analysis in extract phase using Exa MCP API
- Integrate layout strategy planning with current UI/UX patterns (2024-2025)
- Update consolidation command to include dynamic layout generation
- Add ui-instantiate-prototypes.sh script for prototype management
- Simplify path structure by removing nested .design directories
- Update workflow architecture documentation

This integration enables context-aware design decisions based on modern design trends
and improves the quality of generated UI prototypes.

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

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
catlog22
2025-10-09 18:04:37 +08:00
parent c7e2d6f82f
commit 20c75c0060
8 changed files with 1466 additions and 480 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
.claude/commands/workflow/ui-design/update.md
View File

@@ -30,12 +30,12 @@ Synchronize finalized design system references to brainstorming artifacts, prepa
CHECK: .workflow/.active-* marker files
VALIDATE: session_id matches active session
# Verify required design artifacts exist (file existence check only)
# Verify required design artifacts exist in latest design run
latest_design = find_latest_path_matching(".workflow/WFS-{session}/design-*")
VERIFY:
- .design/style-consolidation/design-tokens.json
- .design/style-consolidation/style-guide.md
- .design/style-consolidation/tailwind.config.js
- .design/prototypes/*.html (at least one prototype)
- {latest_design}/style-consolidation/design-tokens.json
- {latest_design}/style-consolidation/style-guide.md
- {latest_design}/prototypes/*.html (at least one prototype)
# Prototype selection
IF --selected-prototypes provided:
@@ -43,7 +43,7 @@ IF --selected-prototypes provided:
selected_list = parse_comma_separated(--selected-prototypes)
ELSE:
AUTO-SELECT: Use all generated prototypes
selected_list = Glob(.design/prototypes/*.html)
selected_list = Glob({latest_design}/prototypes/*.html)
REPORT: "Found {count} design artifacts, {prototype_count} prototypes"
```
@@ -76,9 +76,8 @@ Update `.brainstorming/synthesis-specification.md` with design system references
## UI/UX Guidelines
### Design System Reference
**Finalized Design Tokens**: @../.design/style-consolidation/design-tokens.json
**Style Guide**: @../.design/style-consolidation/style-guide.md
**Tailwind Configuration**: @../.design/style-consolidation/tailwind.config.js
**Finalized Design Tokens**: @../design-{run_id}/style-consolidation/design-tokens.json
**Style Guide**: @../design-{run_id}/style-consolidation/style-guide.md
### Implementation Requirements
**Token Adherence**: All UI implementations MUST use design token CSS custom properties
@@ -88,18 +87,17 @@ Update `.brainstorming/synthesis-specification.md` with design system references
### Reference Prototypes
{FOR each selected_prototype:
- **{page_name}**: @../.design/prototypes/{prototype}.html
- **{page_name}**: @../design-{run_id}/prototypes/{prototype}.html
- Layout: {layout_strategy from notes}
}
### Design System Assets
```json
{
"design_tokens": ".design/style-consolidation/design-tokens.json",
"style_guide": ".design/style-consolidation/style-guide.md",
"tailwind_config": ".design/style-consolidation/tailwind.config.js",
"design_tokens": "design-{run_id}/style-consolidation/design-tokens.json",
"style_guide": "design-{run_id}/style-consolidation/style-guide.md",
"prototypes": [
{FOR each: ".design/prototypes/{prototype}.html"}
{FOR each: "design-{run_id}/prototypes/{prototype}.html"}
]
}
```
@@ -133,9 +131,8 @@ Create or update `.brainstorming/ui-designer/style-guide.md`:
## Design System Integration
This style guide references the finalized design system from the design refinement phase.
**Design Tokens**: @../../.design/style-consolidation/design-tokens.json
**Style Guide**: @../../.design/style-consolidation/style-guide.md
**Tailwind Config**: @../../.design/style-consolidation/tailwind.config.js
**Design Tokens**: @../../design-{run_id}/style-consolidation/design-tokens.json
**Style Guide**: @../../design-{run_id}/style-consolidation/style-guide.md
## Implementation Guidelines
1. **Use CSS Custom Properties**: All styles reference design tokens
@@ -145,13 +142,13 @@ This style guide references the finalized design system from the design refineme
## Reference Prototypes
{FOR each selected_prototype:
- **{page_name}**: @../../.design/prototypes/{prototype}.html
- **{page_name}**: @../../design-{run_id}/prototypes/{prototype}.html
}
## Token System
For complete token definitions and usage examples, see:
- Design Tokens: @../../.design/style-consolidation/design-tokens.json
- Style Guide: @../../.design/style-consolidation/style-guide.md
- Design Tokens: @../../design-{run_id}/style-consolidation/design-tokens.json
- Style Guide: @../../design-{run_id}/style-consolidation/style-guide.md
---
*Auto-generated by /workflow:ui-design:update*
@@ -190,7 +187,6 @@ Updated artifacts:
Design system assets ready for /workflow:plan:
- design-tokens.json
- style-guide.md
- tailwind.config.js
- {prototype_count} reference prototypes
Next: /workflow:plan [--agent] "<task description>"
@@ -209,18 +205,16 @@ Next: /workflow:plan [--agent] "<task description>"
**@ Reference Format** (used in synthesis-specification.md):
```
@../.design/style-consolidation/design-tokens.json
@../.design/style-consolidation/style-guide.md
@../.design/style-consolidation/tailwind.config.js
@../.design/prototypes/{prototype}.html
@../design-{run_id}/style-consolidation/design-tokens.json
@../design-{run_id}/style-consolidation/style-guide.md
@../design-{run_id}/prototypes/{prototype}.html
```
**@ Reference Format** (used in ui-designer/style-guide.md):
```
@../../.design/style-consolidation/design-tokens.json
@../../.design/style-consolidation/style-guide.md
@../../.design/style-consolidation/tailwind.config.js
@../../.design/prototypes/{prototype}.html
@../../design-{run_id}/style-consolidation/design-tokens.json
@../../design-{run_id}/style-consolidation/style-guide.md
@../../design-{run_id}/prototypes/{prototype}.html
```
## Integration with /workflow:plan
@@ -243,9 +237,9 @@ After this update, `/workflow:plan` will discover design assets through:
"task_id": "IMPL-001",
"context": {
"design_system": {
"tokens": ".design/style-consolidation/design-tokens.json",
"style_guide": ".design/style-consolidation/style-guide.md",
"prototypes": [".design/prototypes/dashboard-variant-1.html"]
"tokens": "design-{run_id}/style-consolidation/design-tokens.json",
"style_guide": "design-{run_id}/style-consolidation/style-guide.md",
"prototypes": ["design-{run_id}/prototypes/dashboard-variant-1.html"]
}
}
}