If you’re trying to create animated elements for your website, one easy option is to use Apple’s keynote application. It’s a more sophisticated application that you may give it credit for, but it can be used very effectively to create a wide range of animated effects.
The nice thing about keynote is you don’t have to use the standard slide dimensions - you can use custom dimensions to make content of any size and aspect ratio. This means you can make different animations for different devices and then use the visibility options in Blocs to make sure the correct size is displayed at different breakpoints.
When you create an animation in Keynote, you should output it as a video file at the highest quality. The resulting file can then be run through handbrake to reduce the file size and to optimise it for the web.
The final file can be embedded into your blocs project using the standard video bric set to autoplay and loop. Alternatively, you can set it up as a bloc background for creating animated headers.
A simple example of the result can be seen HERE.