第1部 新規案件のためのWebインターフェイス・デザインガイド
03 購買意欲喚起型
ユーザーの商品購買意欲を刺激する、活気に満ちたレイアウト
【こんなサイト制作に最適】
・ECサイト
【解説】
ECサイトのサンプル。いかに商品を魅力的に引き立たせ、商品購入までの導線を引くかに着目し構成した。
情報が煩雑になりがちなECサイトだが、中央コラムと右コラムを商品情報、左コラムをカテゴリ別メニューとするなど、エリア別に機能をきっちりと分けると、ユーザービリティの高いサイト構成が実現できる。
視覚に入りやすいページトップエリアには、キャンペーンなどのお得情報や一押し商品を掲載し、ユーザーの関心を引きつける。またショップスタッフの紹介やコラムなど、サイト滞在時間を延ばす要素となるものも、上部に配置すると効果的だ。
リピーターを獲得するには、サンプルのようにブランド特有のキャラクターを随所に配するなど、サイトの親しみやすさを高める工夫も必要となる。
・ECサイト
【解説】
ECサイトのサンプル。いかに商品を魅力的に引き立たせ、商品購入までの導線を引くかに着目し構成した。
情報が煩雑になりがちなECサイトだが、中央コラムと右コラムを商品情報、左コラムをカテゴリ別メニューとするなど、エリア別に機能をきっちりと分けると、ユーザービリティの高いサイト構成が実現できる。
視覚に入りやすいページトップエリアには、キャンペーンなどのお得情報や一押し商品を掲載し、ユーザーの関心を引きつける。またショップスタッフの紹介やコラムなど、サイト滞在時間を延ばす要素となるものも、上部に配置すると効果的だ。
リピーターを獲得するには、サンプルのようにブランド特有のキャラクターを随所に配するなど、サイトの親しみやすさを高める工夫も必要となる。
【Point】
1. 購買意欲を高めるイメージを配置
ユーザーの心を掴む売れ筋No.1商品やお得感満載のイメージを中央に大きく配置する。
2. 商品メニューを一覧表示
目的を持って訪れるユーザーを、しっかりと目当ての商品まで送り込むカテゴライズされたメニューは、左コラムにわかりやすく一覧表示。
3. 売れ筋情報を掲載
ユーザーの迷いを払拭し、衝動買いへと誘うトラップ。売れ筋ランキングや新着情報を、目に付きやすい位置に配置。
4. 商品ビジュアルを多数配置
売りたい商品のビジュアルを数多く並べ、ショップの賑わいを演出する。
5. 会社情報などは下部にまとめる
実店舗の情報などは画面下部に集約させている。
【参考サイト】
宇治茶 伊藤久右衛門
http://www.rakuten.ne.jp/gold/itohkyuemon/ujicha_t/
京都宇治のお茶の老舗から発信するスイーツのECサイト。
店舗の持つブランド感を演出したい場合には、このように、スタイリングされた美しい写真をセンターに並べると効果的だ。またメインビジュアル直下にその他の商品画像を配置すると、ユーザーの興味を持続させる要素となる。
同時に左コラムにカテゴリ別のメニューを掲載すれば、ユーザー導線も確保できる。
アンジェ(インテリア雑貨)
http://www.rakuten.ne.jp/gold/angers/
インテリア雑貨を取り扱うECサイト。
アイテムが多岐にわたるショップの場合、ユーザーの決断を促すコンテンツをファーストビューに持ってくるとよい。このサイトでは、センターと右コラムトップに、売れ筋商品とランキングを画像で紹介し、衝動買いを仕掛けている。
左コラムにメニューをまとめ、その他のエリアにはさまざまな商品を配置。探したいものが決まっているユーザーと、決まっていないユーザー、双方を注文にまで結びつける導線がある。