■チュートリアルのトップへ　 ■コラムのトップへ　■オリジナルプロダクト　■制作料金


MACWORLD Expo開催期間中にDreamweaver Fireworks Studioが発売になり、僕はイベント開催中にずっとこのデモをやってきた。それぞれのステージは30分だったけど、2つのソフトウエアを30分に凝縮して解説するのは、かなりハードな作業だ。けどおかげさまで、イベントのデモを見てくれた人からは「よくわかった」という感謝のメールとかを何本かもらって、「やってよかったなぁ…」なんて思っている。だけど、それはMacintoshユーザーから…。Windowsユーザーの人からは「ぜひ、Windowsのイベントもして下さい」とか「またデスマッチセミナーして下さい」とか言われている。

そこで、今回はDreamweaver Fireworks Studioについての解説をコラムの形でまとめて、お贈りしたい。
Fireworksとは、バージョン1（それもベータの英語版）から関わってきて、デジクリで僕のコラムを読んでいる人には、お馴染みのソフトだ。市販ソフトとしては世界初の「Webグラフィック」ソフトである。今までにも何度か書いてきたが、従来のグラフィックソフトがWebに対応した…とかWebグラフィックも作成できる。というスタンスと、最初からWebグラフィックを生成するために生まれたソフトでは、色々な機能の部分で大きく差が出てくる。

僕自身、コンピュータでデザインの仕事をして10年以上が経過した。DTPの黎明期から関わってきた僕としては、Illustrator、Photoshop、QuarkXPressというのは三種の神器と言われるくらい手に馴染んだソフトウエアである。特にグラフィックに関してIllustratorとPhotoshopは隅々の機能まで知り尽くしていた。その僕が、あっさりとFireworksに道具を変えてしまったのは職業が変わったからである。DTPデザイナーからWebデザイナーになった。それだけのことなのだ。

なぜ、FireworksでWebの仕事ができたか？それはFireworksがIllustratorの機能とPhotoshopの機能の両方を持っていたからである。Fireworksのバージョン1を使っている頃、他のクリエイターに「Fireworksってどんなソフトですか」と聞かれて「IllustratorとPhotoshopを混ぜて、Webに特化したソフトです」と答えてきた。

実際に今でも、IllustratorやPhotoshopを使ってWebデザインをされているクリエイターは多い。手に馴染んだ道具はなかなか手放せない。それはそれで良く解るし、そういった人々に「Fireworksを使わないとアカン！」と怒るようなことはしない。事実PhotoshopもWebという仕事が世の中で大きな割合いを占めてきた近年は、Webに対応するさまざまな機能が追加されてきている。ラスター画像を操作させたら文句なしに重戦車級のソフトウエアである。これにプロペラやスクリューやドリルがくっついてきて、なんだか最近のPhotoshopは完全武装の要塞のようだ。（それをカッコイイと思うか、ブサイクと思うかは個人の自由だけど）

Fireworksもその辺は心得たもので（笑）、バージョン1の時点からIllustratorやPhotoshopのデータをそのまま読み込む事ができた。IllustratorのパスはそのままFireworksで操作できるし、それぞれのレイヤー構造もそのまま（レイヤーの名称さえも）Fireworksで引き継ぐことができたのである。

Fireworksはその後バージョンアップを繰り返して、Fireworksで作成したベジェ曲線によるパスデータをIllustrator形式で書き出すことが可能になったのである。またFireworksのパスオブジェクトを選択した状態で「ベクターをコピー」を実行すると、そのままクリップボード経由でIllustratorやFlashにベジェ曲線によるパスデータをペーストすることができるようになっている。

これで、パスに関する編集はFireworksもIllustratorもイケイケなのである。パスの作成に関してどちらでも好きなソフトを使って編集すればよい。Illustratorのフィルタを使って、パスの変型を行ったり、Fireworksしかないパスの直接変型や領域変型も有効に使えばよい。

ビットマップ画像（ラスター画像）に関しても同じだ。消しゴムやスタンプなどの直接ビットマップを加工するのは、FireworksでもPhotoshopでも同様の機能が備わっている。またFireworksならばライブエフェクトを使って、Photoshopのフィルタを適用することができる。つまり、一旦モノクロやセピア調にして、さらにトーンカーブやレベル補正、また「海の波紋」などのワケのワカランぐにゃぐにゃなフィルタを適用しても、Fireworksなら、ライブエフェクト機能をオフにするだけで、いつでも元の状態に戻す事が可能なのだ。（ちなみにこれをPhotoshopでやろうとすると、元データを別に保存しておかなくてはならないので、大変なコトになる）

今回からFireworksに「ビットマップマスク」という新しい機能が追加された、これはビットマップオブジェクトに対してマーキーツールを使って選択範囲を指定する。この選択範囲の編集もPhotoshop同様に拡大や縮小、周囲をぼかすなどの機能が備わっている。そして選択範囲に対してマスクを適用する。すると、その部分だけがマスクとして保護されたマスクが実行される。レイヤーパネルを見ると、現在のビットマップオブジェクトの横にモノクロのマスクの画像がサムネールで表示されている。これは何だ？そう、Photoshopのマスクレイヤーと同じ機能なのである。

そして、今回はそのビットマップマスクを適用した状態のまま、FireworksではPhotoshop形式で書出しを行う事が可能になったのである。が〜ん！（嬉しいショック）つまりFireworksはIllustrator同様にPhotoshopともイケイケになってしまったのである。

グラフィックを作成する…という意味に於いて、クリエイターはFireworksでもIllustratorでもPhotoshopでも好きなソフトを使えばよいのだ。「だから、今まで通りIllustratorやPhotoshopを使っている人は無理にFireworksでグラフィックを作らなくてもよいですよ！」と僕は毎回マクロメディアのブースで声を大にして叫んでいた。とてもマクロメディアブース内の発言とは思えない。展示会という場所に於いて、最大の敵（笑）メーカーのソフトを絶賛していたのだから…。これが社員ならクビが飛ぶかも知れない（笑）。

しかし、画像作成という部分に於いては、このような過程はWebサイト構築という視点から考えると、ほんの下準備に過ぎないのである。DTP作業で原稿をワープロやテキストエディタを使うようなものだ。今回のDreamweaver Fireworks Studioの目的は、僕が解釈するに「Webサイト構築」なのである。決して「Webページデザイン」が目的ではない。

それでは、なぜFireworksがWebサイト構築に適したソフトなのであるか？それはサイトを構築するに際して、いかに短時間で高品質なものを生産できるか？という部分と、サイトの宿命である変更と更新に最も効果的に機能するソフトウエアであるからだ。

単に、グラフィックの管理という部分だけでも、ライブエフェクト、各種設定ファイルの保存、スタイル、シンボル、コマンド、プロジェクトログ、検索置換、URLライブラリ、バッチ…ともの凄い機能が備わっている。そして何より、サイトを構築するためのDreamweaverとの連携が今回のバージョンで完璧になったのである。詳しくは次号で詳しく説明する。

イベント期間中、今回の僕のデモのテーマは「Webサイト構築」、実際にデモを開始する前に画面で見せていたFlashのオープニングムービーをサイトにアップした。イベントのオープニングムービーのため、若干ファイルサイズは大きいかもしれないが、興味のある人はアクセスしてください。

※この原稿は日刊・デジタルクリエイターズに掲載したものです。
　　

このWEBサイトに掲載されている文書・画像・映像・写真等の著作権はSilicon Cafe'に帰属し、許諾なく 複製・頒布を行うことは 法律で固く禁じられています。 Copyright (C) 1995-2003 Silicon Cafe'. All rights reserved