ユーザーがWebフォームへの入力をキャンセルできる場合がいくつかあります。現在のデザインでは、ユーザーがエラーを防ぐために「キャンセル」をクリックした後、Webサイトは画面の中央にモーダル(ほとんどの場合、元のキャンセルボタンが配置されていない場所)に確認ダイアログを開きます。ただし、偶発的なクリックをキャッチするために「インラインボタン」を使用する可能性もあります。これらのボタンは、次の例のようになります。
「x」をクリックすると、ボタンが確認ボタンに変わります。
私の意見では、モーダルボタンと変更ボタンの両方に長所と短所があります。私は「変更ボタン」の使用をためらっていますが、それらはユーザーによる移動が最小限であることを意味し、画面の別の部分にフォーカスを変更する必要がないため、効率が向上します。
私はこのトピックに関する議論や2つの方法の違いを見つけることができず、いくつかの意見を聞きたいと思います。
サンプル画像は here から取得されました。
それはいくつかの要因に依存します:
ここにいくつかのパターンがあります:
[元に戻す]ボタンで確認トースト。これは実際には、ユーザーが意図したとおりに比較的確信できる変更のためのgreatパターンです。削除操作に費用はかかりません。バッチ操作の邪魔になりません。唯一の注意点は、元に戻す操作の深さが大きくサポートされていないことです。それらを積み重ねることはできますが、無期限に行うことはできないため、ユーザーが無限に戻ることを許可することが重要な場合、これは適切なパターンではありません。
確認モーダルダイアログ。これはユーザーの面で非常にコストがかかり、バッチ操作を妨げるので、結果が悪く、バッチ削除をサポートする必要がない場合のために予約する必要があります。
ページの状態を保存/キャンセル変更として保存する代わりに==。ページに変更を加えると、変更は保存されませんが、[保存]ボタンが[キャンセル]ボタンとともに表示されます。これはバッチ操作をサポートしますが、チェックボックスをオンにするなどの完全にリスクのない変更(チェックが外れるのも簡単)でも、ユーザーがページで[保存]をクリックするまで変更は適用されません。また、[保存]ボタンが非常に表示されている必要があります。そうでない場合、ユーザーは変更を保存し忘れて別の方法でデータを失う可能性があります。
危険なジェスチャーを複雑にする。クリックの代わりに、2回クリックして何かを削除します。強制的なダブルクリッカー(多くのユーザーは常に ダブルクリック)。この種の方法は機能しますが、ベースケースに多くのユーザーコストが追加されます(削除は常に2倍難しくなります)。これは、バッチ操作にとって非常に面倒です。多くの状況で、ジェスチャーを複雑にするよりも、取り消し付きの確認トーストを使用する方が良いことがわかりました。
ポップアップまたはサイドパネルは通常、ユーザーに複雑なサブフローを案内する必要がある場合に使用されます。アプリケーション間でAltキーを押しながら操作を行っていると考えてください。
「インライン」ソリューションは、ユーザーが特定の順序で完了する必要のあるタスクの順次フローがある場合に最適です。
あなたの状況では、アイテムを1つずつ削除できるアイテムのリストがあり、ユーザーが各アクションを確認する必要がある場合は、「インライン」ソリューションが推奨されます。
例:「X」のラベルが付いたCTAボタン。ボタンをクリックすると、どういうわけかアイテムがハイライトされ、新しいボタンにケーブル「削除」が表示されます。この新しいボタンに加えて、ユーザーが誤ってクリックした場合にユーザーがバックアウトできるようにするセカンダリCTAも必要です。セカンダリCTAは「キャンセル」にすることができます。