Showcase:カート・お気に入り追加

本来なら「テストパターンを考える時のアイデア その4」を書く予定だったのですが、まぁ、ちょっと時間がかかってまして、お茶を濁すわけではありませんが、カートの追加やお気に入り登録をした時のインタラクションの事例をいくつか。

サイトはどんどん変化していってしまうので、最近は動画にとっておくのがお気に入りだったりします。QuickTimeであれば簡単に画面範囲を指定した録画も出来ますしね。ということで操作動画を撮ったものを見ながらでの解説で。

kuhl.com

Kühl Clothing:Retail系のサイトです。TOPからの商品発見は若干の難しさがあるものの、カート追加・削除まわりについては非常に明確なインタラクションを提供しています。

これを見ると下記のポイントなどが特徴的な部分と捉えられます。

  • カートの件数表示は常に画面上部に表示されている
  • カート内の商品の件数を常に表示
  • カートへのインタラクション(追加・削除)が発生すると上部の件数表示も変化
  • 追加・削除された際にNotificationによりカートの場所が認知されやすくなる
  • TOPに戻っても表示され、クリックすると中身を確認できる

Hollister

Hollister Co. – Shop Official Site:こちらもRetail系のサイトです。全体的に少しくらめのデザインにはなっているのですが、商品リスト、商品詳細からのカート追加のアクションは最近のスタンダードな方式になっているように感じられます。

これを見ると下記のポイントなどが特徴的な部分と捉えられます。

  • 商品詳細と商品リストの両方からカート追加が出来る
  • 追加後に画面遷移はせず画面の右上部にカートの中身が表示される
  • 右上部のカート情報の部分をオンマウスでカート内が表示される

Homes.co.jp

日本で展開されている不動産サイトのHOME’Sのお気に入り登録の例です。

これを見ると下記のポイントなどが特徴的な部分と捉えられます。

  • お気に入りに登録をするとポップアップでお気に入りのインタラクション、場所を表示
  • 検索結果ページの上部にて常にお気入り件数を表示
  • TOPページに戻るとお気入りに設定されたものを表示

まとめ

実際にここに挙げるまでに色々なサイトを徘徊して触ってみているのですが、主流として見えてきているのは下記のような感じがします。

  • リスト、商品詳細のどちらからでも追加可能
  • 遷移をしなくてもオンマウスで中身の閲覧が可能
  • 中身に何件登録されているかを表示
  • TOPや再訪問時にもきちんとカートに商品があることを伝える

上記のポイントはあくまで見えてきている傾向なので、これらを取り込むことでサイトが良くなるかどうかはわかりません。だからテストをするわけですね。

You Might Also Like