LPにアニメーション入れてほしいんだけど、動きの一覧とかってある？？
LPというかアニメーションはデザイン次第やけん一覧なんて考えたこともなかったな～
今回は、以下のような方に向けた手軽に使えるアニメーションの一覧を作ってみました！
ちなみに・・
アニメーションは意図があって付けるものであって、やたらめったら付ければよいというものでは無いというのは業界では当たり前になっています。
また、最新のイカしたアニメーションだったり、LPならこれだろ的なアニメーションが存在するといった内容では無いので、そういう期待はしないでくださいw
さっそく手軽に使えるアニメーションを見てみよう！
大きくなったり小さくなったり繰り返す
ボタンとかに使われることが多いアニメーションです
See the Pen anime_cvbtn01 by とりとん (@darakerutoriton) on CodePen.
一定時間でキラッと光る
ボタンが光ってる感じに見えて結構目立つね！
See the Pen anime_cvbtn02 by とりとん (@darakerutoriton) on CodePen.
グラデーションに光る
ワンランクおしゃれなボタンになるね
See the Pen anime_cvbtn03 by とりとん (@darakerutoriton) on CodePen.
横からでてくるコンテンツ（スライドイン）
これはブロックごとだったり画像単体でも使われてるね
See the Pen slidein by とりとん (@darakerutoriton) on CodePen.
ふわっとでてくるコンテンツ（フェイドイン）
テキストだったりブロックごとにつけたり、万能アニメーションですね
See the Pen fadein by とりとん (@darakerutoriton) on CodePen.
くるっと回転する
使うシーンはあまり無いかもですが、個人的には好き
See the Pen windmil by とりとん (@darakerutoriton) on CodePen.
マウスホバーすると大きくなる
リンク付きの画像とかによく見るね
See the Pen big by とりとん (@darakerutoriton) on CodePen.
まとめ
今回は、簡単にピンポイントで付けれるアニメーションだけを紹介しました。
また思いついたり、ご要望があれば追加更新するかもですw
当ブログは、他にもwebにまつわることを紹介していますが、直接のご依頼も受け付けています♪
こういうデザインにしたい！
試してみたけどできなかった・・
などの簡単な修正でしたらワンコインからも受け付けていますのでTwitterのDMからお気軽にご連絡ください＾＾
簡単なのでぜひやってみてください〜
最後まで読んでいただきありがとうございました！