共栄美装WEBサイト12月中旬アップデート情報～画面遷移なしで商品のカート投入と削除に対応～

12月初旬から、弊社は見積もり依頼の受付けに使用しているショッピングカートシステムの利便性をさらに向上させるため、UXの改良を続けております。前回はカートの中身をいつでも気軽にポップアップでチェックできるようにしたというものでした。

今回は、その発展形として商品のカート投入と削除を画面遷移なしでリアルタイムで行えるよう対応しました。

画面遷移のデメリット

画面遷移とは、リンクをクリックした時などにページを移動してしまう事を指す言葉です。それまで見ていたページは切り替わり、再び見たい時は移動先から「戻る」「他の商品を見る」を押さなければならず、商品ページとカートの中身ページを何度も行き来するため手間が発生します。

大きく分けると、以下2点の問題が発生しています。

この画面遷移をしなくても良い高速でスムーズな状態を◯、画面遷移が必要で時間がかかる状態を✕とした時、弊社のカートシステムは以下のように進化しました。

※数量変更はいずれの場合もカートページに移動して行います。

試しに、弊社のホワイトテーブル(1500×450mm)を10脚、スタッキングチェアを40脚をショッピングカートに入れてみたところ、50秒ほどで出来ました！

途中、パイプ椅子を入れましたが要らなくなったのでサイドバーからゴミ箱のアイコンを押して削除しています。
中身を確認、カート投入、アイテム削除という操作が画面繊維をしなくても出来るようになると、いかにスムーズに手続きが進められるのかがよくわかりますね！

カート投入ボタンを押した際、下図のようなオレンジ色の「＋」アイコンがふわっと浮き上がる仕掛けを作りました。これはサイドバーのないスマホでも、直感的にココにアイテムが入ったことを知らせるために設置しています。

いくらカートシステムが便利だとはいえ、WEBサイトの動作を億劫に感じると電話をしたりメールで何を何個借りたいのか直接書きたくなるものです。

億劫に感じる要因は様々ですが、私たちはページ遷移のトータル数もその一因だと捉えています。

カートやサイト内検索は、一般的には画面を遷移することで結果を出力するものが多いです。ですが、読み込みが入ってしまうとストレスになります。

ここで画面遷移を減らしつつ出力結果の所得を部分的に限られた範囲内で行えば、ユーザーのストレスが減ります。

これからもイベント主催者の皆様に、ゆとりを作る最良のUX(ユーザー体験)をお届けしていきたいので、WEBサイトのアップデート情報も楽しみにしていてください！