ECサイトも見た目が9割！UIを攻略し、お客様を虜にする
■UIとは
UIとはUser Interfaceの頭文字を取ったもので、ユーザーがやり取りする際の入力や表示方法などの仕組みのことです。ユーザーがアクションを起こす際の入り口、接点とも考えられます。例えばPCの画面、TVのリモコン、銀行のATM、コンビニのコーヒーマシンも接点です。ECサイトの場合は画面に映し出された画面そのものです。
■UIの重要性
UIは見た目なので、あなたのお店の商品がいくら優れていようが、サービス・アフターケアがいくら優れていようが、最初の接点となるので最も重要です。人も最初の印象で、信用できるかどうか判断されてしまうのと同じです。いくら性格が良く、仕事が出来てもて見た目が悪いと印象も悪いのと一緒です。
■清潔感があり分かりやすく、見やすい
一目見て情報が整理されていて、見やすいかどうかです。見出しがついている、フォントが統一されている、奇抜な色遣いをしていないなど、ある程度流行のデザインを取り入れているなどです。人で言えば前身高級ブランドでなくても、サイズがぴったりと合う服、髪型がセットされている、靴が綺麗などです。お客様が良くわからない中小零細企業が運営するECサイトで買い物をするときは、本当にこのサイトが信頼に値するかとても不安です。ぱっとみでごちゃごちゃしていたり、何を売っているのかわからないと直ぐに帰ってしまいます。
自社のECサイトを立ち上げるとき、気合十分な人にありがちなのは、どこにもない斬新なカッコいいデザインにするぞといった思い入れです。もちろんお店の世界観は重要です。しかし、あなたの運営するのはホームページではなく、ECサイトです。お客様が購入してくれなければ意味がありません。世界観はあくまでお客様が共感し、購入してくれなければECサイトとしての価値はありません。先ずは、買いやすいベーシックなデザインに配慮すべきです。ベーシックなデザインの中でも十分個性や世界観は出せます。
私が常に意識しているECサイトが2つあります。パンと雑貨のショップわざわざさんと、書道用具のショップ書游さんです。この両ショップは見ればわかりますが、デザインは素晴らしいです。めちゃくちゃオシャレです。でもECサイトのデザインの基本は外していません。色使いだったりフォントだったり商品写真の撮り方だったりで凄いこだわっていて、それが唯一無二の世界観を醸し出しています。
■操作性が良い
リンクが適正な位置に貼られている、ボタンが押せるかどうか一目で判断できる、会社ロゴを押すとトップページに戻れるなどです。これらは、ほかのECサイトでの購入経験が豊富なお客様ほど、慣れたサイトと同じ操作性を求めます。あまりにデザイン性を優先しすぎて、シンプルにするとデザインの敗北が起きます。
セブンｰイレブンのコーヒーマシンは有名なデザイナーがデザインした極めてオシャレでデザイン性が高いものでした。半面、操作方法が分かりづらく、テプラで説明をペタペタ張りまくる店が多く、せっかくのデザインも残念な結果となりました。
ボタンの配置も非常に重要です。例えば、カートに入れるボタンは通常のECサイトでは中心から右側に配置されています。これが、左端にあったら大半の人にとっては使いにくいことこの上ないです。これが、ECサイト初期から左端ならもしかしたらすんなりと受け入れらていたかもしれません。リンクの文字も青色だとリンクがあることが分かります。これも、経験によってそういうものだと認識しているからです。だから、究極はAmazonみたいな使い慣れたサイトのデザインをや配置を真似るのが一番です。私が作った「卒塔婆屋さん」というECサイトも商品詳細ページは左に写真、真中に商品説明、右側にカートボタンと配置はAmazonのパクリです。オリジナルのデザインは運営側のエゴです。お客様は使い慣れたデザインが一番であると肝に銘じてください。
私も最近TVを買い替えて、今までは番組表で見たい番組に合わせてリモコンの決定押せばその番組に行けましたが、新しいTVは番組表で見たい番組にカーソルを合わせ、画面右上の決定ボタンを押さないと番組に行けなくなり、非常にストレスを感じております。
TVなので、仕方なく慣れるしかないかとあきらめていますが、ECサイトだったらすぐに他のサイトに行けてしまうので、わざわざ分かりにくいサイトで買う必要はないですよね。
ECサイトはリアル店舗と比べても簡単に来られるし、簡単に帰れるということを運営側は真剣に考えてください。
■導線がしっかりしている
お客様が商品を探して、選んで、カートに入れて、購入画面に進み、購入するといった行為をストレスなく進めることが重要です。
商品点数が多いお店ほど、最初の店舗内の検索が優れているかが鍵となってきます。カテゴリーの分類も慎重に考えるべきです。商品別にするのは当然として、カラー別、サイズ別、シーン別あらゆる属性も考慮しましょう。
私は、最近仕事中Spotifyという音楽アプリで音楽を流しっぱなしにしていますが、このアプリは、音楽ジャンルだけではなく、シーンにあわせたカテゴライズもされているので、仕事に集中したいとき、リラックスしたいときなど検索する手間もなく、シーンに合わせた音楽をかけることができ重宝しています。
カテゴリーの名前付けも油断すると痛い目にあいます。明確に分かりやすい商品ならばよいのですが、お客様による解釈に幅を持たせる表現は避けるべきです。そのものしか他にない名前（排他的ラベリング）を行うべきです。実際やってみるとわかりますがこれが結構難しいです。名前だけではわかりづらいときは写真やイラストをいれて、お客様の認知の負担を軽減させてください。
以前、私が資料なども広げられる広い机で、引き出しとかないシンプルなものを探していた際に、とあるECサイトで探しました。だけど、デスクで探しても、いかにも事務机といったものしか出てこないので、次にテーブルというカテゴリーで探したらすぐにお目当ての商品を見つけることが出来ました。この例では、確かにラベリングが難しいですが、例えばデスクとテーブル両方に同じ商品をカテゴライズする、シンプルな広い机など具体的にラベリングするなど工夫はできます。
自分でサイトを作っていると、客観性が絶対に欠落します。使いやすいと思い込んでしまいます。そこで、おすすめは第三者（サイトを始めてみる）にある商品Aをこのサイトで購入してくださいとお願いして、その様子を動画で撮影します。その人が迷わずスムーズに購入できれば問題ありません。しかし、間違いなく始めは手が止まる、頭を傾げる場所があります。そこが、修正すべき点です。私も初期の頃はユーザーテストを何回か行い修正しました。この時の注意点としては、ECのプロに依頼しては駄目です。プロだとやはりバイアスがかかってしまいます。自社のEC部門以外でターゲット層に近い社員にお願いすると良いです。また、ユーザーテストというのは隠した方が良いです。私は、ユーチューブにサイトで買い物しているところ上げてプロモーション作るから撮影に協力してと頼みました。まあ、撮影すると緊張してしまうので完ぺきではないですけど、一定の効果あります。撮影後、ネタバラシとどこで迷ったかなどもアンケートを取ります。
お客様から、自社のECサイトについて問い合わせがあった場合は、まさに千載一遇のチャンス到来です。私も、お客様から○○についてはどこに書いてあるのとか、○○という商品がどこにあるか分からないといった問い合わせを沢山受けて来ました。しかし、めんどくさいと思ったことは一度もありません。逆に、もう凄くうれしく思いました。なぜなら、このお客様はわざわざ時間を割いてサイトの欠点を指摘してくれているんですよ。このお客様の裏にはもしかしたら同じ理由で、指摘せずにただ帰ってしまったお客様が山ほどいることでしょう。それに、ユーザーテストよりもはるかにリアルな指摘です。指摘は、なんで分かってくれないんだではなく、直ぐに修正です。何度も言いますお客様が購入してくれるかが全てです。プライドもへったくれもありません。
■UIは奥が深い
UIについて超簡単に書きましたが、実はものすごく奥が深く、UIについてだけで本が書けてしまいます。実際にUIについての本も多数あります。その中で私が何度も読み返した本「UIデザインの教科書 マルチデバイス時代のインターフェース」があります。実際に写真付き事例も豊富で非常に分かりやすいです。Amazonで2,500円前後です。これだけの内容でこの値段はお得です。
UIは日常生活にあふれています。UIを意識しだすと、駐車場の券売機、自動販売機、焼肉食べ放題の注文用タブレットなどなど自然と使いやすいとか使いにくい、こうすると使いやすい、私ならこのボタンをこっちにするとか、気が付くことが多くなります。それらを自社サイトに取り入れたり、反面教師としたりすることで、どんどん使いやすいサイトになって行きます。
■まとめ
お客様からみて分かりやすいデザイン・設計にすべし
デザインの敗北にならない様、第三者によるチェックはやるべし
巷にあふれるUIからヒントを得るべく、常にアンテナをはれ
お客様が購入してくれることが全て、それ以上でもそれ以下でもない