Ask HN: How to quickly animate system sketches and 2D diagrams?
I'm using Mermaid, Excalidraw and PlantUML diagrams to explain and document what I'm working on and they work great and are a lot better than screens of prose, but I've become aware that something is missing: motion.
Animation brings a whole lot more to explanations, making simple explanations of how request coalescing works easy to understand, token simulations [0] through to helping explain concepts like Fresnel lenses [1]. Embedding them into GitHub READMEs, tweets and documentation would be awesome.
I found Excalidraw Claymate [2] but the stop motion approach with no tweening support makes it painful to create animations where circles move from place to place. There's also Manim [3] but I think this is more for maths.
Adobe Flash used to be the go-to; what do you reach for when you want to illustrate a concept with an animated diagram?
Animation brings a whole lot more to explanations, making simple explanations of how request coalescing works easy to understand, token simulations [0] through to helping explain concepts like Fresnel lenses [1]. Embedding them into GitHub READMEs, tweets and documentation would be awesome.
Google do it to illustrate posts (e.g. https://blog.chromium.org/2021/03/a-safer-default-for-naviga...).
I found Excalidraw Claymate [2] but the stop motion approach with no tweening support makes it painful to create animations where circles move from place to place. There's also Manim [3] but I think this is more for maths.
Adobe Flash used to be the go-to; what do you reach for when you want to illustrate a concept with an animated diagram?
0. https://github.com/bpmn-io/bpmn-js-token-simulation
1. https://news.ycombinator.com/item?id=30576688
2. https://github.com/dai-shi/excalidraw-claymate
3. https://github.com/ManimCommunity/manim