写真をラテアート風に加工できる無料PSDデザイン素材

写真をラテアート風に加工できる無料PSDデザイン素材

カテゴリーPSDデザイン素材
配布サイトCoffee Latte Art Photoshop Mockup-Photoshop Supply
使用許諾 :商用利用可(帰属表示必須)
※記事作成時の情報となりますので、最新の情報は配布サイトをご確認下さい

ラテアート作ってみたいなぁ…
ラテアート。それは決して素人が手を出してはいけない芸術品。Twitterで「ラテアート 失敗」と調べると、挑戦者たちのラテアートがたくさん出てきます。

いざ、ラテアートに挑戦しようと思っても、やはり素人ではなかなか難しいもの。

そこで今回はお気に入りの写真をまるでプロのバリスタが作ったかのようなラテアート風に加工できる、そんな無料のデザインツールを紹介します。

Before→After

今回使用したのはPhotoshopで使える無料のPSDデザイン素材。色の濃淡の調整も行えるため、自分の理想とするラテアートを作り込むことができます。

ラテアートの画像ラテアートの画像
※画像の中心にある線はPC上ではクリックしながら、スマートフォン上ではタッチしながら左右に動かすとBefore→Afterの写真を見ることができます

使用許諾

帰属表示が必須!
Photoshop Supplyのサイト画像

▲ Photoshop Supplyの使用許諾はこちらのページから確認できます

配布元である「Photoshop Supply」で配布されているフリー素材は個人利用も商用利用も可能とのこと。ただし、帰属表示が必須になりますのでフリー素材を使用した際はサイトへのリンクを貼るようにしましょう。

禁止事項はファイルの転売、サブライセンス化、再配布の禁止(有料無料問わず)になります。また当然のことながら、ダウンロードリンクに直接リンクを貼ることは禁止されていますので、帰属表示を行う際はトップページ等にリンクを貼るようにしましょう。

より詳しい情報を知りたい方はこちらの記事をご覧ください。
デザイン作業を効率化させるPhotoshopのフリー素材を配布しているサイト『Photoshop Supply』 Photoshop Supply|Photoshopの作業を効率化させるフリー素材が揃うサイト

※記事作成時の使用許諾となりますので、最新の情報は配布サイトをご確認下さい

PSDデザイン素材の使い方

STEP.1/4丨PSDデザイン素材をダウンロード

まずは配布サイトよりPSDデザイン素材を無料ダウンロードします。

配布サイトのスクリーンショット

▲ 赤い四角で囲った部分からダウンロードできる

配布サイトからダウンロードしたZipフォルダを解凍し、フォルダの中にある「coffee-latte-mockup-by-PhotoshopSupply」という名前のPSDファイルを開きます。

ファイルの画像

▲ PSDファイルを開く

STEP.2/4丨レイヤーの中にある「for images」を表示

PSDファイルを開くとこのような画面が出てきます。

Photoshopの画面

▲ PSDファイルの中身

今回は写真をラテアート風に変換するため、レイヤーの「Logo Mockup by PhotoshopSupply」の中にある「for text logos」を非表示にし、「for images」を表示します。

これを行わないと写真がちゃんとラテアート風に反映されませんので要注意です。

レイヤーの画像

▲ 「for text logos」を非表示、「for images」を表示

そして次にレイヤーの中にある「ADD YOUR LOGO INSIDE」のサムネイルをダブルクリックし、スマートオブジェクトの編集画面に移動します。

レイヤーの画像

▲ レイヤー「ADD YOUR LOGO INSIDE」のサムネイルをダブルクリックすると…

Photoshopの画面

▲ スマートオブジェクトの編集画面に移動

※テキストをラテアート風にする場合は「for text logos」のサムネイルをダブルクリックし、テキストを配置します。

STEP.3/4丨写真をラテアートに変換

スマートオブジェクトの編集画面ではまず新規レイヤーを作成します。次にお好みの画像を貼り付け、一番上にある非表示になっているレイヤー「coffee gradient」を表示させます。

レイヤーの画像

▲ 新規レイヤーに写真を貼り付け、レイヤーの中にある「coffee gradient」を表示

すると、ラテアート風の完成イメージが見えるようになりますが、このままではプロのバリスタが作ったラテアートっぽくないのでここから色の濃淡の調整を行います。

Photoshopの画面

▲ この微妙な色合いを調整していく

写真のレイヤーを選択したまま、「イメージ>調整>レベル」から写真の濃淡を調整します。ここでラテアートの仕上がりの8割が決まってくるので細かく調整していきましょう。

▲「イメージ>調整>レベル」から、写真の濃淡を調整

STEP.4/4丨完成

一通り調整が終わったら保存を行います。元の画面に戻るとラテアート風が適用されています。

Photoshopの画面

▲ ラテアート風の写真が完成!

調整が必要な場合は「レイヤー」の中にある「for images」にレイヤーマスクを追加し、ブラシツールでいらない部分を黒く塗りつぶせば消すことができます。

▲ レイヤーの「for images」にレイヤーマスクを追加し、いらない部分をブラシツール(黒色)で塗りつぶして調整

意外と需要あるかも?

コーヒーショップの広告に使えそう!
無料とは思えないクオリティですし、実用性が高くそうで意外と需要があるかもしれませんね。

例えばコーヒーショップの広告を作る際にこのPSDデザイン素材を使用して、店の名前とか店主の顔写真とかをラテアート風にする、とか…。

背景の画像も簡単に変えることができるのでお店の雰囲気に合わせたカスタマイズも容易にできます。非常に便利ですね。

また、無料デザインツールには珍しく、配布サイト公式のチュートリアル動画があります。英語が分かる方はこちらの動画も是非参考にしてみてくださいね。

今回使用したフリー素材

カテゴリーPSDデザイン素材
配布サイトCoffee Latte Art Photoshop Mockup-Photoshop Supply
使用許諾 :商用利用可(帰属表示必須)
※記事作成時の情報となりますので、最新の情報は配布サイトをご確認下さい

加工に使用したフリー素材

犬の写真Unsplash