AdobeがHTML5アニメーションのIDEを紹介

作者 Dionysios G. Synodinos , 翻訳者 大田 緑 - (株)チェンジビジョン 投稿日 2010年11月1日

セクション

デベロップメント

トピック

jquery ,

CSS ,

JavaScript ,

Ruby ,

Java ,

動的言語 ,

Markup Languages ,

Adobe ,

.NET ,

言語 ,

プログラミング ,

Architecture ,

RIA

共有 |

原文(投稿日：2010/10/27)へのリンク

例年の開発者会議でAdobeは、HTML5アニメーションのためのIDEを紹介した。Edgeというコードネームを持つこのIDEは、アニメーションをプレビューするWebKitレンダリングエンジンを持ち、Dreamweaverのようにソースコード編集モードを提供する。

EdgeのUIはAdobeの他のツールと同じ原則に従っているので、Flash開発者にはなじみのあるものになるだろう。Edgeには、ページのレイアウトを表示するステージウィンドウと、その下に様々な要素に対して今まで行われた修正を示すタイムラインウィンドウがある。ステージの右側は、DOM要素のためのレイヤパネルだ。レイヤを選択すると、プロパティエクスプローラにレイヤのプロパティが表示され、2Dと3DのCSS変換をサポートする。また、アクションやシンボルを使用するなど他にもFlashに似ている部分がある。

内部では、遷移を管理するためにEdgeはjQueryとCSSを使う。

// 特定のイベントで実行されるアクション, 例えば、ボタンがクリックされた
$.Edge.symbol.get(‘#pageHolder’).showContent(‘coffe’);

デモの例では、EdgeはjQuery UIとjQuery Easing プラグインを利用するようだ。

さらなる情報は、Mark Anderson氏がIDEプロトタイプのデモをするビデオ[Flash]をAdobeTVで視聴できる。

Adobeがどれだけこのプロトタイプを取り上げようとしているのか、そして、<canvas> や <video>のようなコアなHTML5の技術のデモをすぐにするかどうかはまだはっきりしていない。