Inspiration pour intégrateurs #17 : Les SVG comme animations ou masques

Il y a près d'un an sortait Le BlogDuWebdesign booste l'inspiration des intégrateurs #6 centré sur le SVG. Depuis, ce format s'est fair très rare dans les inspirations des intégrateurs. Pour réparer cette injustice, je vous propose un nouvel article spécial SVG !

Connaissez-vous le SVG ? C'est un format d'image vectoriel que l'on peut utiliser dans le HTML. Léger, responsive et animable en javascript, ce format se parie très bien au CSS3 pour donner des résultats vraiment impressionnants.

Pour vous donner envie d'essayer (ou de réessayer), je vous propose une série d'exemples et inspirations centrées sur le SVG.

 

Les animations

 

Utiliser des SVG comme masques

 

Bonus : Snap.svg, la library qui vous permettra d'en faire plus plus vite

Snap.svg est une library javascript vraiment très intéressante, qui vous permettra de tirer toute la puissance de vos fichiers .ai ou .svg très simplement. Modifications temps réel, animations, rien ne lui fait peur !