New workflow guide covering Satori + resvg pattern for dynamic social preview images. Includes production template, gotchas (font format, static file shadowing), design variants, and testing approach. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
6.6 KiB
| title | description | tags | |||
|---|---|---|---|---|---|
| Claude Code Workflows | Step-by-step guides for common development patterns with Claude Code |
|
Claude Code Workflows
Step-by-step guides for common development patterns with Claude Code.
🔍 Search & Discovery
Search Tools Mastery ⭐ NEW
Master the art of code search by combining rg, grepai, Serena & ast-grep
Learn when to use each tool, how to combine them for maximum efficiency, and real-world workflows including:
- Exploring unknown codebases
- Large-scale refactoring
- Security audits
- Framework migrations
- Performance optimization
Key Topics:
- Quick decision matrix
- Complete feature comparison
- 5 combined workflows
- Performance benchmarks
- Common pitfalls
- Tool selection cheatsheet
🎯 Development Workflows
Plan-Driven Development
Structure complex tasks with planning mode before execution.
When to use: Multi-step features, architectural changes, uncertainty about approach
TDD with Claude
Test-Driven Development workflow: write tests first, implement after.
When to use: Critical functionality, regression prevention, API design
Spec-First Development
Write specifications before code for better requirements clarity.
When to use: Team collaboration, complex features, documentation-first projects
Iterative Refinement
Improve code through multiple refinement cycles.
When to use: Quality improvements, performance optimization, code cleanup
Skeleton Projects ⭐ NEW
Use existing battle-tested repositories as scaffolding for new projects.
When to use: Starting new projects, standardizing team patterns, rapid prototyping from proven foundations
Team AI Instructions
Scale CLAUDE.md across a multi-developer, multi-tool team with profile-based module assembly.
When to use: Team 5+ devs, multiple AI tools (Claude Code + Cursor/Windsurf), mixed OS
🎨 Design & Content
Design to Code
Convert design mockups (Figma, wireframes) into working code.
When to use: Frontend development, UI implementation, design system work
OG Image Generation
Generate social preview images dynamically at build time with Satori and resvg.
When to use: Astro projects, keeping social previews accurate without maintaining static PNGs
PDF Generation
Generate professional PDFs using Quarto/Typst with Claude Code.
When to use: Reports, documentation, whitepapers, technical documents
Talk Preparation Pipeline ⭐ NEW
6-stage skill pipeline: raw material → structured talk → AI-generated slides via Kimi.
When to use: Conference talks, meetup presentations, internal tech talks — from article, transcript, or notes
TTS Setup
Configure Text-to-Speech for Claude Code responses (Agent Vibes integration).
When to use: Audio feedback, accessibility, hands-free coding
🔬 Code Exploration
Exploration Workflow
Systematically explore and understand unfamiliar codebases.
When to use: New projects, legacy code, documentation gaps
Related: See Search Tools Mastery for advanced multi-tool exploration strategies.
Multi-Agent & Advanced
Agent Teams
Orchestrate multiple specialized agents working in parallel on complex tasks.
When to use: Tasks that benefit from parallelism, specialized expertise, or independent verification
Agent Teams Quick Start
Fast-track guide to setting up your first agent team in under 30 minutes.
When to use: New to multi-agent patterns, want to experiment before committing to full setup
Dual-Instance Planning
Run Opus for planning and Sonnet for execution in two coordinated Claude Code instances.
When to use: Complex features needing deep reasoning for architecture, cost-effective execution
Event-Driven Agents
Coordinate agents through hook events rather than direct orchestration.
When to use: Reactive workflows, hook-triggered automation, loosely-coupled agent pipelines
Plan Pipeline
Full end-to-end plan pipeline: /plan-start, /plan-validate, /plan-execute as a coherent workflow.
When to use: Any significant feature where planning rigor pays off before writing code
Task Management
Multi-session task tracking with TodoWrite, tasks API, and context persistence across sessions.
When to use: Long-running tasks spanning multiple sessions, team coordination, complex backlogs
Quick Selection Guide
| Your Situation | Recommended Workflow |
|---|---|
| New to codebase | Exploration Workflow + Search Tools Mastery |
| Complex feature | Plan-Driven or Spec-First |
| Need reliability | TDD with Claude |
| Large refactoring | Search Tools Mastery |
| UI implementation | Design to Code |
| Code quality | Iterative Refinement |
| New project from template | Skeleton Projects |
| Team AI instructions | Team AI Instructions |
| Documentation | PDF Generation |
| Social previews | OG Image Generation |
| Conference talk from raw material | Talk Preparation Pipeline |
| Audio feedback | TTS Setup |
| Multi-agent tasks | Agent Teams |
| First agent team | Agent Teams Quick Start |
| Cost-optimized planning | Dual-Instance Planning |
| Hook-driven automation | Event-Driven Agents |
| Full plan workflow | Plan Pipeline |
| Multi-session tracking | Task Management |
Contributing
New workflow ideas? Open an issue or PR in the main repository.
Workflow Template Structure:
- Title & Purpose
- When to Use
- Prerequisites
- Step-by-Step Guide
- Real-World Examples
- Common Pitfalls
- Related Workflows
Last updated: March 2026