WEBデザイン授業 5日目

ワイヤーフレームからカンプ作成

Illustrator

1.Firefoxのアドオン「Pearl Crescent Page Saver Basic 2.0」からページ全体のキャプチャーを取る。http://pearlcrescent.com/products/pagesaver/
2.新規ファイルに配置し、リンクのチェックを外して、テンプレートにチェックを入れる。（画像が薄い場合はレイヤをダブルクリックで濃度を変える。）
3.アートボードの左上を原点にする。ガイドを引いて、長方形ツール線なしでレイヤー分けをする。
4.書き出し→psd→カラーモード：RGB→レイヤ保持→アンチエイリアスオフにする。
5.Photoshopからファイルを開いて、各レイヤーを選択してガイドを吸着させる。

Photoshop

Photoshopでガイドを引く場合は、ビュー→新規ガイド→水平（垂直）方向で
位置を決める。

• 画像を他のファイルに配置する場合は、ドラッグ＆ドロップで移動させる。コピー＆ペーストは使用しない。
• 画像として扱う場合はアンチエイリアスをオンにする。テキストはタグに直接打ち込む場合はアンチエイリアスオフにする。

• マスクをする場合、長方形ツールで作ったシェイプのレイヤーの上に画像のレイヤの境界上でAltキーを押しながらクリックする。

Fireworks

基本的にFireworksでは、プロパティのテクスチャは使用しない。グラデーション機能は良く使う。

• ボタングラフィックのシンボル化

作成したボタンを選択ツールで全部選択し修正→シンボルに変換→種類：ボタンを選択する。Ctrl＋Yで複製をして、文字を修正する場合はプロパティのテキストから変更する。ボタンシンボルの変更をする場合は、ボタンの上でダブルクリックをすると別の「シンボルウィンドウ」が開くので編集できる。