I’m planning to use photoshop to make an animated image – a 3D object that spins like a top.
A webpage I’m making will show several identical images which spin exactly the same way.
Also, they all need to “wobble” back and forth (rotate a few degrees CW/CCW), but each at different speeds…
My question is, should I make 1 spinning-top image and then use css/js to handle the wobbling, using that same file for the image source? Or should I make several images in photoshop each with their unique wobble built into the animation?
Are there any pros/cons I should consider for either way?
What audience will your site be serving? If it’s large scale site, you should make your decision based on which option uses the least bandwidth.
If you’re catering to a small audience, I would use whatever effect looks best.
As for the animation, I would control the wobble using javascript. It’s better because you’ll have something you can modifying later vs a static animation which you might have to remake.