Adobe Creative Suite 4 発表記念セミナー レポート [大阪 08.11.25]
「Shortcut to Brilliant - 最高傑作へのショートカット」

3.Webセッション [Speaker:西村 真里子]

最高のエクスペリエンスへのショートカット
~ Web Premium CS4 で加速するデジタルコンテンツの未来

現在、「Flash Player」は日本国内ではほぼ100%の普及率を達成し、さらに、パソコン以外の携帯電話やゲーム機などのデバイスにもFlash LiteやFlash SDKが組み込まれ、2009年には10億台を突破すると見込まれているとのこと。また、最近はインターネット広告が他の媒体を抑え飛躍的に伸びており、今やWebは必須のインフラとなっています。

この状況下でアドビは、リッチコンテンツ、クロスメディア、OSやWebブラウザの枠にとらわれないアプリケーション開発環境の提供(AIR)、さまざまなデバイスへの対応といった取り組みを押し進めているということです。10月にリリースされたFlash Player 10もその一環で、トヨタ自動車の新車種iQの紹介サイトでもFlashPlayer 10の先進の機能が搭載されていますので、ぜひご覧ください。

今回、ご紹介するWeb Premium CS4には、これからのWebデザインに求められる要素を効率よく表現するためのツールが全て揃っています。

(Web用の素材づくりという視点からPhotoshopやIllustratorの機能説明もあったのですがスペースの都合上、割愛させていただき、Webの制作に関わるツールの主な機能をピックアップしてご紹介します)

Fireworks CS4

アプリケーションの機構を一から作り直したことでパフォーマンスも格段に向上し、安定して使っていただける環境をご提供しています。CS4ではPhotoshopやIllustratorとの互換性も増し、PhotoshopやIllustratorの色味やテキスト情報をそのまま読み込め、その画像をWebやFlash、Flexなどに書き出せます。

また、Webサイトでよく使われるグラフィックシンボルやアイコンなどが共有ライブラリに多数用意されているので、新たに作る手間が省けます。さらに、ピクセル単位でサイズを表示するルーラー機能や日本のユーザー様からリクエストされ導入された「ものさしツール」など、ピクセルベースで作業される際に便利な機能が満載されています。

クライアントとの打合せや確認作業をスムーズにしてくれる機能として注目なのが、クリック操作やページ間のリンク情報も確認可能なデザインカンプとしてPDFファイルに書き出せる機能です。しかも、そのPDFにはセキュリティをかけたり、印刷だけを許可する、編集も許可するなどの設定も可能です。もちろんPDFファイルなので、クライアントに訂正指示などを書き込んでメールで戻してもらうといったこともできます。今まで、Photoshop やIllustrator で制作したデザインカンプをPowerPointなどでプレゼンし、確認が取れてから、また一からWebアプリケーションで作り直すといったワークフローを、より効率的でスピーディかつ洗練されたものに変えてくれそうです。その他、Fireworksの画像だけでAIRの書き出しが簡単に行える機能も整っています。

CS3ではMacromediaとの統合後、すぐのリリースだったのでインターフェイスなども多少違和感がありましたが、CS4になり完全にアドビ製品に生まれ変わり、Webサイト構築の前段階のワークフローを支える中心的な役割を果たすツールになったといえるでしょう。

Dreamweaver CS4

Fireworksの画像を書き出すのがDreamweaver。Fireworksとともに今年10周年を迎え、さらに機能強化されています。インターフェイスもFireworks同様、一新されています。

その他、改良ポイントとしてはデュアルスクリーンモードの採用。日本のユーザーのリクエストに応え、デザインビューとコードビューを左右に分割して表示できるようになりました。

注目すべき新機能として、WebKitというレンダリングエンジンを採用した「ライブビュー」があります。これは、AjaxやFlashを使ったサイト制作時に、いちいちブラウザーを立ち上げなくてもDreamweaver上でプレビューできるというものです。さらに、JavaScriptでページを動的に書き換える際にHTMLコードの変化をリアルタイムで確認できる「ライブコード」機能も作業効率を上げてくれます。

また、デザインビューに開いているHTMLファイルに関連しているCSSやJavaScriptなどの外部ファイルを「関連ファイル」バーに一覧表示し、クリックで切り替え編集できるのも非常に便利な新機能のひとつです。

Flash CS4

Flash CS4も「Shortcut to Brilliant」な機能を初心者の方にも、いままでFlashを使ってこられた方にもご提供できるようになっています。

例えば、アニメーション機能もフレームベースからオブジェクトベースのアニメーションに変更したことで、いままでより遥かにシンプルな操作で、より直感的に作成できます。さらに、アニメーションのコントロール機能を司る「モーションエディタ」で回転、サイズ、位置、フィルタなどを細かく設定し、エレガントなアニメーションを作りだせます。

また、「モーションプリセット」という新機能は自作のアニメーションを登録して、別の機会に使い回したり、あらかじめ用意された40個近くのプリセットを利用することもできます。

シンボルの入れ替えというのも、今までは非常に手間のかかる作業でしたが、Flash CS4なら元のシンボルを削除してもタイムラインは残ったままですので、新しいシンボルを配置するだけで完了です。

表現効果もパワーアップしています。「3D回転」、「3D変換」というツールが加わり、アニメーションに奥行きを持たせられるようになりました。

もう一つパワフルなツールとして紹介されたのが「ボーン」というツールです。例えば楕円形のシンボルを連結してクサリ状のアニメーションを作成したり、クレーンやロボットアームのような間接の動き(インバースキネマティクス:IK)が表現できるようになりました。

音の編集も新搭載の「サウンドブース」機能で可能になっています。その他、InDesignやAfter EffectsからXFLファイルに書き出すことで、ファイルを読み込むことができます。

また、Adobe Labsで配布されている「Text Layout Framework」をインストールすることで、縦書きのFlashも扱えるようになります。

ビデオの書き出しもAdobe Media Encoderを利用して、H.264の書き出しやエンコード時のCBR/VBR設定、1パス/2パス設定もサポートしています。

Device Central CS4

いまやモバイル向けのコンテンツの書き出しは不可欠なものですが、その確認作業は非常に手間のかかるものです。それぞれのデバイスのプロファイルを入手するだけでも面倒です。Device Central CS4では、「オンラインライブラリ」が携帯電話やゲーム機など新しい機種がリリースされるごとにアップデートされますので、そこから必要なデバイスを選ぶだけで確認できます。

また、確認はひとつのデバイスだけでなく複数行う必要がありますが、今回のバージョンでは、「自動テスト」を使うことで、ひとつのデバイスでのテストスクリプトを記録し、複数のデバイスで一気にテストスクリプトを実行できます。しかも、映像やFlashアニメーションがどのように表示されるかをクライアントに確認していただく場合などには、ムービー形式で録画して提示することも可能になっています。

3.Webセッション [Speaker:西村 真里子]3.Webセッション [Speaker:西村 真里子]3.Webセッション [Speaker:西村 真里子]3.Webセッション [Speaker:西村 真里子]