ショッピングカートの変更をユーザーに通知する方法は？

Question

作業中のWebサイトにオンライン決済を実装しています。すべては技術的な側面で機能していますが、UXに関する質問があります。

ユーザーがカートに商品を追加したとします。何が入っているか、いくら払う必要があるかを示すカートページに行き、チェックアウトフォームも含まれています。実際のチェックアウトが行われると（JSを介して非同期で）、カートの内容が再度チェックされ、合計金額が再計算されます。つまり、ユーザーが別のタブでカートに商品を追加した可能性があります。この商品は、生成時にカートページに表示されていなくても、チェックアウトに含まれます。

編集：より明確にするために、問題を段階的に示します。

1. カートページ/チェックアウトが生成され、ユーザーに表示されます。商品Aのみが含まれています。
2. ユーザーは別のタブで、製品Bをカートに追加します。
3. カートページで開いたタブに戻り、実際のチェックアウトが完了すると、（1）以降ページが更新されていないため、ユーザーは製品Aと製品Bに対して支払いを行いました。

これが発生した、または発生する可能性があることをユーザーにどのように伝えますか？それが発生するのをどのように防止しますか？

Answer 1

このような状況からユーザーを保護するには、2つのセッションレコードが必要です。

CART_ITEMS-現在カートに入っているアイテム。

CHECKOUT_ITEMS-ユーザーが支払いをしようとしているアイテム。

支払いトークンをサーバーに送信する前に、CHECKOUT_ITEMSをCART_ITEMSと比較し、違いがある場合はユーザーに通知する必要がありますこれらの変更の。

シナリオ例：

ユーザーが商品の支払いをしようとしていますが、カートに別の商品が追加されました。現在、アイテムは支払いページに表示されていません。 「チェックアウト」ボタンをクリックすると、ユーザーのカートに新しいアイテムがあり、アクションが提供されることを示すメッセージが表示されます。

^{download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム}

Answer 2

Ivan Venediktovの回答に加えて、差別化（新規アイテム）ラベルを新規アイテムに追加して、ユーザーがカートに追加した新規アイテムが何であるかをユーザーに確実に知らせます。