BLOG

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

SHARE SHARE SHARE SHARE

こんにちは!

デザイナーのsachikoです。春は新しいことを始めたくなる季節ですね。

今日は、これからWebデザインに挑戦したい!という人向けに

まずはやっておきたいPhotoshopの環境設定をご紹介します。

 

s_shutterstock_216225727 (1)

 

1 単位をpixelに変更しよう

 

2016.3譛・blog01.fw

 

「環境設定」>「単位・定規」を表示し、定規:pixel 文字:pixelに設定

初期設定では単位がmmになっているので、まずは単位をWebデザイン用にpixelに変更しましょう。

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

 

2016.3譛・blog02.fw

 

「環境設定」「ガイド・グリッド・スライス」内、グリッド線:10pixel、分割数:1 に設定。

これで10pxの間隔でグリッドが表示されます。グリッドは正確にデザインするときに便利な機能です!

グリッド表示のショートカット「command+@」(mac)「ctrl+@」(win)で表示・非表示を切り替えて確認しながらデザインを進めましょう。

 

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

 

2016.3譛・blog03.fw

 

「ツールパネル」内「移動ツール」を選択し、画面上部のツールオプションバーにある「自動選択」にチェックを入れる。

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

 

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

 

2016.3譛・blog04.fw


「レイヤー」パネルの右上のドロップダウンから「パネルオプション」内「サムネールの内容」下「レイヤー範囲のみを表示」を選択する。

「ドキュメント全体を表示」はドキュメント全体がサムネールになるため、サムネールからオブジェクトが判別しにくい場合があります。そんな時は、こちらの設定でオブジェクトが含まれる部分だけをサムネールに表示させましょう。

デザインが進むにつれレイヤーは増えていくので、レイヤー作成時に判別しやすいレイヤー名をつけることも忘れずに!

 

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

 

2016.3譛・blog05.fw

 

「レイヤー」パネルの右上のドロップダウンから「パネルオプション」「コピーしたレイヤーとグループに「コピー」を追加」のチェックを外す。

レイヤーをコピーするとレイヤー名が「○○○のコピー」となりますが、これがわずらわしい人はここでこの機能をOFFにしておきましょう。

 

いかがでしたか?

それではみなさん、快適なデザインライフを!

 

20150901_企業理念KV_R6

 

リッチメディアでは、一緒に働く仲間を募集中!

私たちと共に、未来を想像して、創造していきましょう★

 

WRITER

Sachikoさんアイコン

Sachiko

デザイナー

Sachikoさんアイコン

RECOMMEND