BLOG

ECサイトで考慮すべきUI/UXデザイン10のポイント

2019.06.18  Wrote by Takuro Nakayama

Webでは日々めまぐるしくトレンドが変化しています。ECサイトにおいては小規模なショップであろうと、ユーザーがすでにAmazonやメルカリなどのユーザーエクスペリエンス(UX)の質が高いツールを使っているため、同レベルの体験を期待しています。
その中でUI/UXデザインの観点でより多くのユーザーに愛されるECサイトのポイントをまとめてみました。

 

1.ユーザーは「安心」を求めている

商品の写真や情報、運営者情報や規約も全てはユーザーの安心につながるものです。ECサイトでは視覚で商品を選ぶため、デザインも動線も情報も全てはユーザーの安心感を与えることにフォーカスするべきです。

サイトを設計する際も、商品の選定から購入、商品の受け取りまで全てにおいてユーザの「安心感」に寄り添うべきです。その上で「安心感」にプラスして「喜び」(満足だけではなく)を与えられると、ユーザーエクスペリエンスが向上し、ユーザーとの関係性も良いサイクルに入ることができます。

意外とECサイト、公式サイト、Instagram、Twitter、Facebookでロゴが違うショップを多く見受けます。企業ロゴとブランドロゴと適当な画像や商品写真が混在する状態だと、ユーザーから見て統一感がなく「このサイトは公式だろうか?」と不安要因となります。もちろん購買意欲を高める効果はありません。

ブランディングの観点から見てもコンバージョンを向上させるためにも、統一感を出すことに真摯に取り組むべきだと思います。確かにそこを気にしない人もいますが、昨今いろんな違法サイトや詐欺サイトが存在する中で、ブランドに対して「安心感」という「心象」は、ユーザーのライフタイムバリュー(LTV)を引き上げることにつながります。その施策には長期的なメリットがあるのです。

 

2.写真を効果的に使用する

ECサイトにおいて写真はコンバージョン(CVR)に直結する重要な要素です。写真を効果的に活用してセールスポイントをユーザーが理解しやすくすれば、ユーザーは安心して商品を購入できます。

 

商品画像を豊富に準備する

十分に画像を用意し、商品の複数のアングルや素材のディテール画像でユーザーが商品の魅力を十分知れるようにしましょう。

 

商品を使っているイメージ写真を用意する

ユーザーが商品をどんなシーンでどのように使えるのか、ターゲットユーザーが想起できるような画像を用意しましょう。

 

色や形状の商品画像を全て掲載

小物やスニーカーなど、色違いや形状が異なるものがある場合、それぞれ提供可能な商品画像があるとユーザーは安心して購入できます。

 

3.カラーを多用しない

多くの色を利用するとユーザーを混乱させる原因になります。楽天とAmazonのユーザーインターフェース(UI)の違いが典型ですが、日本におけるデザインは色を多用する傾向があり、ベタ塗りで強烈な色やグラデーション、コラージュを多用したり、とにかくビジュアルが明るいのです。

一説によると東京の夜景は海外の大都市に比べても明るく、部屋なども海外だと間接照明などで部屋をリラックスできる空間を目指すが、日本は蛍光灯が真上で煌々と照らすことが多く、照明の使い方が日本のビジュアルデザインにも深く関わっているのかもしれません。

色は最低限に抑え、コンテンツや必要な情報にユーザーのアテンションを集めることにフォーカスしたいものです。

 

4.ストーリー仕立てにする

人間の脳は物語になっている方が情報を処理する際の効率が上がることが実証されています。

ECサイトの場合、商品の細かいスペックを記載することも大事ですが、なるべく難しい表現を避けて、商品がどのようなもので、どうやって利用し、どんなメリットが受けられるのかを分かりやすくストーリーテリングすることで、より高いコンバージョンの達成を目指せます。

モノが溢れている時代なので、買う理由やメリットを押し付けではなく、ユーザーが何に共感するのか、ドリルではなく潜在的に感じている「穴」は何なのかを常に考える必要があります。

 

5.多様な環境を意識したデザイン

Webの場合、ユーザーにより使用している端末の機種やOSのバージョン、ネット環境などが異なります。越境ECなどで海外市場をターゲットにする場合、ECサイトのデザインを低いスペックのデバイスでもストレス無く使ってもらえる様に、シンプルなデザインが求められます。デザインが最終的にどのくらいのスケールで、どのようなタイプのユーザーに利用されるかをしっかり制作側とECサイトを運営するショップ側が理解しておく事が大切です。そうすれば制作側や運営側の好みや気分で色を変えたりせず、ユーザーエクスペリエンス(UX)やユーザービリティ(Userbility)にフォーカスしてデザインすることができます。

 

6.欲しいものが見つけやすいカテゴライズ

カテゴリー設計はECサイトの中でも重要なステップです。

特に商品数が多く、種類が多いサイトの場合、ユーザーがどんなキーワードで商品を探すか、どんなキーワードが商品イメージと紐づけしやすいか、よく検討すべきです。

「ユーザーに沢山の選択肢を与え過ぎると何も選ばなくなる」という実証もある通り、単純にカテゴリーを増やすのではなく、優先度の高いフィルターカテゴリーやフィルター値から、ユーザーが素早く必要な商品情報に辿り着けるようにします。そして検索ログをチェックしたりアナリティクスデータからユーザー行動を分析し、定期的に施策を改善していくなら、ユーザービリティの高いサイトにしていくことができます。

これらのフローは一朝一夕には解決できるものではありませんが、実店舗と同様、ECサイトの成功には近道はなくひたすらこのユーザービリティへの執着を繰り返せるかにかかっていると言えるでしょう。

 

7.ローカライゼーションで差別化をする

ローカライゼーション(localization)には多くのことが求められます。日本では問題なくても国によって色に対する受け止め方が異なり、あるカラーテイストが宗教・政治的にタブーになっている場合もあります。

これからECサイトは越境(海外も視野に展開)することも多くなると思いますが、サイトの言語を変えれば良いというわけではなく、展開する国に合わせてカラーやLOGOの色を変更するケースも多くあります。国ごとの決済方法の違い、日付や時刻の表記、通貨をどう表示するかなど、展開するお国事情に合わせて考慮すべき要素があり、なかなか地道な調査とPDCAが必要な分野です。

 

8.透明度の高い情報表示

「カゴ落ち」の理由の中の理由でよく挙げられるのが、「決済時に不明な費用が含まれている」というものがあります。クーポンやキャンペーン、送料などカートに入れて決済画面にならないと、最終的なコストが計算できないという場面です。

Amazonの場合は送料が「いくらなのか」を表示し、この「不明なコスト」が極力発生しないように取り組んでいます。しかし楽天市場では店舗毎に送料が異なるため実際にカートで入れただけでは「実際にかかるコスト」が見えないという状態になります。

 

9.Out-Of-Box Experience

OOBEと略されるがユーザーが製品を箱から取り出してセットアップして使えるようにするまでの体験を意味します。主にデジタル製品に対して使われる用語ですが、ECにおいても重要なユーザー体験の一つになっています。

見本はAppleの製品パッケージングです。Apple商品のために精密に作られた箱を開ける時の特別感は、Appleにとっても重要なUXデザインの一つです。つまり商品をオンラインで購入して商品を楽しみに待ち、商品が届いて開けるまでのドキドキ感やワクワク感、そしてセットアップまでのスムーズで簡単な手順、、、などは、商品を購入することがゴールではなく、その後までユーザーのことを考えることが大事になっています。

「神は細部に宿る」とも表現されるように、そこまでこだわることにより、ユーザーのプロダクト体験の満足度とプロダクトの信頼度を高めることができるのです。

 

10.スマホファーストを徹底する

何よりスマートフォンへの対策に力を入れるべきです。

近年はスマホデザインからUIデザインを考えるというのも一般的ですが、アメリカの例ですが、ECサイトにおいてはスマートフォンでの売上が全体の1/3を超える(2019年現在)と言われています。

これは実際の決済部分の話ですが、8割近くのユーザーがモバイルからECサイトを認知している場合も多くありません(参考)。商品認知やその後の行動にスマホが影響していることを考えると、スマホすのUI/UXにより力を入れるべきことは明らかです。

UIデザインでいうと制作側や運営側はTOPのデザインなどに力を入れがちですが、ユーザー導線ではECサイトの場合は商品ページに直接ランディングする場合が多いので、「コンテンツファースト」の概念で見ると単純にPCサイトをスマホで表示するのではなく、モバイルユーザーのためのUIを設計すべきです。

PC向けに使われていたデザインはモバイルUIには向いていない場合が少なくありません。例えば、太陽光の下や暗い場所での利用など、PCでは起こり得ない環境で利用される事も多いスマホの場合、UIに使うカラーは出来る限り同じカラースキームに統一する方が良いです。

参考:EC利用時のデバイスはスマホが74%、EC系アプリは50%以上のユーザーにインストール(ECCLab)

 

まとめ

最近Appleから発表されたiPadOSなどを考えると、今後タブレットもより普及すると考えられます。

デバイスが多様化しそれに対する素早い対策をECサイトは求められます。サイト構築だけではなく運用に対するリソースとコストを見込んで戦略的に進めていきましょう。

クラウドットではECサイトのコンサルティング、ネットショップ構築、運用代行をサポートします。お気軽にご相談ください。

お問い合わせはこちら。

その他の記事を見る