Six Tips on Using Claude Code
Pablo Stanley's battle-tested tips for productive Claude Code sessions. Six practical techniques that improve output quality immediately.
Why These Tips Work
Pablo Stanley — designer, illustrator, and creator of Humaaans — has been using Claude Code daily since its launch. As a designer who codes, his perspective bridges the gap between design intent and code output.
These six tips come from months of daily use, reflecting patterns that consistently improve Claude Code's output quality for both design and engineering tasks.
The Six Tips
1. Show Your Existing Code First
Before asking Claude Code to write anything new, show it 2-3 examples of your existing code. 'Here's how we build components in this project: [paste example].' Claude Code pattern-matches against examples much better than it follows abstract rules.
2. Be Opinionated About Style
Don't leave design decisions to Claude Code. Specify: 'Use 8px spacing grid. Primary color is #2563EB. Body text is 16px Inter. Cards have 24px padding and 8px border radius.' The more opinionated your instructions, the more consistent the output.
3. Use Iterative Refinement
Get a working version first, then refine. 'Build a basic card component' → 'Add hover animation with scale(1.02)' → 'Add a gradient border on hover.' Three focused iterations produce better results than one complex prompt.
4. Ask Claude to Explain Decisions
When the output surprises you, ask why: 'Why did you use flexbox instead of grid here?' Claude Code often has valid technical reasons that inform your understanding. This turns coding into a learning conversation.
5. Create a Project Context File
Maintain a CONTEXT.md with your current design decisions, recent changes, and next steps. Reference it in prompts: 'Read CONTEXT.md and continue with the next component.' This provides persistent context across sessions.
6. Don't Fight the Agent
If Claude Code consistently produces code in a certain pattern, consider whether its approach is actually better. Agents see patterns across millions of codebases. Sometimes the 'wrong' output is actually a better practice you hadn't considered.
Your First Claude Code Session
Follow this step-by-step workflow to apply all six tips in your next Claude Code session.
Set up your project context
Create a `CLAUDE.md` file at your project root listing your tech stack, coding conventions, and directory structure. Claude Code reads this automatically, giving it immediate understanding of your project. Include preferred patterns like "use functional React components" or "prefer named exports".
Start with an intent-level prompt
Instead of telling Claude Code exactly what code to write, describe your intent: "Add user authentication using the existing Supabase client in src/lib/supabase.ts with email magic link and Google OAuth." Let the agent plan the implementation.
Review the multi-file plan
Claude Code will outline which files it plans to create or modify. Review this plan before accepting. Check that it aligns with your architecture and does not touch files it should not. Use this as a checkpoint to course-correct early.
Run type-checking as a gate
After each significant change, ask Claude Code to run `tsc --noEmit` or your project's lint command. This catches cascading type errors across files before they compound. Fix issues immediately rather than accumulating technical debt.
