Webデザイナー、UI/UXデザイナーの@sdesignlaboです。
Photoshop(フォトショップ)で写真をポップアート風に加工する方法を徹底解説します。
フォトショ初心者の方にも再現できるよう、順を追ってポップアートの作り方を解説します。
写真のイメージを激変させてバナー・Webサイト・フライヤー等の印刷物といったクリエイティブに活用してみませんか?
これからPhotoshopを始められる方、更にフォトショップを使いこなされたい方にオススメですよ。
どんな加工ができるの?

普通の写真をポップアート風に加工した例です。
Photoshopを使えば写真の雰囲気をガラリと変える事が可能!
アンディ・ウォーホルやロイ・リキテンスタインなど、1960年代のアメリカで流行したポップアートのような表現をされたい方にオススメです。
ポップアート風に加工する手順
フォトショップを使って写真をポップアート風に加工する方法です。
Photoshopを導入しましょう
当記事の内容を実践するにはPhotoshop(フォトショップ)が必須です。
未導入の方は
Adobe公式サイトから導入できます。
なお、AdobeCCのプランは
コチラの記事で徹底解説しています。
STEP.1
画像を準備&スマートオブジェクトに変換
加工したい画像をPhotoshopに読み込みます。
ドラッグ&ドロップで読み込み可能。
スマートオブジェクトに変換しておきましょう。
素材にこだわりたい方は
AdobeStockが最強!3億点以上の商用利用可能で高品質な素材が制作を加速させてくれますよ。
詳しくは
コチラで解説しています。
STEP.2
シャドウ・ハイライトを適用
スマートオブジェクトに変換したレイヤーをアクティブに。
[
イメージ ] → [
色調補正 ] → [
シャドウ・ハイライト ] を適用。
するとレイヤーパネルに [
スマートフィルター ] が追加されます。
色調補正などが再編集できる便利機能です。
シャドウ・ハイライトのダイアログ画面が開きます。
左下の [ 詳細オプションを表示 ] にチェック。
シャドウ
量:55% 諧調:50% 半径:30px
ハイライト
量:45% 諧調:50% 半径:10px
諧調
カラー:+50 中間調:-20
シャドウのクリップ:0.01% ハイライトのクリップ:0.01%
最後に右上の [ OK ] をクリックして確定します。
STEP.3
油彩を適用
[
フィルター ] → [
表現手法 ] → [
油彩 ] を適用。
ブラシ
形態:7.0 クリーン度:4.0
拡大・縮小:10.0 密度の詳細:10.0
最後に右上の [
OK ] をクリックします。
すると左図のような状態になります。
油彩で描いた様なタッチになりました。
複数 [ 油彩 ] を重ねるとさらに単純化が可能。
左図は同じ油彩を計5回適用しています。
※油彩の項目をすぐ上に [ Alt + ドラッグ ] (Mac:Option + ドラッグ) すると油彩をコピペできます。
STEP.4
色相・彩度を調整
[
イメージ ] → [
色調補正 ] → [
色相・彩度 ] をクリック。
彩度:-100
明度:+2
※
調整レイヤーの色相・彩度でも構いません。
すると左図の状態になります。
グレースケールの絵になりましたね。
STEP.5
べた塗りを追加
[
レイヤーパネル下部 ] → [
調整レイヤー ] → [
べた塗り ] を追加しましょう。
べた塗りの色:#528d6c
レイヤーの描画モードを [
ハードミックス ] に変更します。
すると左図の状態になります。
目が痛くなるような配色ですが、後に変わります。
STEP.6
白黒を追加
[ レイヤーパネル下部 ] → [ 調整レイヤー ] → [ 白黒 ] を追加。
レッド系:40
イエロー系:60
グリーン系:40
シアン系:60
ブルー系:50
マゼンタ系:50
すると左図の状態になります。
白黒でカッコいい雰囲気の絵になりました。
表現によってはこの段階で終わらせるのもアリですよ。
FINISH
グラデーションマップを追加
[ レイヤーパネル下部 ] → [ 調整レイヤー ] → [ グラデーションマップ ] を追加。
グラデーションの色味は左から
#2f283b , #b54d45 , #76adbd , #dcdbd6
お好みで調整してください。
以上でポップアート風の加工が完了しました。
文字ツールで文字を添えてみるのも良いでしょう。
Photoshopと写真があれば画力ゼロでも短時間でポップアートを作る事ができます。
加工前の写真です。
雰囲気が全く違う絵になりましたね。
フォトショ初心者の方にも再現できるので是非お試しください。
フォトショップ未導入の方は
Adobe公式サイトから入手できますよ。
更に高品質なポップアートエフェクト
コチラの記事で左図の様な更に高品質なポップアート加工が1分でできるフォトエフェクトPSDの使い方と作例を解説しています。フォトショ初心者の方でも超簡単にプロ品質の加工が施せるチート素材を併せてチェックされてみませんか?
さらに高品質なポップアート加工
上記で紹介したポップアート加工をさらに発展させたPSDファイルです。
全て商用利用可能!
フォトショップ初心者の方でも超短時間でサンプルのような仕上りにできるチートアイテムです。
#1 Duotone Poster Photo Effect
デュオトーンで表現されたポップアートが作れるエフェクトモックアップPSDです。
写真を準備してPSDを適用するだけでサンプルのようなイメージが簡単に作れます。
ダウンロード
#2 Pop Art Effect Mockup
まるで現代アートのようなエフェクトを与える事ができるPSDです。
オレンジ色に差し色の青が効いてカッコいいですね。
ダウンロード
#3 60s Pop Art Photo Effect
まるでアンディ・ウォーホルの作品のような加工ができるエフェクトモックアップです。
マリリンモンローの超有名な絵ですね。
ダウンロード
#4 Vector portrait Effect
白黒のアメコミのようなタッチが再現できるエフェクトです。
色や背景の模様など、非常にソソる世界観が一瞬で作れますよ。
ダウンロード
#5 Vintage Vector Art Retro Photo Effect Mockup
まるで60年代に流行したポスターを倉庫から出してきたような質感が再現できるエフェクトモックアップPSDです。
ポップアート加工だけでなく、紙の質感もリアルに再現できる高品質なエフェクトですよ。
ダウンロード
#6 Pop Art Retro Print Effect Mockup
ドットで表現されたポップアートのエフェクトです。
粗い印刷のような質感が非常にカッコいいです。
ダウンロード
写真を大変身させるエフェクトPSD
全て商用利用できるエフェクトモックアップPSDです。
フォトショ初心者の方でも一瞬でプロの仕事が再現できますよ!
ワンランク上のテンプレート素材
Photoshopを学習する上で、プロが作成した生データを研究する事は重要です。
下記記事でプロが作成した高品質で汎用性の高いテンプレート素材を紹介しています。
全て商用利用可能、テキストや画像を変えるだけでプロの品質が出せます。
制作の手間を劇的に軽減してくれるだけでなく、スキルアップの為の教材としても最適ですよ。
例えばクリエイターの就職や転職に必須のポートフォリオ。
プロのテンプレートで美しいレイアウトや余白、文字サイズが一瞬で作成可能。内定獲得の可能性が格段にアップします!
厳選!ポートフォリオ用テンプレート45選
良質な素材をもっと見る
上記で紹介しているテンプレートはごく一部。
下記記事で良質な素材を紹介しております。併せてチェックしてください!
おわりに
以上、Photoshop(フォトショップ)で写真をポップアート風に加工する方法についてでした。
ビビッドな色味でパンチのある絵が短時間で作れます。
仕上がったポップアート風の画像に文字やデザインを追加してバナーやWebサイトなど、様々な用途に活用できます。
また、作成したPSDは簡単に別の画像に流用可能。
同じテイストのポップアート風画像を簡単に量産できますよ。
また、noteにて当記事で作成したエフェクトPSDを配布しています。
ではまた!
フォトエフェクトの作り方まとめ
フォトエフェクトの完全自作方法、そして超高品質なフォトエフェクトPSDについて解説しています。
Webサイトやバナーデザイン、各種DTPやUIデザイン等、様々なクリエイティブに使えるテクニックです。
1分で作れるエフェクトPSD素材
商用利用可能で超高品質なエフェクトが1分で作れるPSD素材の使い方と作例です。
気になるサムネイル画像をクリックすれば解説記事にジャンプします。
様々なエフェクトPSD
商用利用可能で高品質なフォトエフェクトPSDを厳選しました。クリエイティブを劇的に効率化できる素材を併せてチェックされてみませんか?
フォトエフェクトを自作
Photoshopを使いこなして様々な質感のフォトエフェクトを作る方法を解説しています。
気になるサムネイル画像をクリックすればメイキング記事にジャンプします。
目次一覧
ゼロから始めるシリーズ
現役デザイナーが教えるIllustrator、Photoshop、ポートフォリオ講座の目次です。
デザイン未経験からプロを目指しましょう!