web-dev-qa-db-ja.com

同じ行に数値入力用の8つのフィールドがあるリストに最適なデザイン

ユーザーが15人以上のサッカー選手をリストに追加する必要があるWebアプリケーションを設計しています。各プレーヤーについて、ユーザーは各行の8つの異なるフィールドに値を入力する必要があります。通常、どのフィールドにも値がないすべてのプレーヤーの約50%です。

enter image description here

列(アイコンで置き換えられます)は次のとおりです。

  • 数値:1-99
  • 目標:1-20の目標数
  • アシスト:1-20のゴール数
  • 黄色:1-120分
  • 2番目の黄色:1-120分
  • :1-120分
  • In:1-120分
  • アウト:1-120分

私の質問はこれです:

私の場合、ユーザーが値を入力するための最良の方法は何ですか?キーボード、数値ステッパー...?

ではなく分を入力する必要があることをユーザーにマークする方法(== --- ==)分ゴールを獲得するとき、通常ユーザーが最初に想定することは何ですか?

設計のための他のいくつかの提案?

4
Del boy

入力のためにデータをよりよく構造化すべきだと思います。まず、シーズンごとに変化しないデータ(数、名前)と、すべてのゲームで変化するデータを混在させます。

したがって、最初にこれらの2つを分割して最初にチームを作成します。さらに、チームのカテゴリでは、キーパーやディフェンダーなどが単にキーパーであるかどうかよりも一般的です。

enter image description here

マス番号入力の最初のドラフトとして-合計と最小値を示すラベルを上部に重ねて、最小入力値を広げることができます。

enter image description here

ただし、さらに進んで、入力をさらに分割して、それらのために特殊化された入力を使用することもできます。 ゴール/アシストの場合、かなり効率的な入力を可能にするゴール/アシストの数を示す簡単なトグルが必要です。

enter image description here

次に、Cards/Substitutionsの場合、一度に1人のプレーヤーでデータを入力するか、一度にすべてのカードを入力してからすべてのデータを入力するかによって異なります一度に置換。プレーヤーごとに必要な場合-すべてを1つのタブに配置してください-ユーザーはタブに沿ってタブを付けることができます。カード/代替になりたい場合は、別のタブに配置してください。

2
icc97

データをすばやく入力できるようにするために、Excelスプレッドシートのように、キーボード入力を許可することをお勧めします。 EnterキーまたはTabキーを押すと、次のボックスに進み、ユーザーがキーボードとマウスを切り替える必要性を減らします。ただし、値が入力されたら簡単に変更できるように、[目標]ボックスと[アシスト]ボックスに上/下ボタンを含めることをお勧めします。

質問の2番目の部分については、ボックスにデフォルト値を設定すると、単語の「カウント」または「数値」を入力ボックスまたは列に追加するのと同じように役立ちます。

1
Christy James

ユーザーが値を入力するための「最善の方法」について話しているとき、特に入力するフィールドとラインアイテムが多いときは、さまざまな考慮事項がたくさんあります。答えを提供するのではなく、考慮すべきいくつかの要因を以下に示します。

  • 精度を上げると速度が低下することが多いため、精度または速度を目指していますか?どちらのリスクと損失がアプリケーションにとって何を意味するかを決定し、最良のトレードオフを決定します
  • 情報を一括で入力しますか、それともリアルタイムで入力しますか。データ入力の性質によって速度や精度を向上させることが困難な場合があるため、インターフェース設計の決定を改善するのに役立つプロセスの変更を検討できます。
  • 速度を上げたい場合は、同じタイプのインタラクション(つまり、入力用の同じUI要素)を頻繁に作成してみてください。ただし、データが十分に類似していて、別のUIコンポーネントを使用するときに情報の入力により多くの時間を費やさないようにする必要があります。より速くなります
  • 精度を高めたい場合は、入力オプションを意味のあるものに制限するか、ルールまたは他の依存入力フィールドで入力オプションをフィルタリングして、間違った値を入力する機会を減らしてください。
  • データの性質によっては、エントリをより流暢にするために密接に関連するアイテムをグループ化することも検討できます。そのため、生データが時系列で記録されている場合は、時間を記録してイベントにラベルを付ける方が簡単です(例:25分、ゴール; 30分、ゴールではなくイエローカード、25分;イエローカード30分)
  • ほとんどのプレーヤーが値を持っていない場合(最初のチームにいないか、ゲーム時間がないため)、一度にすべてを表示するのではなく、条件付き入力を使用してより多くのフィールドを開きます(たとえば、最初のチームが選択されたとき、または「イン」フィールドに値があるときに、より多くのフィールドを表示します)
  • 特に、保存して後でエントリを完了するために戻ってくる必要がある場合(プレーヤー名の入力など)は、関連する行(たとえば、再生しなかったプレーヤー)をより速く入力するために、データの行をフィルターまたは並べ替えることができる場合もあります。試合が完了した後、最初に関連情報)
1
Michael Lai