Illustrator使用スキル向上で作業時間の短縮・効率化

IllustratorのWEBデザイン

 コラム(イラレ2)

■Illustratorの利点 Photoshopとの比較

・PC用デザインをスマホ化する時 Photoshop:デバイスのサイズごとに別のファイルを開かなければならない。オブジェクトのサイズを拡大する場合、画質が低下する。 Illustrator:アートボードツールを使用することによって同じファイル内で複数デザインの作業が可能(CS4以降)。ベクターデータであるためオブジェクトを拡大縮小しても解像度は変化しない。 ・ファイルを引き継ぐ場合 Photoshop:オブジェクトごとにレイヤー数が増える。そのため第三者に引き継ぐ場合、グループ分け・名称設定をしなければ、レイヤーを探すことから作業が始まるため時間がかかる。 Illustrator:レイヤーが自動で増えることはないため、表示されているオブジェクトをクリックしそのまま編集可能。 optline

■使用時の設定

CS2での設定(以降のバージョンであればほぼ設定可能) ・新規ドキュメント設定 単位…ピクセル カラーモード…RGB (新しいバージョンではより詳細に設定が可能。それにより、スライス時の画像のにじみがなくなる。) ・ドキュメント作成後 メニューの[表示]から [ピクセルプレビュー][ピクセルにスナップ][ポイントにスナップ]の全てにチェックを入れる。 [スマートガイド(Ctrl+U)] 場合によっては邪魔なので必要な時だけショートカットキーを覚えて使うと便利。 設定後、デザイン作業。

 

■スライス

・スライス用のレイヤー作成をすると便利。 この時、全てのオブジェクト、レイヤーのロックを解除しておく。(Ctrl+Alt+2) ・スライス方法 【スライスツール】 使い方はPhotoshopと同様。 ※スライス時の注意 ・ピクセルの端数に注意する 変形ツールで整数表示されていても、端数が隠れている場合があります。(CS2での場合なので、新しいバージョンでは設定次第で改善可) ◎対処法 1.マウスでオブジェクトを少しずらす 最初に、[ピクセルにスナップ]にチェックを入れることで、位置の端数ピクセルはなくなる。 2.変形ツールで数値を入れなおす 変形ツールで位置もオブジェクトのサイズも整数化できるため、効果的。

■PSDで書き出し、Photoshopでスライスする

[ファイル]→[書き出し]をクリック Photoshop(*.PSD)で保存 Photoshopの方が使い慣れていれば、この方法が一番効率的。

まとめ

Illustratorには不向きな繊細な表現もあるため、全てをIllustrator で作業するのは難しい。 Illustrator、Photoshopの両方の長所を上手く生かし使っていく必要がある。 [calltoaction05]