コラム

Webデザインをはじめる前にやっておきたいPhotoshopの設定◎

2016-05-12

高橋 幸子

WRITER:

高橋 幸子

こんにちは!
デザイナーのsachikoです。春は新しいことを始めたくなる季節ですね。
今日は、これからWebデザインに挑戦したい!という人向けに
まずはやっておきたいPhotoshopの環境設定をご紹介します。

1. 単位をpixelに変更しよう

「環境設定」 > 「単位・定規」 > 定規:pixel、文字:pixelに設定
初期設定では単位がmmになっているので、まずは単位をWebデザイン用にpixelに変更しましょう。

2. 10pxの間隔でグリッドを表示されるようにしよう

「環境設定」 > 「ガイド・グリッド・スライス」 > グリッド線:10pixel、分割数:1に設定。
これで10pxの間隔でグリッドが表示されます。グリッドは正確にデザインするときに便利な機能です!
グリッド表示のショートカット「command+@(mac)」「ctrl+@(win)」
で表示・非表示を切り替えて確認しながらデザインを進めましょう。

3. 移動ツールでレイヤーの選択ができるようにしよう

「ツールパネル」 > 「移動ツール」 > 「自動選択」にチェックを入れる。
移動ツールでオブジェクトをクリック&ドラッグするだけでレイヤーの選択ができるようになります。
「Option(mac)」 「Alt(win)」を押しながら
クリック&ドラッグすると簡単に選択したレイヤーがコピーできますよ!

4. レイヤーのサムネイルを変更して分かりやすくしよう

「レイヤー」 > 「パネルオプション」 > 「レイヤー範囲のみを表示」を選択する。
「ドキュメント全体を表示」はドキュメント全体がサムネールになるため、
サムネールからオブジェクトが判別しにくい場合があります。
そんな時は、こちらの設定でオブジェクトが含まれる部分だけをサムネールに表示させましょう。
デザインが進むにつれレイヤーは増えていくので、
レイヤー作成時に判別しやすいレイヤー名をつけることも忘れずに!

5. コピーしたレイヤー名に「○○のコピー」と付けないようにしよう

「レイヤー」 > 「パネルオプション」 > 「コピーしたレイヤーとグループに「コピー」を追加」のチェックを外す。
レイヤーをコピーするとレイヤー名が「○○○のコピー」となりますが、
これがわずらわしい人はここでこの機能をOFFにしておきましょう

いかがでしたか?
それではみなさん、快適なデザインライフを!

リッチメディアでは、一緒に働く仲間を募集中!
私たちと共に、未来を想像して、創造していきましょう★