UI改善にキラリと役立つ！ SVGアニメーションの作り方まとめ - ICS MEDIA
SVGアニメーションを用いると、さまざまなサイズのディスプレイで印象的なマイクロインタラクションを実現できます。マイクロインタラクションの導入によってUI改善に役立てているケースもあるでしょう（参考「SVGで始めるマイクロインタラクション入門」）。SVGでアニメーションを実装するには、CSSを使う方法、JavaScriptを使う方法、動画作成ソフトを使う方法等、さまざまなアプローチがあります。 今回は、コーダー、フロントエンドエンジニア、デザイナーの分野別のSVGアニメーションのアプローチ方法を挙げ、その特徴と具体的な実装方法について紹介します。 CSSでSVGアニメーションを実現する方法（コーダー向け） コーダーにオススメするSVGアニメーション実現方法の1つは、CSSプロパティを使う方法です。 SVGはCSSプロパティによってグラフィックの形状を変更できます。たとえば、次のコードでは、
方向感覚
ちょっと確認したいんだけどさ、自分が今いる場所から、東西南北って把握できる？ これ「当たり前だろ」っていう人と「さっぱりわからん」っていう人がいると思うんだよ。ちなみに俺はまるっきり駄目なんだけどさ、普通の人は速答できるの？ 太陽を見て、時刻と照し合わせて、それで確認するの？でも世の中には太陽の軌道とか知らないDQNもいるよね。俺は天才バカボンの歌詞で暗記したから、そこは大丈夫なんだけどさ。 もしくは、地理的な知識から簡単に導き出せちゃうもんなの？あっちが渋谷だから、こっちが北、みたいな感じで。 俺、それがさっぱり出来ないのよ。たとえばさ、渋谷の位置がわかっても、その先が北海道なのか沖縄なのか、よくわかんない。 自分が日本地図の中のどの辺に位置してるのかっていう、俯瞰の視点が全く持てない。これは、地元にいても、旅行先でも、あまり変わらないね。 あとさ、デパートなんかに入って、外の景色が見え
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
