| 【基本】 |
|
| １． |
便利なシングルレイヤー編集機能 |
| |
画像制作の際、便利な機能として「シングルレイヤー編集機能」がある。
ページデザインの作成など、さまざまなグラフィック要素が混在しがちなサイト画面制作においては、ひとつひとつのグラフィック要素を個別に編集したり、いくつかのグラフィック要素をまとめて編集したりする機会があると思うが、グラフィック要素が複雑に重なり合ったデザインの場合、これが意外に面倒。
そんなときに便利な機能である。
計画的にレイヤーの階層化を図りながらグラフィックの制作をすすめることで、複数のレイヤー要素を同時に編集したり、逆に選択レイヤーのみを編集したりと、簡単に切り替えが行える。 |
|  |
 |
| ２． |
簡単な破線を素早く作成するには |
| |
任意のラインを簡単な破線に変更したい場合（細かなドットの距離設定などが必要ない場合）。
ラインを選択後、テクスチャの設定を垂直線に設定、パーセンテージを100%に設定すると、実線を簡単に破線に変更することができる。
単純な破線を作成したい場合には便利な機能。
また、他のテクスチャを設定することで、違った雰囲気のラインを作成することも可能である。 |
| |
  
 |
|
|
【品質】
|
|
| ３． |
エフェクトを使用したアクア的なボタンデザイン |
| |
Fireworksのエフェクト機能を利用してアクア的なボタンを作成する。
| (1) |
ボタンのベースとなるベクトルイメージへハイライトとなる部分を考慮したグラデーションを施す。 |
| (2) |
「効果 グロー（内側）」を設定。やや暗めの色調をボタンの形状にあわせた値で設定する。 |
| (3) |
「効果 ドロップシャドウ」にてボタン色の反射した影の色を表現する。 |
| (4) |
最後にグレーの影を「効果 ドロップシャドウ」でぼかしをやや強め6-8に設定して完成。 |
|
|
 |
 |
|
| ４． |
にじんだインク文字の作成 |
| |
ストロークの設定と塗りのエッジのぼかしを利用して、インクがにじんだように見える処理の文字を作成する。
テキストオブジェクトを複製し、(1）のストロークの設定を「油彩 チップ：1」に設定。
(2）のストロークも同様の設定を行い、さらに塗りのエッジを「ぼかし：10」に設定する。
(1）を(2)の上に重ねることにより、にじんだインクのような効果を与えた文字が完成。 |
| |
 |
|
 |
|
| ５． |
複数カラーを簡単に設定 |
| |
メニューボタンなどで色相の違うボタンを複数作る場合など、上手な組み合わせを実現するには手間がかかるが、この方法を使えばさまざまな色の組み合わせが簡単に実現できる。
まず必要な数だけボタンを並べて複製したら、その横に入れたい色を混ぜたグラデーションをつくる。
次にボタンをひとつ選択して、その横のカラーをスポイトで取得。
これを繰り返すことで簡単に色の組み合わせができる。 |
 |
 |
|
| ６． |
ストロークのカスタマイズで簡単カラフル |
| |
ストロークの設定を変更することで簡単にカラフルでポップな表現が可能になる。
ストロークオプションから詳細設定を開き、「間隔」を105%程度に、感度タブ内のプルダウンから色相、明度をそれぞれ選択してランダムの値を変更する。
プルダウンから拡散を選択してランダム値を変更すると、貼り絵のような表現が可能。
ドロップシャドウやベベルなどと組み合わせることでより面白い効果が得られる。
サンプルはすべてストロークのカスタマイズで作成したもの。 |
|
 |
|
| ７． |
外部プラグインを有効に活用する |
| |
Fireworksでもエフェクトはかけられるが、Photoshopプラグインを使用することでさらに凝ったデザインが可能になる。
「ファイル>環境設定」 を選択し、「フォルダ」の追加のサポートファイルにてプラグインフォルダ（Photoshop）を指定。
設定後Fireworksを再起動すると「エクストラ」メニューにそれら外部プラグインが加わる。
外部プラグインを使いこなすと、3Dで制作されたような立体感のあるオブジェクトも制作可能。
（図はFireworksのみで作成したもの。) |
| |
 |
|
 |
|
| 【効率】 |
|
| ８． |
色相のみ異なるボタンパターンを作成する |
| |
| (1) |
基本となるボタン画像を作成する。 |
| (2) |
画像をクリックして選択し、「エフェクトウィンドウ」の「カラー調整＞色相/彩度」を選択する。 |
| (3) |
「色相 /彩度」変更のダイアログボックスが表示されるので、「色相」の数値を変更する。 |
このエフェクトで一定の数値ずつ変化させることによって、彩度／明度などは同一で色相が一定の間隔で異なるボタンのパターンを作成することができる。
また、それぞれのエフェクトを、数値が分かるように名前を付けて保存しておくことによって、エフェクトの再利用が可能になり、後の作業効率がアップする。 |
 |
|
| ９． |
インスタンスを使用したオブジェクトのグラデーション |
| |
シンボルからインスタンスを作成し、プロパティの値を自動的に中割りして、簡単にグラデーションを作成する。
オブジェクトを「種類：グラフィック」の設定でシンボルに変換。
インスタンスを選択し、「エフェクトの追加」にて「カラー調整>色調/彩度..」を選択し、設定を変更せずに「OK」ボタンをクリック。
このオブジェクトを複製し、右端まで移動させ、エフェクトの設定にて色を変更する。
2つのインスタンスを選択し、「修正>シンボル＞インスタンスをトウィーン」を選択し、ステップ数を入力。
間に作成されたインスタンスは、2つのエフェクトをステップ数で分割して、自動的に計算された値の設定で、正確で簡単なグラデーションを作成する。 |
| |
 |
|
|
| 10． |
オブジェクトを正確に且つ簡単にコピーする |
| |
アイコンなどをたくさん配置する場合などは位置合わせなど非常に手間がかかる。
その手間を軽減するPaste In Place(http://www.fwzone.net/ShowDetail.asp?NewsId=1382)というcommandを紹介する。
まず配置したい箇所にダミーのオブジェクトをおいてそれらを選択状態にする。
次に、配置したいオブジェクトをコピーしてPaste In Placeを使用すると、選択しているオブジェクトが配置したいオブジェクトに置き換えられる。
メニューの頭にアイコンを配置したい場合などはテキストをコピーして左に少しずらし、それらをアイコンにおきかえることで簡単に実現できる。 |
| |
   |
|
