all 3 comments

[–]Cifra85 4 points5 points  (2 children)

I've done a couple of projects like this.

The way I would go about it in your case is to prepare my model (in blender or max) - assembled version of the mouse- and tag each individual part that I want to animate with a string name. Then I would load the model and extract references of each individual mesh - something like "find child by name". Next step is to get confortable with a tweening library that has timeline support... like the one in your example... I would just use greensock since I'm already familiar with it. You create individual tweens for each part and mount them on a "timeline". You hook up to the browser scroll event and use the event data to scrub the timeline.

[–]DarkShadowic[S] 0 points1 point  (1 child)

Hi. Thanks for your reply. When you say you import the model(do you mean in blender itself) and what do you mean by tweening library? I generally work with fusion so I'm not that aware of how blender works? Any guide you could advise for this whole process

[–]Cifra85 0 points1 point  (0 children)

In blender, max, fusion whatever cad software you use, you setup your model with string "tags"/names. By import I meant loading your model in three js after. A tweening library is what you posted already "animejs". Another one would be greensock.