私はモーダルポップアップを構成しています---これはフォームで構成され、ユーザーはテキストエリアにコメントを入力できますボタンのセットprimaryおよびsecondaryユーザーが実行できるアクションを表します。
このシナリオで一般的に使用されるパターンは、 http://www.lukew.com/ff/entry.asp?571 のように、プライマリアクションとセカンダリアクションを視覚的に区別することです。ただし、私が見たすべての例には、単一のプライマリアクションと単一のセカンダリアクションしかありません。通常、Submit/SaveとClose。ただし、私の特定のケースでは、特定のワークフローを再開できるmultipleプライマリアクション(ApproveおよびReject)があり、1つのセカンダリがあります。アクション(Close)は、本質的にモーダルポップアップを閉じます。
このパターンをこの設定にどのように適合させましたか?私の最初の考えは、「承認」と「拒否」の両方をプライマリアクションに、「閉じる」をセカンダリアクションに変えることでした。もう1つの方法は、「キャンセル」ボタンをプライマリアクションにして、残りの2つをセカンダリアクションにすることです。このようにすると、ページ内で最も目立つボタンである単一のプライマリアクションが残りますが、その結果、かなり奇妙な「プライマリ」アクションが発生します。
私は別の視覚的なインジケーターとセカンダリを使用します。
download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム
重要なことは、ユーザーがアクションを選択する頻度です...ユーザーが90%の時間で「承諾」、9%を拒否、1%をキャンセルする場合、[承諾]は[拒否]よりもヒットが大きく/簡単であるべきです。上記のように。比率がより均一であれば、両方を同じサイズに保つことになります。
Myrddinの提案はとても気に入っており、そのコンセプトはうまくいくと思います。別のオプションとして、赤/緑(一部の色覚異常のユーザーには同じように見える可能性があります)を避け、緑のチェックアイコンを[承認]と組み合わせて使用し、赤のxアイコンを[拒否]と組み合わせて使用します。アイコンが異なる色で、それを見ることができる視覚的な手がかりであるが、形状は通常、それを使って単語を読まなくても認識できる場合-モーダルの目標を知るのに役立つ迅速な視覚的な手がかり。
myrddinの提案も気に入っています。コミュニティが2つのプライマリボタン/ 1つのセカンダリリンクの問題を確実に解決したとは思いませんが(私は私の組織ではないことを知っています)、この集中力を設計に組み込むためにプライマリアクションとセカンダリアクションを交換することはお勧めしません。特定のユースケースにおけるプライマリアクションは、常にプライマリアクションです。ボタンの配置や視覚的処理などの設計上の考慮事項は適用されません。