web-dev-qa-db-ja.com

複数のアクションを実行するボタンのベストプラクティス

このシナリオを考えてみましょう:

Connect」ボタン。クリックすると「Cancel」ボタンに変わります。接続が成功すると、「Disconnect」ボタンに変わります。

これを3つの異なるボタン(表示/非表示にする)で処理する必要がありますか、それとも1つのボタンで処理する必要がありますか(buttontext/tagも確認して、接続/キャンセル/切断-実行するアクションを確認してください)。

12
DTI-Matt

おそらく、3つの別々のボタンを使用することを選択します。これにより、接続のさまざまなステータスの状態を処理する1つのボタンのクリックメソッドを散らかす必要がなくなります。

一方、ボタンが1つしかない場合は、コントロールを1つだけにし、必要に応じてテキストを変更し、必要に応じてswitchステートメントにロジックをスタックできます。

アプリケーションが他の誰かに触れられるものである場合、私は間違いなく個別のボタンを使用しますが、それがあなたのペットプロジェクトであり、その特異性を処理できる場合は、単一ボタンのシナリオを使用します。

5
Darth Continent

あなたのケースでは、すべてのボタンが相互に依存していて同時に有効にできないため、1つのボタンが最適に機能すると思います。

ベストプラクティスは、ボタンのテキストの変更をユーザーに示すことです。これを確認したところはどこでも、ボタンからテキストを削除し、それを明るい色合いに変え、ボタンに2番目のテキストを表示してから、ボタンを暗い色合いに戻します。マウスオーバーがボタンの上にあるため、この色合いのわずかな変化がわかります。 (ボタンをクリックするとすぐにボタンのテキストが変更されるため)。これは、実際に見たところどこでも、実際にはかなりうまく機能することがわかりました。

2
user22624

これは、Firefoxが「更新」を「接続」、「停止」を「キャンセル」として実行していることです。彼らは1つのボタンに2つのものを持っています。ただし、接続中は、接続中であることを示すスピナーのような何らかの手掛かりが必要です。ボタンがcancelに変更されたことをユーザーに知らせるため、現在接続中です。そして、接続が完了すると、cancelからdisconnectに変更されます。

スピナーは、ボタンの変化によってもたらされる突然の効果を滑らかにする上で非常に重要です。これは、ボタンが別のボタンに変化した理由を説明する唯一のものであるためです。 。

2
Andy

私はボタンが1つのソリューションを好むでしょう。同じ場所にある3つのボタンを維持するのは不必要に複雑です。 2つが灰色になっている3つのボタンは、ユーザーを混乱させます。 Textプロパティを変更する場合、Tagプロパティは必要ありません。テキストを変更して確認するだけです。

それは好みの問題かもしれませんが、私の経験から、できるだけ少ないコントロールを持っている方が良いです。 3つのボタンがあり、そのうちの1つだけが有効になっている場合、余分な情報が表示されます。ユーザーが別の状態で潜在的に何ができるかをユーザーに伝える/示すためのポイントは何ですか?彼は二度とその状態に入ることはないかもしれないし、それを完全に認識しているかもしれない。アインシュタインのモットーに従って、すべてを可能な限りシンプルにする必要がありますが、シンプルにする必要はありません。

1
Axel Kemper

このシナリオのように、3つのボタンはすべて同じタイプのアクションに関連しているため、ステータス依存のボタンテキストを使用しても問題はありません。

それは、ユーザーがボタンに何を操作するかについての手掛かりを与える何か、つまりConnectionを使用してボタンにラベルを付けるのに役立ち、ボタンは接続に適用できるアクションを提供します。

さらに、ボタンの動作の変化を何らかの形でユーザーに知らせることができます。これは、ボタンをフェードアウトしてから別のテキストでフェードインしたり、テキストが変更されているときにボタンをハイライト表示したり、ボタンの機能が変更されたことをユーザーに認識させることができます。

同じタイプのアプローチは、データとmanipulateへのボタンがあるフォームでも機能し、クリックするとsaveボタンに変わります。全体として、このメソッドは実際に[〜#〜] ui [〜#〜]を整理することができますが、物事を理解不能にしないように注意する必要があります。

1
kontur

これは、間違いなく3つの異なるボタンでなければなりません。ウィザードのように、ボタンを表示する必要があるときにボタンを表示したいだけです。

それらを1つのボタンにすると、if (this.button.Text == "Connect")のようなステートメントを使用するか、switchを使用することもできますが、どちらも適切ではありません。

1つのボタンを作成すると、保守性が失われますand安定性。

0
Mike Perrenoud

1つのボタンなのか、2つのボタンが非表示になっている3つのボタンなのかは、ユーザーエクスペリエンスには関係ありません。 Darthの説明 のように、主にpro/consのプログラミングの問題です。

私はより良い質問だと思います:複数のアクションを実行する1つのボタンが必要な場合、ユーザーエクスペリエンスを確実に向上させるにはどうすればよいですか?

その答えは、各アクションがユーザーに明確に、おそらくは色とアイコンで示されていること、およびユーザーがダブルクリックして2つの異なるアクションを実行しないようにするための予防策があることだと思います。おそらく、ユーザーがアクションをクリックすると、ボタンは少なくとも1秒間スピナーに切り替わります。その間、ボタンは再度クリックできません。次に、次の状態に切り替わり、別のアクションを実行できます。

2つのアクションがある場合は、なんらかのスライドトグルボタンを使用できます。

0
Luke