web-dev-qa-db-ja.com

3方向のトグル(表示、すべて表示、非表示)を最適に表示するにはどうすればよいですか?

検索用のフィルターを作成していますが、このインターフェースに最適な方法を考えています。

データベースにたくさんのイベントがあり、私のWebサイトにはユーザーの基準に基づいて特定のイベントが表示されています。簡単なことですが、アルコールを出すイベントや、参加するには18歳以上である必要があるイベント、女性のみを対象とするイベントなど、一部のイベントにはメモがあります。私がしたいことは、これらのオプションを表現して切り替えるための何らかの方法を私の「検索」フォームに追加することです。

これは単にオン/オフするだけではありません。これらも無視できるようにしたいからです。この場合、18以上のイベントをオフにすると、18以上のイベントがすべて非表示になりますか、それとも18以上のイベントだけが表示されないということですか?ユーザーを混乱させます。

ユーザーにすべてのオプションを提供し、これをできるだけ明確にするには、3方向の切り替えが最適だと思います。オフ-この設定は18以上のノートを無視し、通常どおりイベントを表示します。 SHOW-この設定は18以上のイベントのみを表示します。 HIDE-この設定は18以上のイベントをすべて無視します。

これを行うとしたら、レイアウトも考慮する必要があります。これは3方向スイッチになりますか? 3つのチェックボックスがあるグリッドになりますか? 18以上の検索条件を「オン」にしてから、「オン」または「オフ」を選択する必要がありますか?

3方向スイッチを実行した場合、どのように設計しますか?他の2つがこれらのイベントのみを表示または非表示にする一方で、1つの設定が18+を完全に無視することを明確にするために、どのように名前を付けますか?

これは私がいくつかの援助をしたいところです。これが特にうまく行われているウェブサイト(または他のインターフェース)でこれまでにこのようなものを見たことがありますか?何かアドバイスはありますか?

ありがとう!


(私の背景について-私は巨大なUIの男です。私は修士号を持ち、専門的にやっています。また、大学のコースをいくつか教えていました。これが私の最初の投稿です。こんにちは!)

1
Brendan

トグルは2方向にしかできません これもトリッキーです 。探しているのはグループボタンだと思います。これはトグルよりも直感的です(何が選択されているかがわかり、ラベルが付けられています)。ただし、グループボタンはトグルよりも多くのスペースを必要とします。私はこのようにします: enter image description here

1
Ada

3方向トグルを聞いたことも見たこともありませんが、おそらくWordの意味論にすぎません。

答えは、フィルターファセットの仕様によって異なります。それが単にはい/いいえの集まりであり、それらが相互に排他的でない場合は、間違いなくチェックボックスを探してください。

チェックボックスは、条件を満たす必要があることを意味します。チェックされていないという意味-私はこれを気にしません。

Restrictions
[] 18+
[] Women only
[] Serve alcohol
[] Alcohol free

チェックボックスを使用すると、データベースの実装モデルではなく、ユーザーのメンタルモデルに対応する意味のある方法でフィルターオプションをグループ化できます。同じグループの2つのオプション間の関係は「または」である必要があることを覚えておいてください。そうすることで、アルコール用に両方のフィルターを選択することも意味があります。

相互に排他的なオプションしかない場合は、ラジオボタンを使用し、デフォルトのオプションとして「すべて」を使用します。例えば。 」

Fuel type:  
(*) Any
( ) Diesel
( ) Carrot juice

ユーザーがAmazon.comやautotrader.comなどの多くのものにフィルターをかけることができるように、経験豊富なプレイヤーを常に見る価値があります。

0
Jurijs Kovzels