web-dev-qa-db-ja.com

ダイアル対スライダー:いつ、どのように使用するのか?

ダイヤルとスライダーをいつどのように使用するかを理解するための一般的な情報を探しています。私たちの課題は、関係の調査、値の比較、およびデータ値の表示に現在両方を使用していることです。文字盤に関する情報があまり見つからないので、文字盤の適切な使用法について詳しく知りたい。

6
WillHampton

「情報を表示する」ということで、何らかの画面を使っていると思います。

それは他の多くの要因の解釈の基礎にあるので、あなたの質問への簡単な答えはありません(あなたは言及しません)。

ただし、ダイアルとスライダーは当初、メカノ電子デバイスの触覚入力センサーとして使用されています。あなたのような一般的な質問は、画面に到達する方法の基本に戻ってこれらのメタファーをそこで使用することを選ぶことです。これに関する素晴らしい本は、ドナルドノーマンのタイトルである The Design of Everyday Things です。物事がどのようにオプションを提供しているか、そしてそれらがどのように動作するかについての理解を与えます。または、Apple彼らがスライダーを実装する必要があると考える方法のガイドラインを見てください。 ここにリンクの説明を入力してください

前進を支援するために:新しい概念を扱っておらず、特定のコンテキストでスライダーとダイヤルを使用している場合は、競合他社を比較して、最良のソリューションを採用できます。

1
Dirk

NielsenとNormanが スライダーとノブの使用に関する記事 を作成しました。これは彼らがノブについて言っていることです:

ユーザーが「回転」させる必要のある仮想ノブまたはその他のコントロールは、パンなどのパラメーターを自然に表すことができます。オーディオエンジニアは、オーディオをミキシングするときに、左または右のスピーカー(またはその間のどこか)から再生するサウンドを移動します。ただし、仮想ノブは、回転の自然なアフォーダンスを持たないマウスやトラックパッドなどの一般的な入力デバイスでの操作が物理的に困難です。マウスなどの線形入力デバイスは回転を実行するのが難しいため、一部の設計ではノブに非表示の線形ドラッグ機能を追加し、ユーザーが上下に上下にドラッグしてパラメーター値を増減できるようにしています。ただし、この動作は予期されておらず、通常はシグニファイアがないため、ユーザーがそれを発見することはありません。 (さらに、適切に実装されていない場合は、ノブの回転を模倣するためにマウスを円で動かそうとする人からコントロールを奪う可能性があります。)

ノブがより良いアフォーダンスを提供する場合がありますが、この利点が使いやすさの欠点よりも優れているかどうかを判断する必要があります。

IMO、タッチのみのインターフェイスの場合、適切な番号表示のある十分に大きいノブが適切な場合があります。マウスインターフェイスについては、お勧めしません。

1
Tin Man

スライダーは間違いなく優れた使いやすさを持っています。それらは広く使用されているパターンであるだけでなく、一般的に理解されています。しかし、人間は、曲線や円のセグメントよりも、線や長さを判断してナビゲートするのが得意です。 UXに関しては、スライダーを使用してください。それらは明白な選択です。しかし、私はダイアルはもう少し斬新で、インタラクティブなことは言うまでもなく、美的にもっと楽しいと思います。正確な調査を思い出すことはできませんが、ユーザーエクスペリエンスアプリケーションがかなり悪いにもかかわらず、濃淡のあるvisと円グラフの記憶力がいかに高かったかについての議論を覚えています。

1
Jason Grover

これは主に、データの配列から値を選択するためのそれらの使用を参照しています。

疑わしい場合はスライダーを使用すると思います。 1つのバーに複数のスライダーが含まれる場合があるため(高、中、低)、またはその他(高さ、幅、深さ)のスライダーには、多機能であるという追加の利点があります。技術的にはどちらも最小値と最大値の間の値に関して範囲に制限はありませんが、UXの観点から見ると、スライダーはより広い範囲に適しています。つまり、マウスでは難しい場合があるが、ダイヤルは複数の回転を必要とします(キーボードはそれほど明白ではありません)。人が思うように、すべてがダイヤルの場所に関係なくまっすぐにクリックアンドドラッグできるわけではありません)。標準のダイヤルは10(Spinal Tapの場合は11)にしかなりません。クリックすると、マークされた間隔の間にある値が考慮されません。

だからスライダーはいつも…そう?

親愛なる神、あなたは怒って吠えていますか? Jason Grover 船とダイヤルの関係で、「小説」を使用してヒットします。ダイアルは制限の感覚を提供しますが(最大の方向にどれだけ移動できるか、またはグリップを握る必要があります)、私に聞かせてください。 [これらのいずれかでスライダーを使用しますか?

enter image description here

このようなインタラクティブラジオで歴史的なページを見る人は、たとえ不便であっても、ダイヤルには懐かしいでしょう。

結局のところ、どちらを使用するかはほとんどあなたの選択でさえありません。これは、デザインでこれまでに適切なものに任されます。私はあなたがあなたに選択肢があるように感じた場合、どこかでエラーを示していると言っておきたいと思います。

0
user1586275

UXのほとんどのものと同様に、どのウィジェットタイプを使用するかは、次のような多くの要因に依存します。それらが主にデータ表示またはデータ入力に使用されているかどうか。そのデータ入力に必要な精度。表示/制御されるデータのタイプ。周辺のレイアウト; 2つの一般的なデータカテゴリを区別する方法として。などなど...

私たちのデザイナーは、ダイヤルとスライダーの両方を交換可能に使用しています

デザイナーがダイヤルまたはスライダーを使用することを選択した理由は、各コントロールインスタンスについて明確にすることができますか?そうでない場合(または、答えが「そのように見えるだけ」に沿っている場合)、答えはおそらく「より優れたデザイナーを雇う必要がある」です...

ダイヤルを好むいくつかの理由

  • 周囲のレイアウトに応じて、スライダーよりコンパクトにすることができます
  • スライダーよりも視覚的に興味深いものにすることができます
  • 製品が、通常、ノブ/ダイヤルを使用する物理的な製品のデジタルバージョンである場合、いくつかの変形の利点がある可能性があります。
  • 入力が特に正確である必要がない限り、データ入力に対して「触覚的に」魅力的にすることができます。
  • 無限/無限のデータ範囲をサポートできます(スライダーには明確な開始と終了があります;ダイヤルは回転し続けることができます)
  • 特定のコントロールを、スライダーである他のコントロールのセットと明確に区​​別するには

スライダーを選ぶいくつかの理由

  • データ入力に非常に使いやすい。円を描くよりも、線を描くようにマウスや指をドラッグする方がはるかに簡単です。実際、一部のラジアルコントロールは実際には線形入力を受け入れます。これは物理的には簡単ですが、より混乱します。
  • 複数のコントロール間で値を比較するのが簡単です(同じデータ範囲の一連のスライダーは事実上の棒グラフとして機能するため、他よりも高いまたは低い一目で簡単に確認できます)
  • 放射状の入力よりもやや正確(もちろん、細かい精度が必要な場合は、数値データ入力が適しています)
  • Webでは、少なくとも実装がはるかに簡単です(ネイティブスライダーコントロールがあり、ラジアルダイヤルコントロールにはカスタムコーディングまたは既定のライブラリが必要です)
  • 特定のコントロールを、ダイヤルである他のコントロールのセットと明確に区​​別するには
0
Daniel Beck