10/19/13 20:20:06

Playing with MindNode’s “Unfolding” Animation

For quite some time I’m not really happy with the way how nodes “unfold” in MindNode. I’ve been thinking about it and just the other day sat down and made some alternatives. I feel like sharing these here too.

As a disclaimer: Though I work with IdeasOnCanvas, I’m not involved in the design and development of MindNode!

What this means is that these are just mockups. None of these animations are official. I’m playing with motion graphics to sharpen my axe[1].

The original animation has basically the problem that it uses Beziers where, right from the beginning, all control points are staying fixed off the Bezier point. If control points and the points itself would overlap and then the control point moves out the animation looks much smoother. You can see this in the following video.

The second animation in this video is an iOS–7-style “springy” animation. Normally I’m not a huge fan of these, but it feels pretty good. My second favorite is Drift In from the second video.

I wanted to try how an animation feels that is so over the top that it’s highly unfeasible that it will ever be used in an app. Thus I created a “welding” animation with smoke:

Markus, lead developer of IdeasOnCanvas, responded: “you’re doing it wrong! With Mavericks ✨sparkles✨ are the new chic!” How was I supposed to refuse his wish?


  1. So that I can chop the bigger trees.  ↩