bpmn-engine VS bpmn-js-token-simulation

Take a look at both BPMN and Node-Red. Specifically things like the backend javascript bpmn-engine, front-end bpmn modeller, and of course frontend-and-backend node-red.

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?

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

Nice work! Anything that helps visualise state I'm happy to see.

Reading the linked article I'm unclear: does Stately generate output that we run with XState? Or is it a SaaS where we design and run the state machine (a bit like Camunda provides for running BPMN diagrams)?

If not already present, a visual runner would be awesome - like https://github.com/bpmn-io/bpmn-js-token-simulation allows, to explore the state.