サイトアイコン TechWave(テックウェーブ)

「The Box」ー JavaScriptとCSS3を使った超絶デモ 【増田(@maskin)真樹】


[読了時間:2分]

screenshot_60

 現行ブラウザで3D表現を可能にするJavaScriptライブラリ「Sprite3D.js」とCSS3の3Dトランスフォーム機能を使ったデモが話題となっている。ダンボールの上に置かれた紙の牛や風車、そして雲や太陽が3Dアニメーションで表現されている。とはいえ、平面的な画像素材を使ったもので、Sprite3D.jsによる動きのあるインタラクティブな作品に仕立て上げているものだ。

2012年はJavaScript主義となる





 開発したのはベルギーのインタラクションデザイナーBoblemarin氏。シリコンバレーではもちろん、ベルギーやドイツ、フランスのインタラクション作品でJavaScriptベースなのはもはや常識。Ajaxブームからの流れというよりは、Flash代替という色が強いようだ。

箱をドラッグすると角度を変えたり拡大縮小も可能。牛にマウスをかざすと逃げるという演出がにくい。

【関連URL】
・The Box | Demo Studio | Mozilla Developer Network
https://developer.mozilla.org/fr/demos/detail/the-box/launch
・現行ブラウザで高度な3D表現を実現するJavaScriptライブラリ「Sprite3D.js」
http://techwave.jp/archives/51690295.html

蛇足:僕はこう思ったッス
斬新なウェブ体験にJavaScriptライブラリは欠かせなくなっている。シリコンバレーではライブラリの開発とUI/UXデザインは切っても切り離せない潮流になっているが、日本はまだまだという印象。画像オンリー、動画オンリーはもう過去の遺産であり、もちろんその価値は認めるのだけど、時代に適した媒介を創造し続ける流れだけは止めてはいけないように思える。

著者プロフィール:TechWave副編集長・イマジニア 増田(maskin)真樹
 8才でプログラマ、12才で起業。18才でライター。日米のIT/ネットをあれこれ見つつ、生み伝えることを生業として今ここに。1990年代は週刊アスキーなど多数のIT関連媒体で雑誌ライターとして疾走後、シリコンバレーでベンチャー起業に参画。帰国後、ネットエイジ等で複数のスタートアップに関与。関心空間、@cosme、ニフティやソニーなどのブログ&SNS国内展開に広く関与。坂本龍一氏などが参加するプロジェクトのブログ立ち上げなどを主導。 DJ、emacs使い。大手携帯キャリア公式ニュースサイト編集デスク。TechWaveでは各種イベント、創出支援、スタートアップ支援に注力。メール等お待ちしております!
メール maskin(at)metamix.com | Twitter @maskin | ChatWork: maskin | 書籍情報・詳しいプロフィールはこちら


モバイルバージョンを終了