今回はデザインの現場でよく目にするアニメーションを導入する方法をご紹介します。 このサイトのサービスを利用することで、簡単にSVGでのアニメーションが実現します。 無料で利用することができるのも嬉しいですね! まずは公式サイトの説明にもある通り、 Githubのサイトからアニメーションで使用するjQueryをダウンロードしておきましょう。 「jquery.lazylinepainter-1.7.0.min.js」の方を使用します。 公式サイト「Lazy Line Painter」 JSファイルダウンロード先「Github」 STEP1.アニメーションさせたいSVGファイルを用意する まずは実際にアニメーションさせたいファイルをSVGで用意します。 使用しているソフトはAdobe Illustrator CCですが、 inkscapeなどのソフトでも問題ありません。 保存形式はSVGファイル