Photoshopのガイドの使い方

Webデザイナーが知っておくべきPhotoshopのガイドの使い方

今回はPhotoshopのガイドについて解説をしていきます。ガイドの作成や使い方などについて説明をします。

Photoshopのガイドとは

Photoshopのガイドはカンバス上に引く線であり、ランディングページやロゴ制作でガイドを引くことが多いです。ガイドを上手く活用することで、ランディングページ制作やロゴ制作などの配置スペースを揃えて、綺麗にデザインをすることができます。

ガイドの作成方法

ガイドを作成するには「表示」から「新規ガイド」を選択することでガイドを引くことができます。

Phoshopのガイドライン作成方法

新規ガイドを選択すると、方向と位置を調整することができます。引きたい場所はここで最初に調整できるので、数値を入力して引きましょう。

Phoshopの新規ガイドライン

調整を終えてOKを押すと、カンバス上にラインが引かれます。

Phoshopのガイドラインを引く

ガイドの移動方法

ガイドはカーソルをガイドライン上に重ねると、カーソルのアイコンが変わります。カーソルのアイコンが変わったら、ドラッグすることで動かすことができます。

Phoshopのガイドラインをドラッグ

ガイドラインの数値指定

ガイドラインは数値を指定することで、好きな場所に引くことができます。手動で引くより、とても楽に引くこともできるので、作業効率化にも繋がります。

今回は0mmと200mmの位置で設定し、ガイドラインを引きます。

Phoshopのガイドラインの位置

Phoshopのガイドラインの位置2

数値を設定し、OKを押すと、0mmと200mmの位置にガイドラインが引かれます。

Phoshopのガイドラインの位置3

ガイドラインは「%」という単位でも引くことができます。50%と設定すると、カンバスの中心にガイドラインを引くことができるので、とても便利です。

Phoshopのガイドラインの位置50%

50%と設定し、OKを押します。

Phoshopのガイドラインの50%,の位置

ガイドの削除方法

ガイドラインを削除する方法は2つあります。1つ目はガイドラインを定規までドラッグして消す方法です。

Phoshopのガイドラインの削除方法

もう一つは「表示」から「ガイドを消去」を選択することで消去することができます。ただし、一点注意することはカンバスに引いているガイドを全て削除することになります。

1本ずつ消去をしたい場合はドラッグで消していきましょう。

ガイドの固定

「表示」から「ガイドをロック」を選択することで消去することができます。ランディングページやロゴの制作で、操作中にカーソルがガイドラインに触れて移動しないようにすることができます。

制作をする時はガイドラインの位置が決まったら、ガイドを固定しておきましょう。

Phoshopのガイドラインの固定

ガイドの色の変更

ガイドラインの色を変更するにはガイドラインをダブルクリックすると、環境設定の「ガイド・クリック・スライス」の設定画面にいきます。

ガイドのカンバスとアートボードで色を指定することで、ガイドラインの色を変更することができます。

Phoshopのガイドラインの色の変更

また、ガイドラインの線の種類を変更することもできます。色の変更の右側に線の種類を選択できる箇所があるので、実線か点線を選びましょう。

Phoshopのガイドラインの色の変更2

ガイドの活用方法

ランディングページにおけるガイドラインの活用方法はカンバスに垂直線を2本引くことで、テキストや画像がずれないように、並べることができます。

Phoshopのガイドラインの活用方法

ロゴ制作では、アイコンやテキストをガイドラインを引くことで配置を決めやすくなります。

まとめ

ガイドラインを使いこなすことで、デザインの洗練さを上げることにつながります。

・ガイドを作成するには「表示」から「新規ガイド」を選択
・ガイドラインを数値で設定し、カンバスに引く
・ガイドラインを固定、色の変更で作業効率化

関連記事

  1. Photoshopで人物の服装や物の色を簡単に変更する方法を解説

    Photoshopで人物の服装や物の色を簡単に変更する方法を解説

  2. Photoshopで画像を簡単に左右反転させる方法

  3. デザイン初心者覚えたいPhotoshopのフィルターの使い方や種類につ…

  4. クリスマスで便利なPhotoshopのテクニックやフォント、ブラシを紹介!

    クリスマスを彩るPhotoshopのテクニックやフォント、ブラシを紹介…

  5. 【初心者向け】Photoshopで画像や選択範囲を塗りつぶす簡単な方法…

  6. Photoshopで写真に映る人物を簡単に消す方法を解説します

    Photoshopで写真に映る人物を簡単に消す方法を解説します

  7. Photoshopでオブジェクトに影を付ける方法

  8. デザイナーが知るべきPhotoshopを使って文字を簡単に変形する方法5選

    デザイナーが知るべきPhotoshopを使って文字を簡単に変形する方法…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

PAGE TOP