Show HN: Fanfa – Interactive and animated Mermaid diagrams

Nice! I always looked for a solution to animate diagrams as it would help a lot in visualising the workflow.

Feedback:

1. I tried different mermaid diagrams from https://mermaid.live/, and your animation is only working with classes and flowcharts. It didn't work with the sequence diagram (which is the most interesting to me).

2. It would be great to control the animation to be a sequence instead of one animation for all arrows at once. What I would like to do is show fellow devs the workflow from start to finish, according to the spec.

I appreciate that this is just a start, but it looks promising and has great potential. Good luck!

I don't understand who in the world needs animated something on his diagrams.

I don't understand how to use this, but it does touch on an interesting topic. I want to create interactive and animated diagrams. I normally use either Draw.io or plantuml. My goal is to better teach folks about the systems I'm building, through better visualizations. Something like IcePanel (which is way too expensive) sort of shows flows, but I'd like to have full control. Does this tool claim to support something like that? If not, are there options out there that I don't know about?

I don't see anything animated except a bit on load? I don't get it. This is on iOS Safari.

Can’t tell from that link. Is there a better layout engine?

Is there a way to control the mechanics of the animation? I poked around a bit and didn't see a way to configure what was sent down the arrows or how often - just some theming options.

For example, if you're visualizing a user flow, you might want rules about when new "objects" are sent down the pipe (example node rule: wait until received one item from each input), or how fast they travel, etc.

love it!