心を掴む商品画像

近年スマートフォン経由の購買の割合がPCを超え
外出先でも手軽に買い物を楽しめるようになりました。

特にファッションや美健商材についてはその比率の増加はめまぐるしく
スマートフォンページの最適化が勝敗を決めるとも言われています。

今回はスマートフォンページの商品画像に着目し
消費者がクリックしたくなる魅力的な構図について解説していきます。

■情報の取捨選択がカギ

消費者が商品を購入する際にまず行うのが商品検索ですが
検索結果で他店と並んだ場合に真っ先に比較されるのが商品画像1枚目です。

では他店と比較検討した上で消費者がクリックしたくなる商品画像とはどのようなものでしょうか。

例えば、消費者が検索した商材をカーディガンと仮定して考えてみます。
検索した際に上位表示された店舗は、アパレル商材を扱うA店とB店で
掲載している商材はどちらも同じ5色展開のカーディガンだとしましょう。

それぞれの店舗は以下のような特徴があります。

【A店の特徴】店構え:カジュアル / 価格:安い
【B店の特徴】店構え:高級感がある / 価格:A店より高い

上記の要素を踏まえると、店構えに合ったイメージの画像を制作することに重点を置きがちですが
ここで注目したいのが訴求ポイントです。

もちろん販売する商材や店舗の世界観、取り込みたい客層によって様々ですが
どの情報を優先的に掲載し消費者にアピールすべきか以下のように洗い出してみましょう。

【A店】最大の訴求ポイントは価格
∟優先掲載情報:モデル着用イメージ+5色のカラバリ+価格

【B店】最大の訴求ポイントはイメージ(高級感)
∟優先掲載情報:モデル着用イメージ+5色のカラバリ

店舗によっては消費者に多くを伝えたいという欲求が勝り情報過多になっていたり
見た目の印象に捉われ過ぎてモデル着用イメージのみを掲載したりするケースも見受けられますが
訴求したいポイントを明確化し、掲載する情報の取捨選択を行うことで
消費者に商品情報と訴求ポイントが直感的に伝わり商品に興味を持つのです。

他店と比較検討されることをしっかり理解した上で商品画像制作に取り掛かることが
クリックへの近道と言えるでしょう。

スマートフォンページの商品画像の見え方や配置場所は
PCと比べるとその差は一目瞭然であり、モールによっても様々ですが
商品画像に文字の表現が可能な楽天とYahoo!のページで比較してみましょう。

まず商品画像の位置ですが、両モール共に商品ページの上部に横にスクロールする形で配置されています。
登録枚数に若干の差はあるものの、ファーストビューの位置であることは同様です。

次に商品画像から下にある要素は「商品スペック」「レビュー」「配送関連情報」
「商品アプローチ画像」が主となりますが、その配置場所はまちまちです。

楽天の場合、商品画像の直下に商品の詳細を表わす画像を配置することが可能で
配送関連情報や商品のスペックはその下部にテキストで配置されます。

Yahoo!は商品画像の直下に買い物カートや配送関連情報、商品のスペックやレビューが
ほぼテキストで配置され、その下部に商品の詳細を表わす画像が配置できます。

■モール特性を見極める

次に買い物カートを見てみましょう。

楽天は買い物カートが常に表示されており縦にスクロールしても追従するような構造に対し
Yahoo!は商品画像の直下に固定設置されており、縦にスクロールしても追従しないため
楽天とYahoo!では商品購入までの流れに差があることが分かります。

ここで重要なのは買い物カートの位置です。

商品をカートに入れるまでの一連の流れにスポットを当てて比較した場合
楽天は商品画像の箇所に商品アプローチ画像、配送関連情報、レビューやスペックを登録しておけば
縦にスクロールしなくてもある程度内容が理解でき
消費者のタイミングで商品をカートに入れることができるためスムーズな購入が可能です。

しかしPCと違ってスマートフォンで表示される商品画像は非常に小さいため
商品スペック等の詳細情報を記載したい場合は注意が必要です。

Yahoo!は買い物カートが商品画像の直下に固定配置されているため
縦にスクロールして商品アプローチ画像領域を確認した場合
もう一度上部の商品カートの場所まで戻って商品をカートに入れる必要があるため少し手間がかかります。

しかし何度も購入している商品等の場合は既に商品スペックを理解しているため
ページ遷移後すぐの場所で配送関連情報等が見られてスムーズな買い物が可能です。

それぞれにメリットデメリットはありますが
モール特性をしっかり見極め、的確に表現にすることが
消費者の購入をスムーズにする秘訣と言えるでしょう。

直感的な商品画像で消費者の心を掴もう!