ScrollTrigger for Mobile vs. Desktop vs. Ultrawide best practice

[WuGGu]

Hallo GSAP Community,

 

this is more a meta / best practice question about ScrollTrigger use.
I have created a camera movement animation in Blender, which shows a zoom out from a house to high up in the air above the city. Like if you zoom out in google maps

I rendered out all the frame images and I use GSAP to swap out the frames and trigger some text boxes to show some content above the animation. I would say a typical apple like animation about a product.
Now of course I have the challenge to generate content for mobile portrait screens, desktops 16:9 and I use for my self a 21:9 Ultrawide.

What are best practices for using this "Scrollytelling"? Do I skip this on mobile, like apple does because of performance and usability or would you say render out multiple resolutions of the animation and swap by size of the screen. It is my first time doing this kind of animation so I'm looking forward to here from you.

 

thanks in advance

 

WuGGu

[GreenSock]

3 hours ago, WuGGu said:

Do I skip this on mobile, like apple does because of performance and usability or would you say render out multiple resolutions of the animation and swap by size of the screen.

That's really up to you - I'd recommend doing some testing to see if the mobile performance suffers too much and if so, omit the animations just on mobile. You'll benefit greatly by learning/using gsap.matchMedia(). 

 

I hope that helps.