新しいコード エディター Adobe Edge Code

今週木曜日の「Creative Cloud 道場 on USTREAM」で、Photoshop CS6 Creative Cloud メンバー専用機能を紹介する際に、「CSS 書き出し」機能で用いたコードエディターが「Adobe Edge Code」です。

昨年9月にリリースされた Adobe Edge ツール & サービスは、洗練された最先端の Web サイトを構築できる新コンセプトの強力なツールセットです。Edge Code は、その中で、HTML/CSS/JavaScript のためのソースコードエディターです。現在プレビュー版としての提供しており、Preview 2 では日本語化を果たしました。

Adobe Edge Code (プレビュー2) の主な特長

テキストエディターの持つ軽快さと、統合開発環境 (IDE) の持つコードヒント等の支援機能を併せ持ち、特にクイック編集というコンセプト・機能により、複数のファイルにまたがる Web のコーディング作業を、シンプルで洗練されたものにしてくれるクールなツールです。

書いた結果をリアルタイムに反映 〜 ライブプレビュー

番組の中で、Photoshop から書き出した CSS をコードにペーストし結果を表示してみせたのが、ライブプレビューです。一般的な Web デザイン・開発ワークフローの中で、コード編集 > ブラウザへ切り替え > 再読み込み、という行程は何十回、もしかしたら何百回と繰り返されるものです。Edge Code のライブレビュー機能は、この「再読み込み」を自動化してくれます。Edge Code とブラウザを並べてコード編集を行えば、書いた内容がそのままブラウザに視覚化され、飛躍的に作業がはかどります。

ライブビューの詳細やサンプルコード、そして Adobe Edge Code の詳細につきましては、ADC チーム Brian のコラムをご覧ください。

Edge Code (プレビュー 2) とその他の Edge ツール & サービスは、**Creative Cloud 無償メンバーシップ**からご利用頂けます。