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

HTML5&JavaScript, News


[読了時間:2分]

screenshot_60

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

2012年はJavaScript主義となる





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

screenshot_61

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

【関連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 | 書籍情報・詳しいプロフィールはこちら


maskin
Follow me

maskin

Editor In Chief at TechWave.jp
1990年代初頭からソフトからハードまで50以上のスタートアップ立ち上げを国内外で経験。平行して雑誌ライターとして疾走。シリコンバレーでガレージベンチャーに参画後は、国内でネットエイジを筆頭にスタートアップに多数関与。ブログやSNSの国内啓蒙、ソニーの社内イノベーション事業など関与。通信キャリアのニュースポータルの立ち上げ期の編集デスクとして数億PV事業に育てた後、TechWaveにジョイン。世界最大のグローバルIT系メディアであるスペインの「Softonic」の元日本編集長
https://www.wantedly.com/users/24387
https://keybase.io/maskin
maskin
Follow me

最新情報をお届け

こっちはいろいろ

PAGE TOP
More in CSS3, mozilla.org
新年の挨拶…本気伝わる「CSS3スライド」でやってみない? 【増田(@maskin)真樹】

HTMLフォームで作られたクリスマスツリーがすごい【増田(@maskin)真樹】

マトリックス風「トロン」をリアルタイムで実現するHTML5デモのスゴイところ【@maskin】

Close