Animating an Exploded View

Any suggestion or tip on how to achieve an exploded animation. I want that when the model loads it loads with an animation of all its parts flying to assembly the final model, something like this

Not sure if would be better doing this from blender and just call the animation, or create it with Babylon

This is an example of the model, if somebody has some idea or code example that could work with moving the parts

1 Like

Hi @arekucr and welcome to the community!

Here’s an interactive product exploded view I helped create at a former employer with Babylon.js (scroll down to see it). This was animated first in Blender as one long sequence but then the portion and direction of the animation playback is controlled in code based on user interaction.

You’ll likely be able to achieve more complex animations quicker in Blender, before exporting to Babylon.js, however you may be able to achieve a really great exploded view animation just with careful hierarchy - parent transforms, groupings and offsets - then scaling the transform positions over time. So a positions scale of 1 would be fully assembled (original position) and any positions scale > 1 would be progressively exploded.

Also, take a look at the (relatively) new ACE (Animation Curve Editor) which would really help if you’re wanting to create complex animations entirely within Babylon.js.


Thanks for the tips @inteja ! Will try the ACE al well

1 Like

@Limes2018 has been doing great work with exploded views too maybe you can get some inspiration How to change models for disappearing effects - #13 by sebavan :smiley:

1 Like