Adding movement to your website design isn’t a new design trend. Hover interactions have been around since the 90’s. Javascript animations took the place of Flash about the time we all bought our second iPhone. But the lowly animated GIF was always considered a poor excuse for adding movement. Remember those awful “attention grabbers” shady designers used to use?
As computing power and connection speeds improve, this format has made for some pretty funny memes. However, there’s recently been a resurgence in this image format in professional web designs and even becoming favored over embedded video.
Creative Market published “5 Professional Examples of Animated GIFs in Web Design” over a year ago.
Adobe recently published a tutorial on how to create animated GIFs using nothing but Photoshop.
We’ve always preferred to create these using something like Camtasia if we’re doing a little screen-capture thing.
Embedding a video can delay the loading of the web page a lot and, more importantly, it requires an additional step to play. The user actually has to hit the “Play” button. That’s not ideal if you’re just showing a 3-5 second screenshot demo or something. It’s even more painful if you’re just trying to add a little motion to a hero background image (sorry, HTML5 videos).
You’ll find an example of what I’m on about in our portfolio.
What do you think? Could the lowly animated GIF soon be accepted by professional web designers as just another tool in their toolbox?