写真に鮮烈な彩色を施しステンドグラス風に見せる | デザインってオモシロイ -MdN Design Interactive-

写真に鮮烈な彩色を施しステンドグラス風に見せる

2024.5.19 SUN

【サイトリニューアル!】新サイトはこちらMdNについて

いますぐ自分の“持ち技”に加えたい グラフィカルに攻めるデザイン表現


design28
写真に鮮烈な彩色を施しステンドグラス風に見せる

手のシルエットの周囲にさまざまな色のついた写真素材をレイアウトし、ステンドグラスのような雰囲気を演出したビジュアル。写真をいったんモノクロ化したうえで、レイヤースタイルを使った着色を施すことにより、このようなカラフルなイメージに見せることができる。
TOOL Photoshop CS/CS2

写真に鮮烈な彩色を施しステンドグラス風に見せる
制作・文 NATSWORKS
url. www.myspace.com/natsworks



Step1 切り抜いた手の写真からシルエットを作成
手のシルエットとラインを組み合わせる

写真を基にシルエットを作成する。まず、Photoshopで完成サイズの新規ファイルを作成したら、切り抜いた手の画像をコピー&ペーストで配置する。続いて、配置した手のレイヤーをCommandキー+クリックして選択範囲を作成したら、これを黒く塗りつぶして手のシルエットを作成1-1。さらにブラシツールなどを使ってシルエットのレイヤー上にラインを描き込み、コマで区切られたような状態にしておく1-2

1-1
1-1

1-1

1-2
2-1

1-2


step2シルエットの周囲に写真素材をレイアウトする
レイヤーマスクを使って配置した写真にマスクをかける

手のシルエットの周囲に写真素材を配置していく。まず、風景などの写真素材をPhotoshopで開いたら、これをコピー&ペーストで作品ファイル上に配置し、シルエットのレイヤーの背面に移動2-1。続いて、多角形選択ツールなどを使ってラインで区切ったコマの部分に選択範囲を作成したら、レイヤーメニュー→“レイヤーマスク”→“選択範囲外をマスク”で写真をマスクする2-2。これと同じ要領で、シルエットの周囲にさまざまな写真素材をレイアウトしていった2-3

2-1


2-2
2-2

2-3
2-3


step3モノクロ化した写真にカラフルな着色を施す
レイヤースタイルを利用して写真に色をつける

写真に鮮やかな色をつけていく。まず、STEP2で写真を配置したレイヤーを選択したら、イメージメニュー→“色調補正”→“彩度を下げる”で、それぞれの画像をモノクロ化する3-1。さらにレイヤーメニュー→“レイヤースタイル”→“カラーオーバーレイ...”を使ってモノクロ化した各写真に着色を施し、ステンドグラスのようなイメージを演出した3-2

3-1
3-1

3-2
3-2


Step4ビジュアルにテクスチャの質感を加えて仕上げる
Photoshopのフィルタで紙の質感を加える

質感を加えてビジュアルを仕上げていく。まず、新規レイヤーを作成して最前面に移動したら、これを白で塗りつぶす。続けて、“スケッチ”→“ノート用紙...”フィルタを実行4-1。さらにこのレイヤーを[描画モード:乗算]に設定し、絵柄にざらざらしたテクスチャ感を加えたら完成だ4-2

4-1
4-1

4-2
4-2

>>「モザイク状に分割してカラフルな文字を表現」を見る



『MdN』2009年3月号(vol.179)

本記事は『MdN』2009年3月号(vol.179)からの転載です。
特集のすべての記事は誌面でお読みになれます。

月刊『MdN』掲載記事号の情報はこちら
楽天ブックスで買う
amazon.co.jpで買う


twitter facebook このエントリーをはてなブックマークに追加 RSS
【サイトリニューアル!】新サイトはこちらMdNについて

この連載のすべての記事

アクセスランキング

8.30-9.5

MdN BOOKS|デザインの本

Pick upコンテンツ

現在