JQueryのプラグインを使用していい感じのSVGアニメーションがつくれみたいだったので、試してみました。
近頃インタラクティブな実装方法を、身につけたいと思っていて惹かれたJQueryです。
思った以上にとっても簡単にできておすすめ！
こんな感じで、まるで書いているみたいな動きをつけることができます。
作り方
1.Illustratorでsvgデータを作成する
2.LAZY LINE PAINTERでJsを作る
3.HTMLを書く
4.補足
Illustratorでsvgデータを作成する
このとき、書いた順番でアニメーションが作成されます。
LAZY LINE PAINTERでJsを作る
LAZY LINE PAINTER
のサイトの下の方にある
コンバーターにsvgをドラックするかクリックしてファイルを選択し
Jsデータに変換する
このような画面に切り替わりアニメーションが確認できる
HTMLを書く
例
svg-animation