-本日のアジェンダ-
1限目
学科 グラフィックデザイン基礎⑦
クリッピングマスクについて
2限目
学科 グラフィックデザイン基礎⑦
調整レイヤーについて
3限目
学科 グラフィックデザイン基礎⑦
フィルターについて
4限目
学科 グラフィックデザイン基礎⑦
合成写真を作ってみましょう
5限目
学科 グラフィックデザイン基礎⑦
本日のまとめ
本日のテーマ
クリッピングマスクや調整レイヤーを使用をして合成写真を作りましょう。
クリッピングマスク
クリッピングマスクとは、あるレイヤーの透明部分を使用して、その上のレイヤーにマスクを適用する機能です。 クリッピングマスクを使用すると、背面 （下） のレイヤー （ベースレイヤー） の透明ピクセルが、前面 （上） のレイヤーに対してマスクとして機能します。 … クリッピングマスクを解除することで、元の状態に戻ります。
参考サイト
- クリッピングマスクの使用方法 （Photoshop CC 2015）
- 【Photoshop】レイヤーマスク、クリッピングマスクの違いを …
- Photoshop クリッピングマスク 画像を好きな形に切り抜く …
調整レイヤー
【Photoshop基本操作】調整レイヤーとは、ドキュメントやレイヤー単位で色調補正が行えるオプション機能です。 調整レイヤーを作成すると、元画像の内容をそのまま保つことができ、設定した後でも再編集が加えられるので大変便利です。
参考サイト
ヒストリーパネル
ヒストリーパネルとは ヒストリーパネルには、Photoshopで画像に対して行った編集操作が履歴として表示されます。 履歴をたどって行った操作を確認したり、やり直したりすることができます。
参考サイト
- Photoshop入門講座 『ヒストリーパネル』を使ってみよう …
- Photoshop ［ヒストリー ］パネル機能【初心者用】 | カワイ …
- Photoshop【ヒストリー機能】で作業効率UP！ | WP-D
〜引き続きの基本操作〜
- 明るさ・コントラスト
- レベル補正
- トーンカーブ
- 色相・彩度
- カラーバランス
- 白黒
- アンシャープマスク
- パッチツール
- コピースタンプツール
- スポット修復ブラシツール
- 修復ブラシツール
- コンテンツに応じた移動ツール
- ぼかしツール
- シャープツール
- 指先ツール
- 覆い焼きツール
- 焼き込みツール
- スマートオブジェクト（レイヤーをラスタライズ）
- カンバスサイズ
- 画像解像度
- 選択範囲
- レイヤーパネル
- クリッピングマスク
- ブラシツール
- 描画色と背景色
- ファイルの移動とコピー
- 切り抜きツール
- 自由変形（ctrl + T）
- Web用に保存（従来）
スマートオブジェクト（レイヤーをラスタライズ）
スマートオブジェクトとは、「縮小と拡大を繰り返しても、劣化をしない画像データ形式」のことです。Photoshopで画像を扱うときにスマートオブジェクト化していない場合、1度でも縮小すると画像が劣化してしまいます。画像の質を保ったまま縮小・拡大をしたいときは、スマートオブジェクトに変換する必要があります。
スマートオブジェクトの解除方法「ラスタライズ」
スマートオブジェクトは画像を劣化させずに保つ形式なので、多用するとデータが重くなりがちです。スマートオブジェクトを解除することを「ラスタライズ」といいます。スマートオブジェクトをラスタライズすると、元のビットマップ画像に戻ります。
参考サイト
- Photoshopのスマートオブジェクトとは？使い方・編集方法まとめ
- Photoshopのスマートオブジェクトの上手な使い方を解説
- Photoshopのスマートオブジェクトとは！？スマートオブジェクト活用して効率よくレタッチしよう。
カンバスサイズ
カンバスとは、Photoshopにおける作業領域のことです。Photohshopで編集した画像に余白を追加したり、余分なスペースを削除したりするにはカンバスサイズを変更します。
参考サイト
画像解像度
画像解像度とは、画像の「きめ細やかさ」をあらわす数値で、1インチ（25.4mm）あたりのピクセル（ドット）数を表し、数値が大きいほど、画素の密度が高くなり、高精細になります。一般的にはdpi（Dot per inch）と表されますが、Photoshopでは、ppi（Pixel per inch）という単位で表されます。この値が大きいほど、ピクセルの密度が高くきめ細かい高精細な画像を表現できます。
印刷用の場合の推奨は350dpi(ppi)以上ですが、Webのみで使用する場合は72dpiより上げる必要はありません。これは、PCのディスプレイ自体が72dpiや96dpiしか解像度がないためです。しっかりと画像の使い道にあった解像度にその都度調整する必要があります。
参考サイト
ファイルの作成方法
Illustrator・Photoshopともファイルの作成は「新規作成」「開く」「読み込む」で出来ています。
制作した元データ「 Illustrator ならai」「 Photoshopならpsd 」から、WEB用に「jpg」「gif」「png」「pdf」等のファイル形式にすることが出来ます。
写真加工のおすすめルール
（非破壊データで作業しましょう）
「ファイルから開く（加工したい写真を取り込む）」⇒
「レイヤーパネルで複製」⇒
「右クリックでスマートオブジェクトに変換」⇒
「背景のレイヤーを非表示」⇒
「保存」
写真加工のおすすめルール
（非破壊データで作業しましょう）
「ファイルから開く（加工したい写真を取り込む）」⇒
「レイヤーパネルで複製」⇒
「右クリックでスマートオブジェクトに変換」⇒
「背景のレイヤーを非表示」⇒
「保存」
選択範囲
選択範囲によって画像の一部分または複数の部分が分離されます。特定の領域を選択することで、選択していない領域を元のままに保ちながら、画像の選択部分を編集したりエフェクトやフィルターを適用したりすることができます。
- 長方形選択ツール
- 楕円形選択ツール
- なげなわツール
- 多角形選択ツール
- マグネット選択ツール
- 自動選択ツール
- クイック選択ツール
参考サイト
- Adobe Photoshop での選択範囲の作成 – Adobe Help Center
- Photoshop での選択したピクセルの移動、コピー、削除 – Adobe Help Center
- 選択範囲を使ってみよう | Photoshop入門編 – ウェブプログラミングポータル
オブジェクトの選択と移動と削除・コピー
オブジェクトを移動させるには、｢マウスドラッグによる移動｣、｢移動コマンドによる数値指定での移動｣、｢変形パネルを使った移動｣、｢矢印キーを使った移動｣があります。選択ツールで移動したいオブジェクトを選択し、そのままドラッグします。 削除は「Delete」キーで削除出来ます。
参考サイト
ワンポイントアドバイス
Adobeのソフトは直観的に移動出来るかも？？
「出来るのかな？？？」って思ったことは試してみましょう。
レイヤーパネル
Photoshop のレイヤーは、積み重ねられた透明フィルムのようなものです。レイヤーの透明部分では、下のレイヤーが透けて見えます。レイヤーは、透明フィルムをスライドさせるように動かして、レイヤーのコンテンツを希望の位置に配置することができます。また、レイヤーの不透明度を変更して、コンテンツを部分的に透明にすることもできます。
参考サイト
- Photoshop のレイヤーの基本に関する学習 – Adobe Help Center
- Photoshopのレイヤーとは？初心者でも分かる使い方 – サルワカ
- レイヤーパネル | レイヤー | 初心者のためのフォトショップ講座
レイヤーマスクについて
レイヤーマスクとは、通常のレイヤーや調整レイヤーの一部だけを表示したり、非表示にしたりすることができる機能だ。 レイヤーマスクを扱う最も大きなメリットは、元の画像を変更せずに部分的な補正や切り抜きが行えることである。 後に修正が必要になっても、レイヤーマスクを変更するだけでよいので非常に効率がよい。
参考サイト
描画色と背景色
描画色と背景色について に移動 – Photoshop では、ペイント、塗りつぶしおよび選択範囲の境界線の描画には描画色が使用され、消去された領域やグラデーションには … アルファチャンネルでは、初期設定の描画色はホワイトで、背景色はブラックです。
参考サイト
- Adobe Photoshop でのカラーの選択 – Adobe Help Center
- 7-（2）描画色と背景色 | デザインってオモシロイ -MdN Design Interactive-
- 基本がわかる！描画色と背景色 | psgips
ブラシツールとは？
photoshopのブラシは、サイズやエッジのやわらかさを自由に変更して画面内に色々な色や形でペイントすることができます。 エアブラシ効果や特殊効果をつけたストロークを描くことができます。 ブラシの設定をカスタマイズして、専用のライブラリに追加、呼び出して利用することもできます。
参考サイト
- 【Photoshop ブラシ】基本的な使い方からレタッチでの活用 …
- 初心者向け！Photoshopのブラシの使い方と設定 – サルワカ
- 色の変更と描画のツール | Photoshop入門編 – ウェブ …
切り抜きツールとは？
【Photoshop基本操作】［切り抜きツール］とは、画像を切り抜くためのツールです。 ドラッグした範囲を四角形に切り抜き、回転や変形などを同時に行う機能を持っています。 切り抜き確定後でも、トリミング領域の移動や仕上げサイズの変更といった再編集が可能です。
参考サイト
自由変形（ctrl + T）とは？
自由変形の使い方 Photoshopの自由変形を使うことで、全体の仕上がりを見ながら画像の大きさや角度などを編集することができます。
参考サイト
- Photoshopで自由変形を使う方法【初心者向け】現役Web …
- フォトショップ 自由変形の使い方 : Retouch WebLaboratory
- Photoshop で縦横比を変えずにドラッグで拡大縮小をしたい …
Web用に保存（従来）とは？
「Web用に保存（従来）」は、圧縮率を調整するなどして保存後のデータ容量を調整できます。
参考サイト
- 画像の保存と書き出し – Adobe Help Center
- Photoshop CC2019「Web用に保存」「書き出し形式」の違いと比較
- Photoshopの保存方法まとめ：形式は？画像を圧縮するには？ – サルワカ
本日の課題
写真を編集して「jpg」のデータをドロップボックスのご自身のファイルにUPしてください。
※ネット上の写真には権利がありますので、あくまでも課題用として取り扱ってください。
■無料写真素材のサイト
※利用時する前に権利を確認（規約を一読）しましょう。