sounansa.net

かつてはFlashの独壇場だったアニメーションですが、CSS3とjsで結構すごいアニメーションも作ろうと思えばできるようになりました。

Flash使わなくたって、cssでもすごいここまで描画できるんだぞと言わんばかりの、凄いサンプルアニメーションを見つけましたので紹介。

自分でも作ってみたいけど、どんなツールで書いてるのでしょうかね？普通にアニメーションをべた書きコーディングは無理だよね。。。

3D page flip

本をめくるアニメーションです。

The Man from Hollywood

テキストが動くアニメーションです。このぐらいならsencha animator使えば僕でもすぐ作れそう。

Scrolling Coke Can

デモでびっくりします。ソース見てもほんとにCSSだけなんだよね。この発想に感動っす。

Animated 3D Super Mario Icon

マリオにマウスを載せるとさらに動きます。

3D Clouds

雲が変形しながら動きます。地味だけど僕にとっては一番使いたいと思ったサンプル。丁度そういう案件あるし。