【Photoshop】レイヤーを上手く使い回そう Vol.1スマートオブジェクト編

WEBデザイン

【Photoshop】レイヤーを上手く使い回そう Vo.1スマートオブジェクト編

どうも僕です、テイクフォー谷口です。
季節もいよいよ秋到来ですね。ただこの時期はまだ昼と夜の寒暖差があるので、体調管理には注意したいものですね。

さて、今回はPhotoshopで作業効率アップのためのレイヤーの上手な使い回し術についてご紹介します。
方法は用途に応じて「スマートオブジェクト」「リンクオブジェクト」の2種類ありますが、これらを2回に分けてお伝えします。
初回はスマートオブジェクトについて書きます。
スマートオブジェクトは、例えば外部から配置した画像が元の画質が崩れることなく拡大・縮小等の変形出来る機能ですが、これが使い回しに利用出来ます。

スマートオブジェクトに変換

このページデザインデータを用いて説明します

ここでは、ページの記事内の見出しの装飾パーツをスマートオブジェクトにします。

見出し装飾パーツのグループレイヤーを選択し、右クリックから「スマートオブジェクトに変換」をクリックします。

するとこのグループレイヤーはスマートオブジェクトとしての一つのレイヤーとなります。
(その際レイヤーのサムネールがスマートオブジェクトサムネールになります。)

スマートオブジェクトの編集

スマートオブジェクト化した装飾パーツを含めた見出しグループレイヤーを複製します。
(後ほどスマートオブジェクトの利便性がわかるように複製させています。)

見出し装飾パーツレイヤーを編集するために、レイヤーのサムネール部分をダブルクリックします。
するとクリックしたスマートオブジェクトの新規ウィンドウが開きますので、ここで編集することが可能になります。

ここでは見出しのテキストの左側にあった青い四角の色を変えたり、グラデーションを加えてみます。

編集が完了したら保存して終了し、ウィンドウを閉じます。
すると先程の編集によって同一のスマートオブジェクトは全て反映されます。

このようにスマートオブジェクト化させることによって編集を加えた際、同じレイヤーは一括で変更されます。
ですので同じパーツが複数存在しても、まとめて編集することが可能です。
いかがでしたでしょうか、次回は「リンクオブジェクト」について説明します。

ピックアップ記事

  1. 【お客様インタビュー】サンキョウプラテック株式会社様

関連記事

  1. WEBデザイン

    WordPressのバックアップを取ろう!BackWPUpの使い方

    おはようございます、ふきちゃんです。ご無沙汰しておりました。記事を書いていない1年3ヵ月の間、金髪をやめ、髪は暗くなり、自宅を引っ越し、自宅用のP…

  2. WEBデザイン

    WordPressを日本語化させよう!WP Multibyte Patchって?

    おはようございます、ブログ連続更新中のふきちゃんです。会社の下にあるコンビニで温かい飲み物とシュークリームを買ったら「同じ袋にまとめてもいいですか…

  3. WEBデザイン

    問い合わせフォームを追加しよう!Contact Form 7の使い方!

    おはようございます、最近はインスタグラムのおすすめ動画でひたすらポメラニアンの子犬の動画を見てひたすら癒されているふきちゃんです。韓国だけかはわか…

  4. WEBデザイン

    色相環でグラデーションを描いてみよう

    最近めっきり寒くなりまして熱燗のおいしい季節になってきました、こんにちはともさんです。今回は色相環を使ってグラデーションを描いてみましょう、という…

  5. WEBデザイン

    Photoshopで水彩風画像を作成してみよう

    こんにちは!ゆかちんです(^^)/Trick or Treat!ハロウィンですね!ハロウィンっということでゾンビ画像の作り方を紹介しようと…

  6. WEBデザイン

    【Photoshop】レイヤーを上手く使い回そう Vo.2リンクオブジェクト編

    どうも僕です、テイクフォー谷口です。ここ週末2週連続で悪天候が続きますね。来週は週末が3連休になっているので、どうにか晴れになって欲しい気持ちです…

コメント

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

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

CAPTCHA


最近の記事

  1. HTMLコーディング

    棒グラフをcssで表現してみよう
  2. WEBデザイン

    「いらすとや」の素材を使ってマンガを作成しよう!
  3. お知らせ

    中崎町に移転しました。
  4. HTMLコーディング

    EC-CUBE3でテンプレート適用後にパスが通らなくなってしまったときの対処法
  5. HTMLコーディング

    cssでグラデーションを描いてみよう
PAGE TOP