Plan Like A Programmer_02
Apr 15, 2025
A visual evolution of my personal problem-solving framework, from a quick sketch to a polished Mermaid flowchart designed to provide guidance under pressure.
This is a follow-up to my earlier post where I shared the idea of creating a visual diagram for my master problem-solving plan. After a few iterations and a bit more time than expected, I’m excited to share the result!
Master Plan 1.0 - Mermaid Flowchart
Below is the Mermaid code that generated my finalized flowchart. Both of which can be viewed here in the Mermaid Live Editor.
Accept the challenge — stay pragmatic] B[Identify the problem
Write a clear, testable problem statement] C[Create **your** plan
Break it down if needed — your plan is best] s4[Set a time limit
Define checkpoints] A-->B-->C-->s4 end subgraph "Implement" D[Test your problem statement
Look for support or contradiction] E[Checkpoint
Are you off-track?
Does the problem need restating?] Fa[Solved 🎉] Fb[Unsolved
Iterate, review
Take breaks] E-.->Fa E-.->Fb D-->E end subgraph "Advice" G["Building confidence is as important as solving the problem"
In the face of ambiguity **REFUSE** the temptation to guess
Drop expectations — focus
Remember the importance of plans, and planning] end Start --> Implement --> Advice
How did we get here?
Master Plan v0.01 - Handwritten Prototype
I started with a handwritten version of my plan - something quick and functional that I kept on my desk. While it served me well, it lacked the clarity and structure I was aiming for. Additionally I still wanted the longevity, and ubiquitous accessibility of a digital version.
Master Plan v0.02 - Obsidian Canvas
Next, I tried sketching a digital version using the draw tool in Google Docs, which ended up being more trouble than it was worth. After some frustration, I decided to look for a tool that was more flexible and lightweight.
Thankfully I was spending more time in Obsidian (which I highly recommend), and decided to give the Canvas feature a try. That version came closer to what I envisioned, but formatting it for print was a challenge I never quite solved.
Eventually, I stumbled across a blog post by Faesel Saeed that introduced me to Mermaid, and that changed everything.
Why Mermaid?
Mermaid lets me create clean, structured flowcharts using plain text - perfect for someone like me who learns visually. Unlike tools like Lucidchart or Confluence, which always felt clunky and over-engineered, Mermaid is lightweight and intuitive. It fills the gap between quick sketches and polished diagrams.
Creating this version of the master plan was fast, satisfying, and honestly fun. I now use Mermaid regularly to understand and document how systems interact - and I can’t recommend it enough.
I hope this walkthrough inspires you to build your own problem-solving map. Whether it’s handwritten, digital, or somewhere in between, the key is to make something that works for you. Keep iterating, keep improving, and don’t be afraid to make it your own.
Resources
- Mermaid Live Editor - Master Plan Flowchart
- Mermaid Documentation - Intro to Mermaid syntax
- Faesel Saeed - Why every developer needs to use Obsidian