Best Practices for Background Animations
When designing background animations, you can implement different solutions, but you should consider the impact these solutions have on system resources. Consider the following:
- A flipbook-style animation (cycling through images that play continuously) seems to be an easy solution to an animated background image. However, doing a full-screen flipbook animation is not recommended because of the impact on video memory. To compensate, you may have to use a low frame rate or use small source images, which may result in a poor background animation.
- A sprite-style animation (displaying small animations over a static background) is preferable to a full-screen flipbook animation; however the same issues may arise. Sprites can be memory intensive, so compensating by reducing the size of images and lowering the frame rate may reduce the quality of the animation.
- The preferred approach to a background animation is to composite as much of the background effect as possible, using separate images and animations. This solution allows you to use a higher frame rate and higher-quality images. Implementing a composite-style background animation is more complex, but will produce a better result.
Sample Explorer
- Animation – Keyframes > all samples
- Animation – Modifiers > all samples
- Animation – Interpolations > all samples
- Animation – Types > all samples
- Animation – Transform > all samples
- Animation – Transform By Attribute > all samples
See Also