スマホECユーザビリティの極意:haco!

#(ハッシュタグ)によるサイト回遊性向上

haco!(運営:株式会社フェリシモ)のユーザビリティの優れた施策は#(ハッシュタグ)による回遊性向上です。

続きを読む

スマホECユーザビリティの極意:.st

「.st」スマホサイトはブランド横断検索により顧客接点を保つ導線が秀逸です。

続きを読む

スマホECユーザビリティの極意:コメ兵

コメ兵のリユース商材は①一点ものであること②高額商品であることが特徴です。そのたため在庫管理が難しく、高頻度で売れない特性があります。リユース市場は成長見込みがありますがCtoCの「メルカリ」や海外勢力等の登場によりプレイヤーは変化する兆しがあります。そのような外部環境を背景にコメ兵のウェブサイトはどのような取り組みをしているのでしょうか。コメ兵のスマホサイトを始めとしたウェブ全般の取り組みを見ると消費者の心理を突いた施策を提供することにより大きな視点として「店舗とネットのシームレス化」というテーマに取り組んでいると思います。店舗部門やネット部門というような縦軸の区分はせずに「お客様視点」を追求した全社的な協力体制を感じます。具体的な施策を見ていきましょう。

続きを読む

スマホECユーザビリティの極意:カゴメ健康直送便

カゴメのメーカー直販サイト「カゴメ健康直送便」は定期購入を促すユーザビリティが秀逸です。単品でカートに入れた場合の自然な導線は健康食品ECや雑誌等の定期購読サイトの参考になると思います。

続きを読む

スマホECユーザビリティの極意:モノタロウ

建設現場で使う資材など広範な商品を販売する「モノタロウ」(運営会社:株式会社MonotaRO)は商品を購入する現場の職人さん達の使い方を追求したこだわりがあります。

続きを読む

スマホECユーザビリティの極意:fifth

女性向けアパレルEC「fifth」(運営:株式会社CODE SHARE)はパソコンサイトや従来のモバイルサイト設計とは明らかに違うスマホのユーザビリティを追求しています。

続きを読む

スマホECユーザビリティの極意:HMV

極端に絞り込ませず音楽との出会いをつくる

欲しい商品があってサイトに訪れるユーザーはフリーワード検索からアーティスト名等を入力することが多いように想像しますが目的買いではないユーザーへはどのように商品をアプローチしているのでしょうか。HMVの場合、商品への興味を持って貰える工夫としてサイトTOPの各ジャンルを選んだら必ずジャンルトップに遷移させる導線を提供しています。

 

img01_20150610

 

例えばサザンオールスターズの新作CDが欲しいユーザーはフリーワード検索やトピックス欄から詳細ページへ向かいますが、なんとなく音楽CDを探そうと思っているユーザーはサイトトップのジャンル「音楽CD・DVD」をタップすると思います。ファッションECなどではトップページのカテゴリをタップすると開閉式のメニューが開きサブカテゴリーをその中から選び、検索結果一覧へ遷移します。

 

HMVスマホサイトでは「音楽CD・DVD」ページにはアーティストの様々なニュースやジャンルレスの視聴コーナー、例えば佐野元春の下に東方神起のニュースが表示されているなどユーザーの興味喚起させる多くのコンテンツが掲載されています。サイトへアクセスする前には思ってなかったアーティストや商品に出会う可能性があり、偶然の出会いを作るためにすぐに検索結果一覧へ遷移させていないのがポイントです。

 

「音楽CD・DVD」ページからは右側のボタンからサブカテゴリーを選択し、さらに次のカテゴリは次の階層で選択させているのも出会いの演出です。つまりユーザーの選択により一つずつ階層を下がっていく構成です。実店舗へ行くと入店するまで気付かなかったCD・DVDを購入することもありますがその理由は店内のポップ広告やチラシ・パンフレットなどに感化されて購入に至るのだと思います。

 

そのようなリアル店舗での偶然の出会いをスマホでも実現しようと階層の作り方と導線を工夫しているのだと思います。

 

リアルとの顧客接点としてのスマホEC思想により店舗受け取りを重要視

HMVでは店舗での受け取りや取り寄せが可能です。それをネット購入への導線「カートに入れる」ボタンのすぐ下に店舗在庫を参照するボタンがあるのはユーザーの都合を優先的に考えています。

 

img02_20150610

 

スマホサイトのユーザーが店舗で購入してしまうとネット注文にはならないのでネット部門があまり積極的に店舗経由の導線を作りたがらないサイトは見たことがありますがそれはサイト運営側の都合であってユーザーはネットでも店舗でもいいから商品が欲しいと思っていることも少なからずあるので店舗運営企業に限った導線になりますが店舗経由のボタンも並列に置くべきだと思います。

 

HMVの場合は各店舗ごとに在庫があり店ごとの在庫状況を○・△・×で一目で分かるようにしており便利です。勤務先付近の店舗で受け取ることもできるし乗り換え駅でも検討できます。また細かいユーザビリティですが店舗在庫一覧において「北海道地区」「東北地区」「関東地区」・・・と並んでいるにも関わらずそれら地区と並列に「recordshop渋谷」を表示しているのは工夫のひとつです。恐らく「recordshop渋谷」は多くの購入層が在住しているのだと思います。だからそれらの方が「関東地区」から「recordshop渋谷」を選択しないでもいいようにしています。女性をターゲットにしたサイトの会員登録において「性別」欄で「男性」がデフォルトだったり大半がクレジットカード決済なのに「代引き」がデフォルトだったりすると、多くのユーザーのタップ数を1つ増やしてしまうのです。スマホサイトのユーザビリティはタップ数を減らすことが命題です。

 

HMV+TSUTAYA+タワーレコードトップページ比較

3サイトいずれもトップページのファーストビューで提供している機能には大きな差異はありませんがメニュー配置場所には違いがあります。タワーレコードの場合サイト上部のロゴ横にスペースがありHMVでは詰めて配置しています。

 

img03_20150610

 

そもそもスマホは表示領域が著しく制限されますが反対に情報を詰め込み過ぎると誤タップなど意図しない操作をしてしまう可能性が高まります。CD等の音楽商品は新着のニュースが極めて大切なコンテンツになるのでファーストビューにいかに多くの更新情報を配置できるかも設計上の重要な視点です。

 

HMVではスペースを有効的に活用するために横スライド型にして極力省スペースでカテゴリを最上部に設けているのは工夫でしょう。「チケット」や「本・雑誌・コミック」を前面に出し「グッズ」等を背面にしユーザーの求める比率が多いものを前面にしているのは便利です。タワレコに比べナビゲーションのアイコンは小さいですがお気に入りや閲覧履歴は既に一度でも訪問したことのあるユーザーが利用するので小さくてもよしと判断されたのだと想像します。

 

タワレコのカテゴリはページ内リンクを設置している構成ですが「カテゴリ別」と「テーマ別」が並んでいるので何がカテゴリで何がテーマなのか分からないユーザもいるかもしれません。「テーマ別おススメ」というのは「K-POP HOT TOPICS」等のことですが「テーマ別」と見て「K-POP」をイメージすることは少ないと思うのでHMVのように具体的に記載したほうがよいと思います。

 

TSUTAYAもタワレコと同様に最上部のロゴ横に空白スペースがありますがここは上からの開閉式メニューで「宅配レンタル」や「店舗スタッフ募集」等TSUTAYA全店に関わるサービスが登場するので空白に意味はあります。ただオンラインサイトに訪問したユーザーが「宅配レンタル」をトップから探すかというと少々疑問を感じます。TSUTAYAではHMVとタワレコでファーストビュー配置しているログインや新規登録はなく最下段に目立たずにテキストリンクがあるのみです。TSUTAYAでは購入直前にログインをさせればよいという考えがベースにあると想像します。サイトへアクセスしてすぐにログインや新規登録をするユーザーは少ないだろうからファーストビューには含めないでよいという予測で設計をしているのだと思います。だからその分のスペースを作ることができ他2サイトではやっていないファーストビューにカテゴリをすべてボタン式で表示しています。これはサイト毎の考え方次第ですがTSUTAYAサイトで不便さは感じません。

 

フリーワード検索の精度

探している商品が決まっているユーザーがサイトへアクセスした場合、サイトTOPのフリーワード検索を利用しますがHMVでは予測検索が充実しており文字入力のしにくいスマホの操作性をシステムでカバーしています。

img04_20150610

 

 

例えば「サザンオールスターズ」の商品を探そうと「サザン」と入力すると「サザンオールスターズ」だけではなく英語読みの「Southern All Stars」や文頭の「サザン」ではない「リチャード・ウィリアム・サザン」も表示されます。アーティスト名や音楽関連の商品は英字やカタカナ表記、又は数字を含む名称もあり固有名詞として入力は比較的難しいことも多いですが予測変換があると助かります。

 

タワレコでは予測変換がないので同じように「サザン」と入力しても何もサポートはありません。「サザン」で検索をすると検索結果にはユーザーが意図していない「サザン・ナイツ」(アーティスト名)等が表示され、ユーザーが求めていなかった情報も含んで表示されます。検索するワードが固有名詞で入力が複雑な場合は予測変換でサポートするのはフレンドリーな仕様です。

 

検索結果ページに必要な在庫表示

アーティストに関連するワードで検索する場合はアーティストに関連するものなら何でも欲しいという意向も少なからずあると思いますが、多くの場合はアーティストのCDやDVD等目当ての商品をイメージしていると思います。例えばサザンオールスターズの場合ではタオルやTシャツ等のグッズも多く販売しているのでその中から目当てのCDを見つけ出すことになります。ようやく見つけた商品の詳細ページへ遷移して在庫がなかった場合のショックは離脱に繋がる直接的な理由になると思います。従って検索結果一覧ページで在庫があるのかどうかが必要で、詳細ページへの遷移ならびに在庫がなかった場合のショックを和らげるでしょう。HMVには在庫表示は一覧にはなく、タワレコにはあります。

 

不要な人にはニュースは見せない

見たい人だけが意識して見るように最新ニュースのみ一件を表示しているのもモバイルらしい表示の工夫です。例えば「クローズアップ」欄には赤西仁のアルバムが表示されていますがその一件のみの表示です。「洋楽」欄も「K-POP」欄も最新の一件のみです。スマホサイトに訪問しているユーザーは自分に関係のある情報のみを閲覧できればよくて、不要な人にとってはストレスになり得ます。特にCDやDVD等では趣味が強く反映されるのでなおさら顕著だと思います。そのようなユーザー心理を考慮した設計だと思います。

 

まとめ

CD販売のサイトに特化した導線もあったと思いますが商品の種類もジャンルも広範に渡る場合にいかにユーザーが自然に商品にたどり着き、また店舗連携も含め商品を手にすることができるのかを見てきました。フリーワード検索の精度は自社のサイトで問題なく提供できているでしょうか。スマホは入力は苦手な機械です。商品を探そうとしているユーザーを支援するのは重要なのでぜひチェックしてみて下さい。

スマホECユーザビリティの極意:Fujisan

雑誌定期購読のFujisanスマホサイトはサイトに訪れたユーザー自身が気付かなった潜在的なニーズを提案しています。ユーザビリティ上の一番の特徴は『提案型の商品詳細ページ』です。紙版の雑誌はもちろん、デジタル版も同時に見せることにより自社で取り扱う商品と触れ合う機会を創出しています。

続きを読む

スマホECユーザビリティの極意:ドン・キホーテ

ドン・キホーテのスマホECは消費者が店舗に期待することをスマホ上で再現しています。一方でWebサイトならではの施策も取り組んでいます。ドン・キホーテは清潔に整理された従来の小売店の商品陳列とは大きく異なり、店内に商品を積み重ねて、あえて煩雑にすることにより、アミューズメント施設のような楽しさを演出しています。目を惹くPOP広告も「つい買ってしまう」ことを促します。楽しい売り場を通して、来店前には考えていなかった商品まで買ってしまうことも少なくありません。ただの「消費」ではない何かをユーザーはドン・キホーテに期待していると考えられます。

続きを読む

スマホECユーザビリティの極意:マックデリバリー

飲食業の宅配サービスはワタミやぐるなび、楽天などの大手企業や従来は店舗運営に特化してきたマクドナルドやモスバーガー、ファミリーレストランなども参入している市場です。消費者のニーズが高まる中で、スマホサイトからどのように商品を注文できるのか見たいと思います。ネット上で成約するという視点でサイトを見るとコンバージョンを目指すECサイトのユーザビリティにも参考になる点があると考えます。

続きを読む