この写真の見せ方、どっちが正解？買いたくなる商品写真のセンスを磨こう

以上が私なりの解答です。

3問目は、良し悪しの基準を判断するのが難しかったかもしれません。

ではここからは、それぞれの作例のAとBで、何が異なっていたのか？を説明し、作例で用いられていたデザインテクニックを、応用を交えて細かく紹介していきます。

1．切り抜き写真は「影」で存在感を高める

まずは、1問目の振り返りです。

作例のAとB、どこが違うかわかりましたか？

AとBの違いは、商品の切り抜き写真に影が付いているかどうかです。

商品を切り抜いてチラシやバナーに使用する際、そのまま置いただけだとAのように背景から浮いて見え、合成写真のような「違和感」が残ってしまいます。

もちろんAが間違いというわけではなく、フラットで抽象的なデザインにしたい場合は、あえて影を付けない選択肢もあります。

しかし、商品がその場に置かれているようなリアリティを出し、商品の存在感を高めたいのであれば、影を付けるのが効果的です。

影があることで空間に奥行きが生まれ、デザイン全体が自然でクオリティの高い仕上がりになります。

その結果、商品の魅力もよりダイレクトに伝わりやすくなるため、今回はBを正解としました。

「わざわざ写真に影をつけるなんて面倒だ」と思われるかもしれませんが、実はAdobe Illustratorでカンタンに作ることができます。

2．錯覚をデザインで補正する

続いて、2問目の振り返りです。

この問題は、色の違う同じ形の商品を並べたときのレイアウトが題材となっていました。

実は、Aは黒と茶色のバッグの大きさがまったく同じで、Bは茶色のバッグを少し大きく調整しています。

ただし、脳の錯覚でAの茶色のバッグは小さく見えてしまっています。

一見すると、ほとんど差がない微々たる違いに思えるかもしれません。

しかし、購入を真剣に検討されているお客様にとっては、この「わずかな差」が商品の印象を左右する大切なポイントになります。

同じサイズを並べたはずなのに、違和感が出る理由

Aの作例について、もう少し詳しく解説します。

「同じ商品なのだから、画像も同じサイズで並べるのが正解」と考えるのが自然ですよね。

しかし、ここにデザインの落とし穴があります。

人間には「錯覚」があるため、斜めを向いた立体的な商品を横に並べると、奥にあるものが不自然に大きく見えたり、手前のものが小さく見えたりと、サイズがバラバラな印象を与えてしまうことがあるのです。

3．「お客様が知りたいポイント」を隠さない

続いて、3問目を振り返りましょう。

この問題は、レイアウトにおける「情報の優先順位」を問うものでした。

どこを基準に判断すべきか迷われたかもしれませんが、私が考える答えは「A」でした。

なぜなら、Aのほうが商品の全体像が正確に把握でき、お客様にとって親切な見せ方になっているからです。

一見、Bのほうが情報がコンパクトにまとまっているように見えますが、実は装飾や配置によって商品の細部が隠れてしまい、全体像が見えにくいレイアウトになっています。

ECサイトやチラシなど、商品の情報を伝える媒体では、デザインの主役はあくまで「その商品を購入されるお客様」です。

制作者自身の好みや「なんとなく格好いいから」といった主観でレイアウトを決めるのではなく、「お客様が知りたい情報が正しく、ストレスなく伝わっているか」という視点で、最善の見せ方を追求することが大切です。

Tips：Illustratorの生成AIで装飾を調達する

チラシやバナーなどで商品画像を扱う制作現場では、内容の「正確性」が重要ということもあり「生成AIを活用しよう」という考えになりにくいかもしれません。

しかし、表現を豊かにする「装飾（あしらい）」を調達するのに非常に便利です。

ここでは、「ベクターを生成」機能を使った、現場で役立つ活用例を2つご紹介します。

【活用例1】「バクダン」をスピーディーに用意する

チラシデザインの定番といえば、価格や期間を強調する「バクダン」装飾です。

いつも同じ素材を使い回すのもひとつの手ですが、企画に合わせて形を変えることで、より強いインパクトを与えられます。

とはいえ、一から作成するのは意外と手間がかかるもの。

そんなときこそ生成AIの出番です。

Illustratorの「ベクターを生成」を使って、チラシ用のバクダンを生成してみましょう。

日本独自の表現である「チラシのバクダン」では意図した形になりにくいため、「コミックの効果音」とプロンプト欄に入力してみましょう。

このとき、コンテンツの種類は「被写体」を選択するのがポイントです。

すると、3種類のバリエーションが提案されます。

もしイメージに合わなければ、「ポップ」「ギザギザを少なく」といったプロンプトを足して、再度生成してみてください。

また、生成されるのはベクターデータなので、不要なパーツを消したり色を変えたりといった編集が可能です。

【活用例2】コーナータイトルの装飾作成を効率化する

チラシでは、情報をグループ化するために「コーナータイトル（見出し）」を立てて訴求することがよくあります。

その際、タイトルに添えるイラストを探したり描き起こしたりする作業は、こだわり始めると意外と時間がかかり、制作のメインであるレイアウト作業を圧迫してしまうことも。

そんなときにも、Illustratorの「ベクターを生成」機能が役立ちます。

イメージに沿ったプロンプトを入力するだけで、デザインのトーンに合わせた装飾をカンタンに作成できます。

AIを賢いパートナーとして活用することで、デザインの質とスピードを両立させましょう。

ちなみに以下の記事ではチラシデザインのコツと、Illustratorでチラシを作成する方法を紹介しています。
効果的なチラシをデザインするコツ！作り方やオススメツールも紹介

お相手は茄子川導彦でした。
本コーナーでは、あなたのデザイン力のアップにつながる様々なクイズが用意されています。
ぜひほかのクイズにもチャレンジしてみてください。

※本コンテンツは、デザイナーがそれぞれの視点で理想とするデザインを語っています。
クイズの正解はひとつではなく、あくまで参考としてご活用ください。