web-dev-qa-db-ja.com

ユーザーは「クリックして追加」または「ドラッグアンドドロップして追加」を好みますか?

私は開発中のWebアプリ用に Golden Layout というJavascriptドッキング可能ウィンドウフレームワークを使用しています。彼らのサイトには、フレームワークにウィンドウを追加する方法の例が2つあります。これらの2つは、現在実装を検討しているものですが、どちらがユーザーに適しているかわかりません。

最初は ドラッグアンドドロップスタイルメソッド です。ユーザーは、コンポーネントのリストから特定のコンポーネントを取得して、ページに配置する必要があります。モジュールを好きな場所に配置できるため、これは素晴らしいですが、ユーザーはこの効果を達成するためにクリックしてドラッグする必要があります。

他のメソッドは メソッドを追加するにはクリック です。ユーザーがリストに追加するコンポーネントをクリックすると、モジュールがページの最上位レベルに追加されます。これも良いアプローチですが、ユーザーはその上に行き、位置を変更する必要があります(そうすることを選択した場合)。また、ユーザーがさまざまな場所に多数のモジュールを追加していると、混乱を招く可能性があります。モジュールが配置されている場所を確認できない場合があります。

質問:

ユーザーがWebページにコンポーネントを追加する方法に関するベストプラクティスはありますか?ユーザーは、ドラッグアンドドロップまたはクリックして追加しますか?これに関する統計はありますか?

16
BDD

私が学んだように、同じアクションに提供するオプションが多いほど、アプリケーションは優れています。したがって、アドバイスはドラッグアンドドロップとクリックして追加の両方を実装することであり、1人のユーザーがどれを使用するかについて心配する必要はありません。

さらに良いことに、特定のケースで最も人気のあるものを追跡するオプションがあり、既存のより一般的な研究とは異なる場合があります。

23
Benny Skogberg

ユーザーは、ドラッグアンドドロップまたはクリックして追加しますか?

ノートパソコンのタッチパッドではドラッグアンドドロップが難しい場合があることを考慮してください。 Click-to-Addを使用できる場合なし追加のドラッグ手順で、一部のラップトップユーザーをより幸せにします。これは、ドラッグとスクロールの試みが混同される可能性があるタッチスクリーンにも当てはまります。最新のタッチ対応ブラウザーはこれをある程度うまく処理しますが、完全ではありません。そして、時々イライラすることがあります。

また、ターゲットユーザーを考慮してください。障害を持つユーザーをサポートする必要がありますか?一部の人は、ポインティングデバイス(関節炎?RSI?)の使用が難しいと感じるかもしれません。他の人は視覚に障害があり、キーボードとスクリーンリーダーだけを残してしまう可能性があります。その場合、ウィンドウ/ MDIレイアウトを使用してもまったく意味がありません。

ユーザーの大多数はドラッグアンドドロップを好むかもしれませんが、そのようなユーザーをサポートする場合は、代替(キーボードフレンドリーですか?)メカニズムをサポートする必要があるかもしれません。

7
Bob

状況によって異なります。クリックして追加し、ドラッグアンドドロップすると、わずかに異なるプロセスで同じ結果が得られます。

クリックして追加した場合の場合、期待は特定の何かを選択したことです。このアプローチの利点は、「これをそのバケットに入れたい」という特定性になることです。それが私の努力の論理的な結果であるとき、追加するためのクリックは完全に理にかなっています。良い例は、クリックしてカートに追加することです。私が購入したいものを追加したい場所は他にあまりないので、クリックして追加することは完全に理にかなっています。不利な点は、具体的なコントロールではありません。それは、ユーザーとして物理的にそこに置いたのではなく、魔法のようにそれが入ったという事実を参照していますが、おそらく別の場所に移動したかったのです。移動先が不明な場合は、クリックして何かを追加することに注意してください。

ドラッグアンドドロップの場合の場合、期待できるのは、ドラッグできる場所が複数あり、その場所を選択していることです。このアプローチの長所は、それを動かすことの具体的な活動です:「私はこれをあちこちにドロップすることができます...またはここにずっと行くことができます」良い例は、リストまたはリストのセットのアイテムです。たとえば、Wunderlistはドラッグアンドドロップを使用して、リスト上の項目を再編成できます。欠点は、エラーの可能性、またはさらに悪いことに、ユーザーによるコミットメントの欠如です。 「そこに置きたくない場合はどうでしょうか」というのは公平な質問ですが、ユーザーがどこに置くかわからなくなる可能性があります。また、「パッティング」アクティビティを実行するボタンの即時性も欠如しています。

5
Mathias Burton

ユーザーのコンテキストを考慮に入れると、最も重要な役割を果たします。

ユーザーがタッチパッドを使用してラップトップで作業している場合、ドロップする前にウィンドウをドラッグするのは困難です。彼はそれをどのくらいの頻度で行うのですか?これで十分でない場合は問題ありませんが、頻度が高い場合は、ウィンドウを含めてタップする方が簡単で、レイアウトは2番目になります。

タブレット/ファブレットでは、ユーザーがアイテムをドラッグするのは簡単なので、ドラッグアンドドロップの方が理にかなっています。通常、大きなアイテムをドラッグするよりも、小さなボタンをタップするときに指で正確に操作することが難しい場合があります。ただし、ゴールデンレイアウトのサンプルでは、​​ボタンと最初のドラッグ項目は同じサイズです。

ブラウザでクリックすることの短所は、ユーザーがインターフェースから受け取るフィードバックです。ゴールデンレイアウトページのこのサンプルでは、​​何かが起こったというフィードバックはありません。レイアウトが突然変更されただけなので、ユーザーは初めて驚いたときにそれを学びます。

ドラッグアンドドロップの短所は、特にオフィスで一日中クリックする場合、アイテムをドロップするのに最適な位置を決定するまで指で圧力をかけることは少し痛いことです。

設計の機会

このドラッグアンドドロップ機能には、2つの状態があります。最初にクリックしてドラッグを開始し、次にマウスボタンを離してドロップしてアクションを適用します。

3つの状態がある場合:

  1. クリックしてドラッグを開始します
  2. オプション:ドラッグアンドドロップが速すぎ(1秒未満)、これが使用したいアイテムであることを指定し、ツールボックスからドラッグしただけです。マウスをクリックしたままの状態を保ちます
  3. 2番目の状態がトリガーされなかった場合にマウスボタンを離すか、クリックしてアクションを適用します。

簡単に言うと、すばやくドラッグアンドドロップするだけです。ドロップする場所である熟考の周りでマウスを動かし、クリックするだけで実際にドロップできるようにします。もちろん、いつでもescボタンを押すか、最初の項目をクリックして現在の状態をキャンセルできます。

マウスボタンを押さずに次の状態になりませんか? golden layout widget

良いデザインで反復ストレス傷害を避けるのはいいことです

私はそれが正しいと思うので、私は不人気なスタンスを取るつもりです。それはあなたがどのようになりたいのか、どちらがより簡単であるかに依存します。ドラッグアンドドロップは、ソースとデスティネーションの両方が表示されていて、手の届くところにある方が簡単です。他のすべてのケースでは、クリックして追加する方が簡単です。したがって、最大の多様性に対応するために、両方に対して計画を立てます。これにより、選択肢が画面に対して大きくなりすぎた場合でも、簡単なままで、難しい滞在が可能になります。

1
hildred