Post

Figuring out a workflow to make Claude better at creating diagrams and illustrated explanations. By default it is pretty crap - see this example. Labels overlap. Arrows in the wrong place. Text too small. But it's also decent at identifying what's wrong once it takes a screenshot.

Have you tried mermaid?

Yeah I've used mermaid diagrams before, but my understand is they're very simple and standardised? The final output I'm going for with is pretty refined. These are SVG diagrams for one of my essays so I need a lot of control over the visual aesthetics. And I usually add in animation and interaction

Yeah I hate the default themes but it is customizable, though not to the standard I expect from your essays. I wonder if it could work as a first step and then grab svg.

Oh I didn't know it was customisable at all! I'll take a look. Maybe models will be better at generating initial ideas with a more structured language like that, and I can work off it

I've tried it with Mermaid so much over the years but their renderer is just so limited. It gives you no decent control over pathing and positioning, and styling is pretty basic. I do think its syntax might be helpful, so you could maybe do natural language > mermaid code > your renderer

Out of the options on this thread, D2 seems to be a better syntax though, since it more closely resembles javascript.