web-dev-qa-db-ja.com

ダブルモーダルポップアップが心配ですか?

つまり、Webページで何かを選択するとします。それはあなたに記入するモーダルポップアップフォームを提供します。このフォームには、別のフルスクリーン(モバイル上)モーダルポップアップを表示する日付ピッカーがあります。ポップアップ開始のように感じます。それが主要なユーザビリティの懸念であるかどうか私は思っていますか?

ポップアップフォームはこのプロジェクトの標準パターンなので、私の手は縛られていますが、すべてのシナリオで機能するカスタム日付ピッカーを実装しようとしています。

1
Calum

はい、これは良い習慣ではありません。

それはタイプシステムに依存します(たとえば、IOSまたはAndroidには時間機能のための他の設計と実装があります)

PWAの場合:汎用データセレクターを使用することが重要です。これは、最短時間でどこにでも実装できます。

私が見る可能性は、ポップアップではなくUIの折りたたみを使用することです。 enter image description here

1
Piotr Żak

Calum、ネストされたモーダルには2つの課題があります。

  1. ユーザーは自分がどこにいるかがわからなくなる可能性があります。
  2. 複数のモーダルをバックトラックするのは面倒です。

モーダルダイアログが2つ多分 3になる2つ以上のデザインを見てきたが、それらのモーダルは非常に集中していたため、かなりうまく機能した。

たとえば、以下はmacOSのスクリーンショットですSiri設定パネル:

enter image description here

クリック Siri Suggestions & Privacy… このモーダルを開きます:

enter image description here

クリック About Siri & Privacy… モーダル内で、前のモーダルの上に表示される別のモーダルを開きます。

enter image description here

したがって、実際の設定パネルに戻るには、2つのモーダルを閉じる必要があります。

MS Windowsの古いバージョンのDNS構成と比較してください。

enter image description here

5つすべてスクリーンショットに表示されるウィンドウは、モーダルダイアログです。 thisの場合、ユーザーはダイアログチェーンのどこにいるかの手がかりを持たない可能性が高く、5つすべてのダイアログボックスを手動で閉じる必要があります。

ネストされたモーダルは決して理想的ではありませんが、場合によっては回避するのが難しい場合があります。それらが必要な場合は、ユーザーがどのパスをたどるかを理解していることを確認し、さらに考慮に入れてください頻度ユーザーはそのパスをたどる必要があります。面倒;それがまれなタスクである場合、ユーザーはネストされたモーダルをナビゲートしていることに意識的にさえ気付かないかもしれません。

とはいえ、デザインをテストしましたか?そうでない場合は、プロトタイプを作成してみてください。単純な紙のプロトタイプですでに問題が解決している可能性があります。また、社内で簡単な「廊下テスト」を行って、ベースラインのフィードバックを取得しますか?

幸運を! :)

1
JochenW

私はあなたがモバイルについて話しているだけだと考えて、この意見を書いています。

モバイルの場合、モーダルポップアップが画面全体をカバーしている場合は、ユーザーにとって新しい画面になります。したがって、相互作用は階層的なドリルダウンのようになります。この場合、ポップアップのカレンダー(ユーザーの新しいシーン)は問題ありません。

Webの場合、日付ピッカーが全画面をカバーしている場合、既存の非全画面ポップアップの上にそれを表示すると、ユーザーがどこにいるかを追跡できなくなります。ただし、この場合、ポップアップで小さな日付ピッカーをポップアップすることを考え、日付ピッカーを表示したら、最初のポップアップで他のカレンダー関連の選択を表示しようとすることができます。正直なところ、私自身、この段落でWeb用に何を書いたか確信が持てません:)

1
Omkar Chogale