geta1972TweetPocketCheckこんにちわ。最近一番面白い作業は、過去に作ったプログラムのリファクタリングです。物事に飽きっぽい僕は、新しくサービス構築や、ライブラリを作ると、これまでの自分のコーディングルールをもうちょっと効率的に書けると気がついてしまいます。これは、コーディングをする人が誰もが経験する事ですが、それが何度か積み重なると、以前のコーディングルールと大幅に変わってきてしまい、過去に作ったプログラムがとても陳腐に見えてしまいます。なったら、自分にとっての最新の効率の良いプログラムに直さずにはいなれなくなってしまいます。あ〜githubにアップしたやつ、全部なおして〜〜〜!そんな中、前にloadingアニメをHTML+CSS版で作ってたやつを、最近では、svgファイルで一括管理できるのが面白くて、使い勝手も非常に効率が良いため、ちょびっとずつ作り直しています。今回は、前に作ったcubeアニメをsvgにリファクタ(Translate?)してみました。cubeアニメーション以前のloadingアニメ記事http://wordpress.ideacompo.com/?p=11288いくつか掲載している中で、個人的にお気に入りのcubeアニメをsvgファイルに以下の書き込みをするだけで実現できます。CodePen.今日の一言svgアニメは本当に面白く、内容はほぼcssアニメなのですが、描画ができ、より自由度の高いsvgを使ってのアニメーションは、HTMLタグ+CSSのアニメーション処理と比べると、可能性は無限大な感じです。過去に作ったパーツなども、今回のようにちょびっとずつ作り直していけると、楽しめる&ホームページ制作の効率アップになること間違いありません。同じように気に入ってくれた方がいらっしゃったら、どんどんコピって使ってくださいませ。コメントをキャンセルメールアドレスが公開されることはありません。*サイト次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。