ひと昔前までは、Javascriptやjqueryを使ってテキストアニメーションを作成することが多かったですが、animationプロパティが登場してからはCSSだけでアニメーションすることが多くなりました。
ただし、より複雑なアニメーションとなると、いちから自分でCSSを作成するのは時間とスキルがどうしても必要です。しかし最近は、誰でも簡単にアニメーションが実装できるようになりました。しかも、もっと凝った動きでアレンジを加えたり、より細かい動きを調整することできるようになりました。
今回はそんなCSSアニメーションライブラリを3つご紹介します。
【vov.css】
https://vaibhav111tandon.github.io/vov.css/
使い方や画面設計がとてもシンプルで、基本的なアニメーションが揃っています。
CDNとダウンロードどちらでも実装が可能です。
【animate.css】
エフェクトの量が豊富で、一番有名なライブラリです。
CDNとダウンロードどちらでも実装が可能です。
【CSS Animation io】
ふつうのアニメーションだけ物足りない人向き。変わり種の楽しい動きが多いです。
CDNとダウンロードどちらでも実装が可能です。
いずれもCSSファイルを読み込み、指示通りのクラス名を入力するだけの簡単な手順です。
誰でも簡単にアニメーションが実装できてしまう分、どこでどういう動きを加えるのかアイデアや閃きが今後制作において勝負の決め手となることでしょう。