【Photoshop】チョークで描いた質感にできるフォトエフェクトPSDの使い方と作例を徹底解説

Webデザイナー、UI/UXデザイナーの@sdesignlaboです。

Photoshop（フォトショップ）で写真やイラスト、文字、アイコンなど様々な要素をチョークで描いたような質感にできる高品質なフォトエフェクトPSDの使い方と作例を解説します。

制作に必要な時間は僅か1分！
商用利用可能なのでWebサイトやバナー、チラシ等の印刷物などに安心して活用いただけます。

この記事の目次

何ができるの？

上記のように黒板にチョークで描いたような表現があっという間に再現できるフォトエフェクトPSDです。
Photoshop初心者の方でも簡単に扱える便利なPSD素材ですよ。

チョーク風タッチが再現できるPSD

Photoshopでイラストをレトロ風にできるPSD素材2選です。
フォトショップ初心者の方でも再現可能な内容ですよ！

Photoshopを導入しましょう

当記事の内容を実践するにはPhotoshop（フォトショップ）が必須です。
未導入の方はAdobe公式サイトから導入できます。
なお、AdobeCCのプランはコチラの記事で徹底解説しています。

Chalkboard Chalk Effect

STEP.1

チョークエフェクトPSDを読み込む

今回使用するフォトエフェクト素材は [ Chalkboard Chalk Effect ] です。PSDTをダウンロードし、Photoshopで開きましょう。

すると左図の様な画面が開きます。

STEP.2

PSBを編集

レイヤーパネルを確認しましょう。
※レイヤーは [ F7 ] で表示・非表示ができます。

[ REPLACE ME ] というスマートオブジェクトのレイヤーがあります。レイヤーサムネールをダブルクリックしましょう。

すると別タブで [ REPLACE ME.psb ] が開きます。このPSB内にお好きな画像や文字などを配置し、[ Ctrl + S ] (Mac：⌘ + S) で上書き保存しましょう。

FINISH

チョークエフェクトの適用完了

元のフォトエフェクトPSDを参照すると画像が差し変わっている事が確認できます。
黒板にチョークで描いた粒子感のある質感が見事に再現されていますね。[ Chalkboard Chalk Effect ] を使えば1分で左図の様な表現ができますよ！

[ 背景を削除 ] を適用した人物画像と文字にチョークエフェクトを適用した例です。

※なお、人物写真は [ フィルター ] → [ フィルターギャラリー ] → [ エッジのポスタリゼーション ] で色数を減らしました。

OMAKE

カスタマイズが簡単

背景のグリッドの有無、カラーの鮮やかさの調整、全て白のチョークにする等。
[ Chalkboard Chalk Effect ] は細かくレイヤーが分かれて作られているのでエフェクトの調整が簡単にできます。

Chalk Sketch Effect with Generative AI

STEP.1

チョークフォトエフェクトを読み込む

次に使用するフォトエフェクト素材は [ Chalk Sketch Effect with Generative AI ] です。PSDTをダウンロードし、Photoshopで開きましょう。

すると左図の様な画面が開きます。

STEP.2

PSBを編集

レイヤーパネルを確認しましょう。
※レイヤーは [ F7 ] で表示・非表示ができます。

[ (Your design Here) ] という名称のスマートオブジェクトのレイヤーサムネールをダブルクリックしましょう。

すると別タブで [ (Your design Here).psb ] が開きます。このPSB内にお好きな画像や文字などを配置し、[ Ctrl + S ] (Mac：⌘ + S) で上書き保存しましょう。

サンプル画像は [ Anime style ] を使用しました。

FINISH

チョークエフェクトの完成

元のフォトエフェクトPSDを参照すると画像が差し変わっている事が確認できます。黒板にチョークで描いた粒子感のある質感が見事に再現されていますね。

[ Chalk Sketch Effect with Generative AI ] を使えば1分で左図の様な表現ができますよ！

OMAKE

レタッチの有無

元画像を未編集のままチョークエフェクトを適用した例です。後述するレタッチした後にエフェクトを適用した例と見比べてみましょう。

写真を配置する際は [ レベル補正 ] や [ トーンカーブ ] でコントラストを強めにしておくのがオススメです。

カラー写真だと不自然に見えても、チョーク風フォトエフェクト越しに見るとコントラストが強めでいい感じのチョークアートに仕上がりますよ。

その他のチョーク加工エフェクト

商用利用可能で高品質なチョーク風の表現ができるエフェクトPSDです。
プロ品質の加工が1分で実現できるチート素材ばかりですよ！

#01 Chalk Art Photo Effect Mockup

黒地の黒板に白のチョークで描いた表現ができるチョーク風フォトエフェクト素材です。学校だけでなく、カフェメニューなどの紹介などにもよく合う素材ですよ。

ダウンロードする

#02 Chalk Photo Effect

ポートレート写真などに適したチョークエフェクト素材です。背景を削除した人物写真などを指定のスマートオブジェクト内にはめ込むだけでサンプルの様な表現が1分で再現できますよ。

ダウンロードする

#03 Chalk Photo Effect Abstract Image Filter

カラー付きのチョークタッチにできるフォトエフェクトのPSD素材です。写真、イラスト、テキスト、アイコン等、要素問わずで使えるエフェクトなのでオススメですよ。

ダウンロードする

#04 Chalk Drawing Photo Effect

黒板にチョークで描いた線画のタッチが再現できる高品質なフォトエフェクト素材です。写真等をまるでチョークによる手描き風にできる素材です。カフェメニューの食べ物や飲料のチョークイラスト等があっという間に作れますよ。

ダウンロードする

#05 Chalk Sketch Photo Effect

少し明るめの黒板に描かれたチョークイラストが再現できるフォトエフェクトのPSD素材です。文字を入力すればチョークで描いたロゴのような表現が可能ですよ。

ダウンロードする

#06 Chalk Art Photo Effect Mockup

割とパキっとしたチョークタッチが再現できるフォトエフェクト素材です。細いチョークで描いた線画タッチの再現に特化していますよ。

ダウンロードする

ヴィンテージエフェクトとアメコミエフェクト

商用利用可能なヴィンテージエフェクトとアメコミエフェクトをまとめました。併せてチェックされてみませんか？

【Photoshop】超高品質なヴィンテージ加工が一瞬でデキルPSD

【Photoshop】1分でアメコミ風にできるフォトエフェクトPSDの使い方と作例

おわりに

以上、Photoshop（フォトショップ）で写真やイラスト、文字、アイコン等の様々な要素をチョークで描いたような質感にできるフォトエフェクト素材についてでした。

今回使用したエフェクトPSDは [ Chalkboard Chalk Effect ] と [ Chalk Sketch Effect with Generative AI ] です。共に商用利用可能な素材なのでWebサイトやバナー、ロゴ、チラシなどの印刷物など、様々なクリエイティブに活用できます。

ゼロから黒板にチョークで描いた風の加工するにはPhotoshopのスキルと手間が必要ですが、フォトエフェクトPSDを使えば誰でも超高品質なチョーク風にできます。時短と高品質化を両立させたい方は是非お試しください！

ではまた！