Mar 2
Loading video player...
Most AI coding tools can generate diagrams, but they look terrible (wrong spacing, overlapping elements, no visual hierarchy, etc.). I spent weeks building a Claude Code skill that not only creates beautiful Excalidraw diagrams but actually validates them visually using Playwright and Python, iterating until they look incredible. In this video I'll walk you through the entire skill, how it works, and what the self-validation process looks like. And the diagram I use to explain the whole workflow was created by the skill itself! I'm giving the skill away for free so you can use it in your own Claude Code setup immediately. ~~~~~~~~~~~~~~~~~~~~~~~~~~ - If you want to learn how to build reliable and repeatable systems for AI coding, check out the Dynamous Community and Agentic Coding Course: https://dynamous.ai/agentic-coding-course - Here is the GitHub repo with the skill: https://github.com/coleam00/excalidraw-diagram-skill - Obsidian Excalidraw plugin: https://github.com/zsviczian/obsidian-excalidraw-plugin ~~~~~~~~~~~~~~~~~~~~~~~~~~ 0:00 The Need for Visual Agents 0:55 Installation and Setup 1:47 Demo: Creating a Diagram 2:46 Visual Validation Loop 3:58 Iteration and Imperfections 5:19 Philosophy: Argue Visually 6:30 The Generation Workflow 8:01 Customizing Patterns and Colors 9:24 Outro ~~~~~~~~~~~~~~~~~~~~~~~~~~ Join me as I push the limits of what is possible with AI. I'll be uploading videos weekly - at least every Wednesday at 7:00 PM CDT!