Creo -- Design & Development Toolkit
Creo is a comprehensive design, UX, content, DevOps, and testing toolkit for web applications. It provides a unified interface for design reviews, UX flow analysis, marketing content generation, SEO auditing, CI/CD pipeline management, test orchestration, and full marketing site creation. Each command routes to a specialized sub-skill or subagent optimized for its domain.
Quick Reference
| Command |
Description |
/creo design-review <url> |
UI/UX review (responsive, WCAG AA, Nielsen's heuristics) |
/creo design-implement <report> |
Execute design fixes from review reports |
/creo ux-internal <flow> |
Analyze your own app's UX flows |
/creo ux-competitor <url> |
Analyze competitor websites |
/creo content <page-type> |
Generate marketing copy (JTBD, pain points) |
/creo image-prompt <context> |
Generate image prompts for DALL-E/Midjourney/SDXL |
/creo seo <url> |
Next.js SEO + GEO audit (7-phase, technical + schema + GEO) |
/creo seo onboard <url> |
Full SEO lifecycle: audit, plan, guided GSC setup, monitoring cadence |
/creo seo init |
Scan codebase and cache project profile for faster audits |
/creo seo autofix |
Closed-loop GSC remediation (allowlisted fixes, ledger, live verification) |
/creo seo semantic-core |
Focused query core with noise filtering and P0-P3 priorities |
/creo seo weekly |
Weekly rank history + LLM-citability monitoring |
/creo seo-content <url> |
Deep content audit (E-E-A-T, AI-pattern detection, citability) |
/creo devops <command> |
Infrastructure management (GitHub/Cloudflare/Railway/Stripe) |
/creo pipeline <command> |
CI/CD pipeline specialist (GitHub Actions) |
/creo test <command> |
Test orchestration (unit + E2E) |
/creo marketing-site <command> |
Full marketing site creation (7-stage) |
/creo ai-generation <command> |
AI generation pipeline expertise |
/creo perf <command> |
Performance optimization: init, baseline, audit, optimize, report (six-layer, measured) |
Orchestration Logic
Individual Commands
For any single command (e.g., /creo design-review, /creo seo), the orchestrator loads the relevant sub-skill directly. The sub-skill file contains the full instructions and references needed for that domain.
Marketing Site Full Build (/creo marketing-site full)
This is a multi-stage orchestration that delegates to parallel subagents:
- Stage 1-2: Infrastructure setup and content generation run sequentially.
- Stage 3: Page component assembly.
- Stage 4-5: Parallel delegation to:
creo-content-strategist -- generates marketing copy for all pagescreo-seo -- runs codebase audit and optimizes metadata/structured datacreo-design-review -- validates responsive design and accessibilitycreo-ux-competitor -- analyzes competitor sites for differentiation
- Stage 6: Localization via
creo-i18n-translator.
- Stage 7: Final QA combining all subagent reports.
DevOps Routing (/creo devops)
Routes to specialized CLI subagents based on the target platform:
| Subcommand |
Subagent |
devops github |
creo-github-cli |
devops cloudflare |
creo-cloudflare-cli |
devops railway |
creo-railway-cli |
devops stripe |
creo-stripe-cli |
Performance Routing (/creo perf)
Loads the creo-perf sub-skill. perf audit spawns the measure-only creo-perf-audit subagent; perf init scaffolds the project's .claude/skills/creo-perf/ via the perf-harness extension; perf optimize runs the fix loop in the main context (baseline, one concern, re-measure, verify, commit).
Test Routing (/creo test)
Routes to the appropriate testing subagent:
| Subcommand |
Subagent |
test unit |
creo-unit-test |
test e2e |
creo-e2e-test |
test all |
Both subagents run in parallel |
Domains
| Domain |
Sub-Skills |
Primary Focus |
| Design & UX |
design-review, design-implement, ux-internal, ux-competitor |
Visual quality, accessibility, usability |
| Content & Marketing |
content, image-prompt |
Copy generation, JTBD frameworks, image prompts |
| SEO |
seo |
Technical SEO, structured data, Core Web Vitals |
| DevOps |
devops (github, cloudflare, railway, stripe) |
Infrastructure, deployment, services |
| Testing |
test (unit, e2e) |
Code quality, test coverage, E2E validation |
| Performance |
perf |
Six-layer audit, immutable baselines, before/after proof, fix loop |
| Orchestration |
marketing-site, ai-generation |
Multi-stage workflows, parallel delegation |
Reference Files
On-demand reference files loaded by sub-skills as needed. Located in creo/references/:
| File |
Used By |
Content |
design-principles.md |
design-review, design-implement |
S-tier SaaS design checklist |
design-style-guide.md |
design-review, design-implement |
Viewports, spacing, typography, accessibility |
visual-dev-snippets.md |
design-review, design-implement |
Quick visual verification workflow |
ux-methodologies.md |
ux-internal, ux-competitor |
Nielsen's heuristics, JTBD, journey mapping |
ux-report-template.md |
ux-internal, ux-competitor |
Structured UX analysis report format |
pain-points-framework.md |
content, marketing-site |
Customer pain analysis by segment |
voice-and-tone.md |
content, marketing-site |
Brand voice pillars, writing principles |
image-style-reference.md |
image-prompt |
Prompt patterns, style modifiers, categories |
seo-checklist.md |
seo, marketing-site |
SEO and i18n implementation checklist |
seo-audit-checklists.md |
seo |
Phase-based SEO audit (5 phases) |
i18n-translation-guide.md |
marketing-site, content |
Localization best practices, language list |
workflow-stages.md |
marketing-site |
7-stage marketing site creation workflow |
Sub-Skills
Each sub-skill is a standalone SKILL.md that can be invoked directly or through the orchestrator.
| # |
Sub-Skill |
Path |
Trigger |
| 1 |
Design Review |
creo/skills/design-review/SKILL.md |
/creo design-review |
| 2 |
Design Implementation |
creo/skills/design-implement/SKILL.md |
/creo design-implement |
| 3 |
UX Internal Analysis |
creo/skills/ux-internal/SKILL.md |
/creo ux-internal |
| 4 |
UX Competitor Analysis |
creo/skills/ux-competitor/SKILL.md |
/creo ux-competitor |
| 5 |
Content Strategy |
creo/skills/content/SKILL.md |
/creo content |
| 6 |
Image Prompt Generation |
creo/skills/image-prompt/SKILL.md |
/creo image-prompt |
| 7 |
SEO Audit |
creo/skills/seo/SKILL.md |
/creo seo |
| 8 |
DevOps Management |
creo/skills/devops/SKILL.md |
/creo devops |
| 9 |
CI/CD Pipeline |
creo/skills/pipeline/SKILL.md |
/creo pipeline |
| 10 |
Test Orchestration |
creo/skills/test/SKILL.md |
/creo test |
| 11 |
Marketing Site |
creo/skills/marketing-site/SKILL.md |
/creo marketing-site |
| 12 |
AI Generation |
creo/skills/ai-generation/SKILL.md |
/creo ai-generation |
| 13 |
Performance |
skills/creo-perf/SKILL.md |
/creo perf |
Subagents
Each subagent is a focused agent definition for parallel delegation.
| # |
Subagent |
Path |
Role |
| 1 |
creo-design-review |
creo/agents/design-review.md |
Visual review and accessibility |
| 2 |
creo-design-implement |
creo/agents/design-implement.md |
Execute design fixes |
| 3 |
creo-ux-internal |
creo/agents/ux-internal.md |
Internal UX flow analysis |
| 4 |
creo-ux-competitor |
creo/agents/ux-competitor.md |
Competitor UX analysis |
| 5 |
creo-content-strategist |
creo/agents/content-strategist.md |
Marketing copy generation |
| 6 |
creo-image-prompt |
creo/agents/image-prompt.md |
Image prompt generation |
| 7 |
creo-seo |
agents/creo-seo.md |
Next.js SEO + GEO audit (7-phase) |
| 7b |
creo-seo-content |
agents/creo-seo-content.md |
Deep content-quality audit (delegate or standalone) |
| 8 |
creo-github-cli |
creo/agents/github-cli.md |
GitHub API operations |
| 9 |
creo-cloudflare-cli |
creo/agents/cloudflare-cli.md |
Cloudflare management |
| 10 |
creo-railway-cli |
creo/agents/railway-cli.md |
Railway deployment |
| 11 |
creo-stripe-cli |
creo/agents/stripe-cli.md |
Stripe integration |
| 12 |
creo-e2e-test |
creo/agents/e2e-test.md |
End-to-end testing |
| 13 |
creo-perf-audit |
agents/creo-perf-audit.md |
Six-layer performance audit (measure-only) |
Optional Extensions
These extensions can be added to the toolkit as needed:
- image-generation -- Integration with DALL-E, Midjourney, or SDXL APIs for automated image creation from prompts generated by the image-prompt sub-skill.
- i18n-translator -- Automated translation pipeline for marketing site localization across 39+ languages with quality validation.
- gsc-analyzer -- Google Search Console analysis, SEO auditing, and operations automation: 17 analyzers, GSC API + Indexing API clients, UI-only surface automation (drilldown exports, Validate Fix), the closed-loop autofix scripts, weekly rank/LLM-citability monitoring, and a full GSC API reference.
- perf-harness -- Deterministic benchmark scripts behind
/creo perf: scenario captures (EXPLAIN medians, p50/p95 loops, wire bytes, ETag replay, Playwright interaction probes), Lighthouse initial-load audit, platform/schema audits, pg_stat_statements workload discovery, auto-built before/after dashboard, and the /creo perf init project scaffolder.
Project Configuration
All skills check .claude/project-config.md at runtime for project-specific settings. This file should contain:
- Dev server URL -- The local development server address (default:
http://localhost:3000).
- Framework -- The frontend framework in use (Next.js, Vite, etc.).
- CSS framework -- Tailwind CSS, MUI, shadcn/ui, or custom.
- Supported locales -- List of language codes for i18n.
- Brand guidelines -- Brand name, colors, fonts, voice attributes.
- Deployment targets -- Hosting platform and CI/CD configuration.
- Test framework -- Vitest, Jest, Playwright, Cypress, etc.
If .claude/project-config.md does not exist, skills use sensible defaults and prompt the user for required configuration.
1---2name: creo3description: Comprehensive design, UX, content, DevOps, and testing toolkit for web applications. Design reviews, UX flow analysis, marketing content, SEO auditing, CI/CD pipelines, test orchestration, performance optimization, and marketing site creation. Triggers on: /creo, design review, UX analysis, marketing content, SEO, DevOps, pipeline, test, performance, benchmark, marketing site.4---56# Creo -- Design & Development Toolkit78Creo is a comprehensive design, UX, content, DevOps, and testing toolkit for web applications. It provides a unified interface for design reviews, UX flow analysis, marketing content generation, SEO auditing, CI/CD pipeline management, test orchestration, and full marketing site creation. Each command routes to a specialized sub-skill or subagent optimized for its domain.910---1112## Quick Reference1314| Command | Description |15|---------|-------------|16| `/creo design-review <url>` | UI/UX review (responsive, WCAG AA, Nielsen's heuristics) |17| `/creo design-implement <report>` | Execute design fixes from review reports |18| `/creo ux-internal <flow>` | Analyze your own app's UX flows |19| `/creo ux-competitor <url>` | Analyze competitor websites |20| `/creo content <page-type>` | Generate marketing copy (JTBD, pain points) |21| `/creo image-prompt <context>` | Generate image prompts for DALL-E/Midjourney/SDXL |22| `/creo seo <url>` | Next.js SEO + GEO audit (7-phase, technical + schema + GEO) |23| `/creo seo onboard <url>` | Full SEO lifecycle: audit, plan, guided GSC setup, monitoring cadence |24| `/creo seo init` | Scan codebase and cache project profile for faster audits |25| `/creo seo autofix` | Closed-loop GSC remediation (allowlisted fixes, ledger, live verification) |26| `/creo seo semantic-core` | Focused query core with noise filtering and P0-P3 priorities |27| `/creo seo weekly` | Weekly rank history + LLM-citability monitoring |28| `/creo seo-content <url>` | Deep content audit (E-E-A-T, AI-pattern detection, citability) |29| `/creo devops <command>` | Infrastructure management (GitHub/Cloudflare/Railway/Stripe) |30| `/creo pipeline <command>` | CI/CD pipeline specialist (GitHub Actions) |31| `/creo test <command>` | Test orchestration (unit + E2E) |32| `/creo marketing-site <command>` | Full marketing site creation (7-stage) |33| `/creo ai-generation <command>` | AI generation pipeline expertise |34| `/creo perf <command>` | Performance optimization: init, baseline, audit, optimize, report (six-layer, measured) |3536---3738## Orchestration Logic3940### Individual Commands4142For any single command (e.g., `/creo design-review`, `/creo seo`), the orchestrator loads the relevant sub-skill directly. The sub-skill file contains the full instructions and references needed for that domain.4344### Marketing Site Full Build (`/creo marketing-site full`)4546This is a multi-stage orchestration that delegates to parallel subagents:47481. **Stage 1-2**: Infrastructure setup and content generation run sequentially.492. **Stage 3**: Page component assembly.503. **Stage 4-5**: Parallel delegation to:51 - `creo-content-strategist` -- generates marketing copy for all pages52 - `creo-seo` -- runs codebase audit and optimizes metadata/structured data53 - `creo-design-review` -- validates responsive design and accessibility54 - `creo-ux-competitor` -- analyzes competitor sites for differentiation554. **Stage 6**: Localization via `creo-i18n-translator`.565. **Stage 7**: Final QA combining all subagent reports.5758### DevOps Routing (`/creo devops`)5960Routes to specialized CLI subagents based on the target platform:6162| Subcommand | Subagent |63|------------|----------|64| `devops github` | `creo-github-cli` |65| `devops cloudflare` | `creo-cloudflare-cli` |66| `devops railway` | `creo-railway-cli` |67| `devops stripe` | `creo-stripe-cli` |6869### Performance Routing (`/creo perf`)7071Loads the `creo-perf` sub-skill. `perf audit` spawns the measure-only `creo-perf-audit` subagent; `perf init` scaffolds the project's `.claude/skills/creo-perf/` via the perf-harness extension; `perf optimize` runs the fix loop in the main context (baseline, one concern, re-measure, verify, commit).7273### Test Routing (`/creo test`)7475Routes to the appropriate testing subagent:7677| Subcommand | Subagent |78|------------|----------|79| `test unit` | `creo-unit-test` |80| `test e2e` | `creo-e2e-test` |81| `test all` | Both subagents run in parallel |8283---8485## Domains8687| Domain | Sub-Skills | Primary Focus |88|--------|-----------|---------------|89| **Design & UX** | design-review, design-implement, ux-internal, ux-competitor | Visual quality, accessibility, usability |90| **Content & Marketing** | content, image-prompt | Copy generation, JTBD frameworks, image prompts |91| **SEO** | seo | Technical SEO, structured data, Core Web Vitals |92| **DevOps** | devops (github, cloudflare, railway, stripe) | Infrastructure, deployment, services |93| **Testing** | test (unit, e2e) | Code quality, test coverage, E2E validation |94| **Performance** | perf | Six-layer audit, immutable baselines, before/after proof, fix loop |95| **Orchestration** | marketing-site, ai-generation | Multi-stage workflows, parallel delegation |9697---9899## Reference Files100101On-demand reference files loaded by sub-skills as needed. Located in `creo/references/`:102103| File | Used By | Content |104|------|---------|---------|105| `design-principles.md` | design-review, design-implement | S-tier SaaS design checklist |106| `design-style-guide.md` | design-review, design-implement | Viewports, spacing, typography, accessibility |107| `visual-dev-snippets.md` | design-review, design-implement | Quick visual verification workflow |108| `ux-methodologies.md` | ux-internal, ux-competitor | Nielsen's heuristics, JTBD, journey mapping |109| `ux-report-template.md` | ux-internal, ux-competitor | Structured UX analysis report format |110| `pain-points-framework.md` | content, marketing-site | Customer pain analysis by segment |111| `voice-and-tone.md` | content, marketing-site | Brand voice pillars, writing principles |112| `image-style-reference.md` | image-prompt | Prompt patterns, style modifiers, categories |113| `seo-checklist.md` | seo, marketing-site | SEO and i18n implementation checklist |114| `seo-audit-checklists.md` | seo | Phase-based SEO audit (5 phases) |115| `i18n-translation-guide.md` | marketing-site, content | Localization best practices, language list |116| `workflow-stages.md` | marketing-site | 7-stage marketing site creation workflow |117118---119120## Sub-Skills121122Each sub-skill is a standalone SKILL.md that can be invoked directly or through the orchestrator.123124| # | Sub-Skill | Path | Trigger |125|---|-----------|------|---------|126| 1 | Design Review | `creo/skills/design-review/SKILL.md` | `/creo design-review` |127| 2 | Design Implementation | `creo/skills/design-implement/SKILL.md` | `/creo design-implement` |128| 3 | UX Internal Analysis | `creo/skills/ux-internal/SKILL.md` | `/creo ux-internal` |129| 4 | UX Competitor Analysis | `creo/skills/ux-competitor/SKILL.md` | `/creo ux-competitor` |130| 5 | Content Strategy | `creo/skills/content/SKILL.md` | `/creo content` |131| 6 | Image Prompt Generation | `creo/skills/image-prompt/SKILL.md` | `/creo image-prompt` |132| 7 | SEO Audit | `creo/skills/seo/SKILL.md` | `/creo seo` |133| 8 | DevOps Management | `creo/skills/devops/SKILL.md` | `/creo devops` |134| 9 | CI/CD Pipeline | `creo/skills/pipeline/SKILL.md` | `/creo pipeline` |135| 10 | Test Orchestration | `creo/skills/test/SKILL.md` | `/creo test` |136| 11 | Marketing Site | `creo/skills/marketing-site/SKILL.md` | `/creo marketing-site` |137| 12 | AI Generation | `creo/skills/ai-generation/SKILL.md` | `/creo ai-generation` |138| 13 | Performance | `skills/creo-perf/SKILL.md` | `/creo perf` |139140---141142## Subagents143144Each subagent is a focused agent definition for parallel delegation.145146| # | Subagent | Path | Role |147|---|----------|------|------|148| 1 | creo-design-review | `creo/agents/design-review.md` | Visual review and accessibility |149| 2 | creo-design-implement | `creo/agents/design-implement.md` | Execute design fixes |150| 3 | creo-ux-internal | `creo/agents/ux-internal.md` | Internal UX flow analysis |151| 4 | creo-ux-competitor | `creo/agents/ux-competitor.md` | Competitor UX analysis |152| 5 | creo-content-strategist | `creo/agents/content-strategist.md` | Marketing copy generation |153| 6 | creo-image-prompt | `creo/agents/image-prompt.md` | Image prompt generation |154| 7 | creo-seo | `agents/creo-seo.md` | Next.js SEO + GEO audit (7-phase) |155| 7b | creo-seo-content | `agents/creo-seo-content.md` | Deep content-quality audit (delegate or standalone) |156| 8 | creo-github-cli | `creo/agents/github-cli.md` | GitHub API operations |157| 9 | creo-cloudflare-cli | `creo/agents/cloudflare-cli.md` | Cloudflare management |158| 10 | creo-railway-cli | `creo/agents/railway-cli.md` | Railway deployment |159| 11 | creo-stripe-cli | `creo/agents/stripe-cli.md` | Stripe integration |160| 12 | creo-e2e-test | `creo/agents/e2e-test.md` | End-to-end testing |161| 13 | creo-perf-audit | `agents/creo-perf-audit.md` | Six-layer performance audit (measure-only) |162163---164165## Optional Extensions166167These extensions can be added to the toolkit as needed:168169- **image-generation** -- Integration with DALL-E, Midjourney, or SDXL APIs for automated image creation from prompts generated by the image-prompt sub-skill.170- **i18n-translator** -- Automated translation pipeline for marketing site localization across 39+ languages with quality validation.171- **gsc-analyzer** -- Google Search Console analysis, SEO auditing, and operations automation: 17 analyzers, GSC API + Indexing API clients, UI-only surface automation (drilldown exports, Validate Fix), the closed-loop autofix scripts, weekly rank/LLM-citability monitoring, and a full GSC API reference.172- **perf-harness** -- Deterministic benchmark scripts behind `/creo perf`: scenario captures (EXPLAIN medians, p50/p95 loops, wire bytes, ETag replay, Playwright interaction probes), Lighthouse initial-load audit, platform/schema audits, pg_stat_statements workload discovery, auto-built before/after dashboard, and the `/creo perf init` project scaffolder.173174---175176## Project Configuration177178All skills check `.claude/project-config.md` at runtime for project-specific settings. This file should contain:179180- **Dev server URL** -- The local development server address (default: `http://localhost:3000`).181- **Framework** -- The frontend framework in use (Next.js, Vite, etc.).182- **CSS framework** -- Tailwind CSS, MUI, shadcn/ui, or custom.183- **Supported locales** -- List of language codes for i18n.184- **Brand guidelines** -- Brand name, colors, fonts, voice attributes.185- **Deployment targets** -- Hosting platform and CI/CD configuration.186- **Test framework** -- Vitest, Jest, Playwright, Cypress, etc.187188If `.claude/project-config.md` does not exist, skills use sensible defaults and prompt the user for required configuration.
oyusypenko