Whiteboarding with AI (jrfernandez.com)

A “whiteboarding-first” workflow is being championed as a better way to use AI coding agents: start by drafting a persistent design doc in Markdown (paired with a high-quality model like Claude Opus) to explore the problem space, sketch architecture, and produce specs, then hand that plan to a cheaper execution model (e.g., Sonnet) to generate code. The author argues this mirrors pairing with a senior engineer—AI helps you think through tradeoffs and document decisions up front—yielding clearer specs, fewer bugs, and lower costs than asking one model to design and implement in one step. Key enablers are Mermaid diagrams (auto-generated by the model for architecture, sequence, and ER views) and a fast live-preview server called mdserve (Rust-based, Mermaid support, themes, live reload). The practical stack is Markdown + Claude for planning, Sonnet for typing, Neovim for quick edits, and mdserve for iterative visual feedback. Technically, the approach separates design and execution phases, makes diagrams first-class, and produces living documentation tailored to how you learn and maintain codebases—accelerating onboarding, improving architectural clarity, and reducing downstream debugging and rework.