Embed badge
Show
Style
[](https://versuz.dev/claude-md/oneredoak-claude-code-workflows)A CLAUDE.md is just a markdown file at the root of your repo. Copy the content below into your own project's CLAUDE.md to give your agent the same context.
npx versuz@latest install oneredoak-claude-code-workflows --kind=claude-mdcurl -o CLAUDE.md https://raw.githubusercontent.com/OneRedOak/claude-code-workflows/HEAD/CLAUDE.md## Visual Development ### Design Principles - Comprehensive design checklist in `/context/design-principles.md` - Brand style guide in `/context/style-guide.md` - When making visual (front-end, UI/UX) changes, always refer to these files for guidance ### Quick Visual Check IMMEDIATELY after implementing any front-end change: 1. **Identify what changed** - Review the modified components/pages 2. **Navigate to affected pages** - Use `mcp__playwright__browser_navigate` to visit each changed view 3. **Verify design compliance** - Compare against `/context/design-principles.md` and `/context/style-guide.md` 4. **Validate feature implementation** - Ensure the change fulfills the user's specific request 5. **Check acceptance criteria** - Review any provided context files or requirements 6. **Capture evidence** - Take full page screenshot at desktop viewport (1440px) of each changed view 7. **Check for errors** - Run `mcp__playwright__browser_console_messages` This verification ensures changes meet design standards and user requirements. ### Comprehensive Design Review Invoke the `@agent-design-review` subagent for thorough design validation when: - Completing significant UI/UX features - Before finalizing PRs with visual changes - Needing comprehensive accessibility and responsiveness testing