設計はIllustrator、仕上げはAdobe Flash Catalyst CS5で

Adobe Creative Suite CS5 Design Premiumに搭載された Adobe Flash Catalyst CS5は、Adobe Illustrator CS5のデータを直接読み込むことができる。そのため、サイト構築を行う際もAdobe Illustrator CS5で土台となる設計図(画面レイアウトやボタン、ロゴなど)をデザインし、Adobe Flash Catalyst CS5でコードを記述せずアクションやインタラクティブなコンポーネントを追加するというワークフローを構築できる。

Adobe Flash Catalyst CS5で作業している途中でも、Illustratorで作成した部分に修正を加えたくなったらいつでもIllustratorを呼び出しデザインを変更できるので、デザイナー自身が最終に近いところまでWebデザイン制作に関わることができる。

なお、Adobe Flash Catalyst CS5ではFXG形式(Flexフレームワークで使用される XML ベースのプログラミング言語)で保存されたドキュメントを開くことができる。Illustratorで作成されたドキュメントをFXG形式で書き出すと、FXGの使用と互換性のないオブジェクトや属性(3D効果など)はラスタライズやアウトライン化されるため、事前にラスタライズしてからFXG形式で保存する。

すべてAdobe Illustrator CS5で制作されたWeb向けのドキュメント。この状態まで作り込み、AIファイルとして保存してAdobe Flash Catalyst CS5で開く

Adobe Flash Catalyst CS5でAIファイルを開くと、「Illustrator読み込みオプション」が現れる。ここで、アートボードの大きさや画像変換オプション、レイヤーやシンボルの読み込み設定を決定できる

Adobe Flash Catalyst CS5で開いたところ。Illustratorで制作したとおり、忠実にレイアウトを再現している

修正したいオブジェクトを選択してAdobe Flash Catalyst CS5の変更メニューにある「Adobe Illustrator CS5で編集」を実行すると、バックグラウンドでIllustratorが起動し、編集画面が表示される。編集を終えたら、右上にある「完了」ボタンをクリックする

「完了」ボタンをクリックすると、「FXGオプション」ダイアログボックスが表示される。ここで、編集したドキュメントに対して保存オプションを設定できる

Illustratorでの修正作業を反映したAdobe Flash Catalyst CS5の画面。Adobe Flash Catalyst CS5でもテキスト入力や簡単な図形描画が行えるが、簡易的な機能しか備えていない。そのため、Illustratorで作り込んでからアクションやインタラクティブ機能を設定するアプリケーションとして活用したい

llustratorの性格がよりハッキリしたCS5

InDesignがデザインレイアウト、Photoshopがフォトレタッチと使い方がある程度決まっているのに対して、Illustratorはこれまでイラスト作成はもちろんデザイン、レイアウトにも使える万能アプリケーションというイメージを持っていた読者も多かったのではないだろうか。

しかし、今回のバージョンアップ内容を見てみると、やはりIllustratorはイラストとアセット(素材)制作に向けて開発されていると思い直さざるを得ない。紙媒体にしてもWeb媒体にしても、発表するメディアが何であれIllustratorでできるのは設計図作りまで。それ以上のパブリッシュが必要な場合はInDesignやFlash、Dreamweaverといった専用ソフトで作業した方が効率的だし、各メディア固有のルールに沿ったドキュメントを仕上げられる。

さらに今回は、Adobe Flash Catalyst CS5が加わったことで、デザイナーの制作環境は大きく転換期を迎えたように見える。これまでAdobe Creative Suite Design Standardで制作アプリケーションは十分、と感じていたユーザーも、Adobe Flash Catalyst CS5が収録されたAdobe Creative Suite Design Premiumに刺激されるのではないだろうか。