Since CSS transitions, we see a lot of animations, movements, sometimes quite organic movements on the websites. These movements give life but are also a way to give character and identity to a website that can sometimes seem static. However, we must, on the one hand, know not to do too much (you can see the Websites where the designer / developer has put all the effects he knew) and on the other hand, you must know how to code all these movements in the most adequate way.
It is therefore with pleasure that I present today Animista, a website that started as a small side-project seeking to consolidate and organize the most frequently used CSS animations. The goal was obviously not to waste time recoding every time. Animista
On the site we find a typology of six animations:
- basic animations
- the appearance animations
- the disappearing animations
- text animations
- animations that seek attention
- and animations for the backgrounds Once you have chosen a type of animation, you just have to adjust the parameters and then recover the source code by clicking on the little button at the top right.
Apart from being a time saver (because yes, copyng for 3 times a code so that it works on Chrome, Firefox or Safari, it's to long!) It's also for me a way to understand the different operations of some animations that can sometimes be quite subtle.
In short, a website to discover and to use with moderation: animista.net 😉
Comments