今回はPhotoshopで写真を簡単にポップでカラフルな印象にできる「ダブルトーン」の作り方をご紹介。Webデザイン、広告、動画サムネイルなどあらゆる媒体のビジュアルとして用いられている押さえておきたいグラフィックの基本手法です。*本連載はPhotoshopで作る定番グラフィックの制作工程を一から手順通りに解説するHow to記事です。

■使用する機能「グラデーションマップ」

1.写真を切り抜いてダブルトーン・グラフィックのベースを配置

まずはダブルトーンのグラフィックのベースになる写真をPhotoshopで開き、クイック選択ツールなどでモチーフ（ここでは、飛行機）部分に選択範囲を作成したら（図1）、編集メニュー→“コピー”を実行。新規ファイルを開いて、編集メニュー→“ペースト”を適用し、移動ツールでドラッグしてモチーフの位置を調整する（図2）。

オプションバーの［バウンディングボックスを表示］をオンにすると画像の周囲にバウンディングボックスが表示されるので（図3）、必要に応じてその四隅の四角いハンドルをshiftキー＋ドラッグしてモチーフの大きさを調整したり、ハンドルの外側にカーソルを合わせてドラッグして回転し、角度を調整しておく（図4）。

2.モチーフの色を置き換えてカラーをダブルトーンにする

次に、ツールパネルで［描画色］を白、［背景色］を黒に変更したら（図5）、レイヤーメニュー→“新規調整レイヤー”→“グラデーションマップ...”を選び、デフォルトのまま適用する（図6）（図7）。

次にレイヤーパネルで調整レイヤーをクリックして選択したあと、プロパティパネルのカラーバーをクリックして「グラデーションエディター」を表示させる（図8）。

続いて左側のカラー分岐点をダブルクリックして「カラーピッカー（ストップカラー）」を表示し（図9）、紺色（ここでは、［R：0、G：33、B：115］）に変更（図10）。

同様に右側のカラー分岐点をオレンジ（ここでは、［R：255、G：156、B：0］）に変更して適用する（図11）。

これでモチーフの色が置き換わり、紺とオレンジのダブルトーン画像になる（図12）。

3.文字要素や色の濃淡を調整してダブルトーン・グラフィックを仕上げる

ここでは、さらに文字要素などを配置したり、右上と左下の角に三角形のオブジェクトを配置してアクセントをつけるなどしてダブルトーンを用いたグラフィックの完成とした（図13）。

なお、「グラデーションエディター」を表示させた際にカラーバーの下をクリックしてグラデーション分岐点を追加し、ダブルトーンを別の色に設定するとより多彩な表現が可能になるので試してみてほしい（図14）（図15）。