web-dev-qa-db-ja.com

最高の「デフォルトにリセット」UI要素は何ですか?

フォームのフィールドの「デフォルトにリセット」に最適なUI要素は何ですか?

フォームにはデフォルトのテキスト入力があります。使用はデフォルトのテキスト入力を編集でき、ユーザーがデフォルトのテキスト入力に簡単に戻ることができるようにしたいと考えています。

私は3つの解決策を考えることができます:

  1. 「デフォルトにリセット」へのリンク enter image description here
    プロ:リンクは編集がある場合にのみ表示されます。したがって、フォームがよりきれいに見えます。
    Con:デフォルトと簡単に編集を切り替える方法はありません。

  2. デフォルトと編集を切り替えるチェックボックス enter image description here
    デフォルトでは、すべてのチェックボックスが選択されています。ユーザーが編集を行うと、対応するチェックボックスが選択解除されます。
    Pro:ユーザーはデフォルトと簡単に編集を切り替えることができます。
    短所:

    • すべてのフィールドにチェックボックスが表示され、フォームがきれいに見えない場合があります。
    • ユーザーが編集を行うと、対話は予期しないものになります。
    • チェックボックスのチェックを外すとどうなるかは不明です。
  3. トグルを使用してデフォルトと編集を切り替える enter image description here
    上記のチェックボックスソリューションと同様の操作で、ユーザーが編集を行うと、対応するトグルが変化します。
    Pro:それは明らかにバイナリの選択です。
    短所:

    • すべてのフィールドにトグルが表示され、フォームが不鮮明になる可能性があります。
    • 相互作用は予想外です。
    • 切り替え時に何が行われるかは不明です。

上記の3つのソリューションについてどう思いますか?より直感的であれば、他のソリューションを利用できます。

お時間とフィードバックをありがとうございます。

4
Julia

質問:リンク、チェックボックス、またはスイッチ?回答:上記のいずれでもない

通常、ユーザーは ナビゲートするリンク を期待します。つまり、新しい場所に移動します。スイッチとチェックボックスは、属性値または状態、つまり何かが設定されます。これは、アプリがテキストをある特性から別の特性(太字フォントと通常のフォントなど)に単純に切り替えた場合に適していますが、実際にはそうではありません。デフォルトに設定すると、ユーザーが入力した内容が消去され、所定のテキストに置き換えられます。テキストがどのように変化するかだけではありません。それはそれが何であるかを変更します。また、あなたが示唆するように、ユーザー入力が他の場所にあるために、チェックボックスまたはスイッチを独自に変更することは従来とは異なります。

必要なのは、コマンドを作成するものです。他の場所で表されているものを変更するよりも、アクションを実行します。これがコマンドボタン(またはメニュー項目)の仕事です。他のコントロールよりも、コマンドボタンはユーザーに「実質的な何かをしようとしている、おそらく元に戻せない」というシグナルを送ります。ボタンが必要な手がかりは、ボタンがなければ、言い回しを追加する必要があることです。リンクに「デフォルトにリセット」というラベルが付いているか、チェックボックスに「デフォルトを使用」というラベルが付いています。動詞から始める必要があるという事実は、システムがコマンドを実行することを示しています。通常、リンクがシステムがナビゲートする場所の名前(名詞)であり、チェックボックス/スイッチが状態の名前または物が取得する属性(形容詞)であれば、それで十分です。

このボタンは、テキストがデフォルトのテキストで最初に表示されたときに無効になり、ユーザーが文字を変更すると有効になります。フィールドをデフォルトに設定することは破壊的なアクションであるため、ユーザーがデフォルトをクリックすると、アプリがボタンを「元に戻す」に変更することをお勧めします。それをクリックすると、フィールドはユーザーが以前入力したものに戻り、ボタンをデフォルトに戻します。デフォルトのテキストを編集すると、ボタンが「元に戻す」から「デフォルト」に変わります。

乱雑さを気にするのは当然ですが、コマンドボタンには視覚的に「重い」という欠点があります。これにはいくつかの方法があります。

  • 短いラベル。 「デフォルト」というラベルの付いたボタン(ここでは動詞として使用)でおそらく十分なラベルです。ボタンであることはアクションを実行することを意味するため、「デフォルトを使用」または「デフォルトに設定」というラベルを付ける必要はありません。 「リセット」というラベルを付けないでください。これは、ボタンがテキストを以前の状態に変更することを意味します。これは、ユーザーがテキストを2回編集した場合のデフォルトではない可能性があります。

  • 軽量ボタン。フルサイズの23 x 75ピクセルのコマンドボタンである必要はありません。長方形の境界線と中央に配置されたキャプションを持つほぼすべてがコマンドボタンのように見えます。丸みを帯びた角からボーナスポイント。 3-Dの外観を避け、背景に微妙な中間色を与えます。 small pale button next to each text box caption

  • 集中ボタン。すべてのフィールドのボタンが最も理解しやすくなりますが、(2つまたは3つだけではなく)デフォルト設定されている可能性のあるフィールドが多数ある真の最小限の混乱のために、フォーカスのあるフィールドで機能する単一のボタンを検討してください。フィールドをデフォルトにするには、ユーザーは選択したフィールドにカーソルを置き(まだそこにない場合)、ボタンをクリックします。ユーザーがこのフォームの通常のユーザーであるか、トレーニングを受けている場合は、おそらくこれで問題ありません。この「トリック」を知ったら、おそらく覚えているでしょう。このフォームがあまり頻繁に使用されない場合は、追加のテキストを検討してください。 「重量」を抑えるために、ボタンではなくボタンの横にすることができます。 One Default button at bottom of form

1

ユーザーは次のことを知る必要があります。

  1. 特定のフィールドにはデフォルト値があり、フォームとともに保存されます
  2. デフォルト値を編集できます

デフォルトのタイトルと説明がテキストであり、ユーザーがホバーしてその周りに編集フィールドを表示できるようにすると、ユーザーはそのフィールドを編集できることがわかります。最初のインスタンスのテキストとしてそれらを使用すると、送信される値がそれであることを理解できます。ユーザーが入力を開始すると、フィールドの横の「X」により、デフォルト値がクリアされて復元されます。

あなたのタイトルに応じて、エントリがどのように保存されるかはユーザーには明らかです。私のメモ作成アプリの例では、ノート#109は、ノートのようにタイトルを気にする必要がないことを私に言っていますきちんとした一意の識別子があります。

enter image description here

0
Taly Emmanuela

ボタンを使用します。

デフォルトへのリセットは状態がないため、スイッチ、チェックボックス、ラジオボタンにすることはできません。
デフォルトにリセットすることはアクションであり、アクションに最適な要素はボタンです。

フィールドがまだデフォルトの場合にインジケーターが必要な場合は、アクションから分離します。変更されるまで入力フィールドの背景を明るい灰色にし、ボタンが値をリセットしたときに背景を明るい灰色にリセットします。

0
allo