フォトショップで商品画像につける影テクニック番外編

公開日: : 最終更新日:2016/08/09 副業で稼ぐ仕組みの作り方

先日ご紹介した商品画像に影をつける方法の評判が良かったので、私が良く使うテクニックを他にもご紹介いたします。

はじめに

商品画像に影をつける事で他店よりも、良さそうな画像を作る事が出来ます。影のつけ方はいくつも種類がございますので、私が今まで使ったテクニックをご紹介いたします。

注意事項

前回と同様に今回もフォトショップを使って影を作る方法をご紹介させて頂きますので、お持ちでない方はフリーソフトの物をご利用下さい

良く使う影をつける方法

私が良く商品画像に影をつける方法は前回の売れる商品画像は影が必須でご紹介しておりますので、まずはこちらの記事を見て頂いた方がわかりやすいかもしれません。

ドロップシャドウがダメな理由

商品画像に影をつけると言う話を聞いた際に一番初めに「ドロップシャドウ」と言う言葉を思いついた人は注意して下さい。

私自身今まで数百と言う形が違う商品画像に影をつけてきた中でドロップシャドウを使って自然な影を作れたケースはごくごくわずかでした。

例えばドロップシャドウで影の濃さを25%にして作った場合

sdw2

sdw1

sdw3

 

どうでしょうか?一番しっくりくるのって最後のカードだけじゃないでしょうか?

ドロップシャドウは全体に対して同じくらいの濃さの影を作り出すので、水や机なのどの立体的な物であっても、カードのように平らな印象を与えてしまいます。

だからこそ、ドロップシャドウではダメなのです。

光の位置を考える

基本的に影を作り出す時に影を作るよりも光の位置と強さを考えてみる事で何となくわかると思います。

例えば、前回の影の作り方の場合

shadow22

 

この机の影は真上に光源があり、この光源も非常に遠いところにあると考えられます。

理由としては、影の色が薄い=光が遠いからです。

個人的にはこの影のつけ方が一番しっくりきて、簡単なので良く取り入れています。ただ、せっかくなので、今回は違う影のつけ方をご紹介いたします。

斜めからの影

一時期ハマっていた影のつけ方ですが、左ななめ45°に光源があると仮定した場合です。先ずはどんな画像になるのか見て頂いた方が早いでしょう。

sdw4

先ほどの影と違い、この影は前に光源があるので後ろ側に影が伸びています。またちょっと違う印象を与える事ができるでしょう。この影の作り方はそんなに難しくありません。

作り方

sdw5

まずは、机を選択して新しくレイヤーを追加しておきます。

sdw6

 

黒のべた塗りをします。

sdw7

べた塗りしたレイヤーを「自由変形」をし、上のバーに表示されている「H:0.00°」と表示されている部分を「H:-20°」にし、テーブルの脚部と影の脚部を合わせる為に右に少し移動させます。

sdw8

フィルター < ぼかし < ガウス 

を選択し、半径10pxくらいぼかします。
sdw9

 

影のレイヤーと商品画像のレイヤーを入れ替えて影を後ろに持っていきます。

sdw10

影にベクトルマスクを追加します。

sdw11

パレットの左下にあるこの部分をクリックし、白黒にします。この時、上に黒色がきて下に白色がくるように設定をします。

sdw12

そして、グラデーションツールを使い図のように右上から左下にかけてグラデーションをかけましょう。

sdw13最後に塗りを10%くらいまで落とすと自然な感じの影を作る事が出来ます。

反射させると高級感がある

次は影とは違うのですが、私が良く使う高級感を高める方法です。

sdw14

これは商品画像が全て床についている状態の物でしか利用できません。影ではなく反射させているのがわかりますか?

作り方

sdw15

まずは商品画像をコピーして新しくレイヤーを作ります。

sdw16

反射させる側を垂直に反転させます。

sdw17

反転させた物を少しかぶらせるように下にずらします。
sdw18

先ほどと同様にベクトルマスクをかけてグラデーションをかけましょう。

sdw19

 

最後に塗りを50%にしたら完成です。

 

さいごに

良さそうなサイトを研究しよう

副業で稼げるようになるまでは、日々の研究が必須項目になります。色々なサイトを見て自分自身が「良さそう」と感じたらすぐにまねをして取り入れていく事が技術力の向上にも繋がり、ヒントやアイデアの助けになります。

この稼げる副業ブログも毎週色々な記事を投稿していますが、ネタ切れもまだ起こしておりません笑

今回のこの商品画像にフォトショップを使って影をつける方法に関しては、色々なショッピングサイトをめぐると独自の方法で作り出している人もいらっしゃいます。

最初はわかりにくいかもしれませんが、しっくりとくる影を作り出すのって時間がかかるので、結構大変な作業ですよ。

ただ、慣れてしまえば何てことありませんのでまずは実験をしてみましょう。

関連記事

年のみphpで出力する

ホームページなどでコピーライトが2011年とか見ると少しさみしくなってしまいます。 はじめに

記事を読む

ワードプレスに目次を簡単に入れるTable of Contents Plus

今までタグを手打ちしていたのですが、やっとこさおさらば出来そうです。 はじめに Tabl

記事を読む

Contact Form 7のエラー項目を分かりやすく方法

Contact Form 7を利用している方でエラー項目をよりわかりやすくさせる方法をご紹介いたしま

記事を読む

no image

ワードプレスにソースコードを表示させるプラグイン【SyntaxHighlighter】

ワードプレスにhtmlタグなどのソースコードを記入した際にわかりやすくする為のプラグインです。

記事を読む

HEIC形式を簡単にjpgにする方法

web上でクッソ簡単にjpgに戻せました はじめに アイフォンを使っている人で、かつ

記事を読む

Gmailを使ったメールの振り分け方法

Gmailを使ったメールの振り分け方法をご紹介致します。 はじめに Gmailでメールの振り

記事を読む

ECCUBE2.12のカテゴリに子カテゴリを表示させる方法

EC-CUBEで孫カテゴリまで作ったならこのカスタマイズが必要です はじめに と

記事を読む

コンタクトフォーム7からの迷惑メールを防ぐ方法

コンタクトフォーム7を入れたけど、今度はここから迷惑メールが来ることが増えます。迷惑メールをブロック

記事を読む

ワードプレスにグーグルアドセンスを導入する方法

ワードプレスにアドセンスを導入する際に効率の良い導入方法をご紹介いたします。 アドセンスの設定をす

記事を読む

amazonのインスタントストアの作り方

誰でも簡単にamazonの商品を使ってECサイトを作る事が出来ます。今回はインスタントストアの作り方

記事を読む

Message

現在の総記事数: 317件

ECCUBEのポイント関連のバグ

最終保持ポイントがマイナス表示にならないように調整して下さい。って出て

ECCUBEの検索に商品IDを追加させる方法

ECCUBEはデフォルトだと検索機能は非常に弱いです。 はじめに

EC-CUBEで各カテゴリーページに情報を表示させる方法

EC-CUBEでカテゴリーページごとに情報を入れる方法をご紹介

windows10のおすすめを非表示にする方法

windows10に変わってからめっちゃうっとおしくなってきましたね

PHPの中にPHPを入れたい人の為のヒント

PHP初心者によくある疑問点PHPの中にPHPを入れる事が出来れば

→もっと見る

PAGE TOP ↑