Yahoo!の初心者特化型EC『らくらく通販』のユーザビリティ

Pocket

Yahoo!は昨年末にシニア層を対象としたEC初心者特化型の「らくらく通販」をスタートさせました。EC購買に慣れた私たちが迷わずに操作出来るUIを徹底的に見直し、シニア層が迷わず利用できるようにユーザビリティを工夫しています。

シニア向けスマートフォンの「ドコモらくらくホン」のように老眼対策としての文字サイズ拡大やボタン極大化も「らくらく通販」で当然取り入れています。ECユーザビリティの観点で「1:テキストライティング」、「2:表示」、「3:機能」の3視点から考察してみたい。シニア層のECに対する不信感を払拭することも大きな狙いだと推測するので全てのECで採用できる訳ではないもののターゲットのお客様が最も使い易いユーザビリティを追求する姿勢は参考になると思います。

 1:テキストライティング

一般的にスマホサイト上部の「メニュー」(=ハンバーガーメニュー)はPCに比べると回遊のしにくいスマホWebにおけるナビゲーションの役割がある。

例えばZOZOTOWNであれば「閲覧履歴」や「カテゴリーから探す」、「ブランドから探す」等への導線をメニュー内に設け導線強化策の1つになっています。「メニュー」の表記がなくともサイト上部に三本線のアイコンがあればおおよそのユーザーはそれが「メニュー」であることを推測でき迷うことはない。

img1_20160203

 

一方で「らくらく通販」では「メニュー」というテキストすら使われておらず「設定」という名前の大きなボタンがある。「設定」内の情報も極小化され、「ログイン」、「お知らせ」、「情報」、「Yahoo!ショッピングへのアプリダウンロード導線」のみが配置されています。

つまり「らくらく通販」における「設定」の役割はサイト回遊性強化を目指すナビゲーションは含まれず、設計者が一般的に考える「どのページにいても進みたいページに進むことが出来る導線が便利」は初心者にとっては迷いの種となると定義している点が特徴的だ。

面白いのは「Yahoo!ショッピングへのアプリダウンロード導線」は積極的にプッシュしている様子はなく、「らくらく通販に慣れてきたら多機能版のYahoo!ショッピングをご利用ください」と優しいライティングをしている点だ。あくまでも「らくらく通販」でECに慣れることが目的であるからこのようなテキストになっている。

「購入履歴」は「前に買った商品」とライティングされている。役割は従来の購入履歴なのだがスマホEC上で見る「履歴」という言葉が瞬時にイメージ出来ないシニアもいるのだと思われる。「カテゴリー」も使われていない。カテゴリーは商品分類であるから直訳すれば「分類・部類」となるはずだが唐突に日常生活で使わない日本語が出て来ても違和感があるのだろう。

シニア層は不信に対する危機意識が人生経験から強い傾向にあるので馴染みのない横文字が登場した瞬間に離脱してしまうこともあるだろう。それを考えた上で「カテゴリー」は「売り場」と書かれている。食品の「売り場」、調理器具の「売り場」、ダイエット・健康の「売り場」となり、確かに納得感がある。

ただしカタカナを全て言い換えている訳ではない。例えば「ログイン」や「キーワード」はそのまま使われている。またネットの操作用語とも言える「検索」は「検索」のままである。これらはシニア層であってもインターネットを利用している時点で理解しているライティングであるとYahoo!設計担当者が判断したのだと思われる。この絶妙な湯加減がYahoo!のセンスだと私は思う。

商品詳細ページのライティングも際立っている。「カートに入れる」ではなく、「この商品を買う」となっている。

「カートに入れる」では何を意味するボタンであるのかイメージが湧かないシニアもいるのだろう。「買い物かご」であれば伝わるように思うのだが「買い物かご」という意味は分かってもECサイトにおける「買い物かご」の意味が分からないのかもしれない。

不用意なEC用語を使わない点に「らくらく通販」の工夫が光る。詳細ページのライティングでは複数画像の表示も工夫している。Yahoo!ショッピングアプリでは商品画像をフリック(横スライド)して次の画像を見せるインターフェースであるためアプリ上の表示は画像数だけ「●○○○」と丸が並び、次の画像に移ると黒丸が移動して「○●○○」となるがECに慣れているから一般的には操作は迷わない。

「らくらく通販」ではボタンで大きく「画像をもっと見る」とライティングすることによりユーザーにして欲しい行動を省略することなく言語化している点が親切です。

 2:表示

インターフェースの一番の特徴はタップ出来る箇所を全て罫線で囲いアイコン化している点です。

img2_20160203

背景に薄い影を入れアイコンを際立たせることにより「タップ出来る」ことをより視覚化しています。アイコンとアイコンの間には必ず隙間を設け、バックグラウンドカラーの灰色から浮き上がらせている点も効果があると思われます。

またスマホサイトでよく見る2列や3列のカラムを採用せずに全て上下の視線移動でサイトを網羅できるようにしています。シニア層は個人差はあるものの一般的には加齢により視野が狭くなる傾向にあるので目の移動を少なくすることにより情報把握を正しく出来るようにしている工夫だと考えられます。

またYahoo!ショッピングでは楽天やamazonと同様にユーザーレビューを重要視し購入時における大きな判断材料になるためにレビューに至る導線を積極的に設けているが「らくらく通販」では商品詳細ページにおいてもユーザーレビュー欄は現時点ではない。これは恐らくECに慣れていない層にとっては必要な商品かどうかを決める効能としてのレビューは反対に迷わせてしまうことに繋がるために実装しなかったと推測できます。

ECサイトの醍醐味とも言えそうなキャンペーン等のセールス情報を極力除去しているのも「らくらく通販」の特徴です。

Yahoo!ショッピングのトップでは「友達紹介で最大3000ポイント!」、「全員毎日ポイント5倍」等が最上部に目立つグラフィックで表示されていますが「らくらく通販」ではありません。キャンペーン利得により商品購入が促進されることとキャンペーンを売り込みに感じて拒否感を抱くことを比べた場合に「らくらく通販」では後者を選択したのだと思われます。情報の最小化もこのECの特徴の一つです。

UI面の細かい点かもしれませんが表示においてタップしてから遷移先が表示されるまでタップしたボタンの色が白からオレンジに変わります。これは「このボタンを触ったこと」を示すデザイニングの工夫で「どこのボタンを触ったか分からない」という不安を少しでも払拭するための取り組みだと思います。

 3:機能

商品一覧画面の絞り込み機能は特にモール系など商品数が膨大なECでは標準実装されています。一覧に掲載された商品を価格帯や新品or中古、ブランド名などでソートする役割がありますが「らくらく通販」にはありません。「らくらく通販」のユーザーはトップ画面から売り場(=カテゴリー)を選択し自分の興味のある中カテゴリーを選択し少しずつ自分が求める商品を探り当てようとします。ようやくたどり着いた一覧画面は既にシニア層にとっては絞り込まれている状態であり、従来の絞り込み機能は不要と判断したのだと思われます。

このECの優れている点は従来のECユーザビリティを当然のこととしなかった点にあります。表現や遷移を全て見直しシニアのECのあるべき姿に向き合った設計担当者の気概を感じます。

Pocket

無料ebook:ミナクル式スマホサイト改善
スマホECの売上を2割アップする!
スマホサイト改善ちょっとしたコツ
76連発レポート!

業界によっては6割以上がスマホからのアクセスになりましたが、「実際にどうサイトを改善したらいいかわからない」という声をたくさん頂きます。

本PDFは、弊社のお客様に改善提案する中で生まれたノウハウを体系化した全100ページ以上にわたる資料です。

  • 自社のサイトは大丈夫だろうか
  • スマホサイト改善と言っても実際どうしたらいいか分からない
  • スマホでの売上をアップしたい

などとお考えの方はぜひご覧ください。

ebook無料でダウンロードする

【弊社実績一例】



ヤマハ発動機株式会社様/積水化学工業株式会社様/株式会社パルコ様/株式会社エポスカード様/アディダス ジャパン株式会社様/株式会社フジゼロックス様/シュウウエムラ様/ダノンジャパン株式会社様/株式会社マイナビ様/第一三共ヘルスケア株式会社様/株式会社サイバーエージェント様/株式会社船井総合研究所様

コメントをどうぞ

*