15

これは、何年にもわたって何度も何度も再発明されたホイールです。

問題：ユーザーは日付/時刻を入力する必要があります

基本的な考慮事項

  • ユーザーが希望の日時をできるだけ簡単に入力できるようにしたい
  • 一部のアプリケーションは過去の日付を要求し、一部のアプリケーションは将来の日付のみを要求し、一部は両方を処理する必要があります
  • ユーザーがぎこちないデータを入力しないようにしたい
  • このコントロールをできるだけ積極的に自動入力したいと思います。
  • このコントロールを可能な限り再利用できるようにする必要があります。

人気のあるソリューションは次のとおりです。

  • テキストボックス
  • コンボボックス
  • ポップアウトカレンダー
  • サーバー側および/またはクライアント側の検証
  • 不良データについてユーザーに警告するさまざまな方法

すぐに食べられるソリューションはたくさんありますが、もっと一般的な情報を探しています。さまざまな日時管理アプローチについて行われたユーザビリティ調査はありますか？そこに「最良の」日時管理はありますか？確立された「すべきこととすべきでないこと」はありますか？

関連する質問：時間範囲を説明するのに最適なGUIコントロール

4

12 に答える 12

14

私の好みは、横に省略記号ボタンがあるテキスト入力です。

Enter a date [        ] [...]

省略記号はカレンダーをポップアップしてテキスト入力を取り込みますが、ユーザーは必要に応じて日付を入力できます。フォームの「OK」ボタンが押されたときに検証を行う必要があります-私の経験では、文字ごとに日付の検証を行うことは運命づけられています。

検証は洗練されていて、次のような式を許可する必要があります

"today"
"Tomorrow"
"23 Jan"

等

編集:いくつかのコメントへの返信として、テキスト編集がフォーカスを失ったときに検証を行うことができます (私はそのようなことは嫌いですが)。表現が理解できたこと。

于 2009-02-23T21:17:18.480 に答える
12

マウスで日付を選択するカレンダーをください。キーボードで日付を入力してみましょう。できるだけ多くの形式を受け入れます。2012 年 12 月 21 日を入力する必要がある場合は、次を使用します。

  • 2012 年 12 月 21 日
  • 2012年12月21日
  • 2012 年 12 月 21 日
  • 2012 年 12 月 21 日 (または 2012 年 12 月 21 日、ソフトウェアを使用している国に応じて、いずれかを選択)
  • 12212012 (上記と同じ括弧内のフラグメント)
  • 等。

ローカリゼーションの問題を解決するために何をしようと決めたとしても、それが何を期待しているのかが明確であることを確認してください。例、またはMMDDYYYY入力できるテンプレートを教えてください。

特に何年もの間、スクロールしなければならないプルダウンボックスを私に与えないでください。私が年を取り、生年月日を入力している場合、プルダウンボックスの一番下までスクロールするのに十分な時間が残っていません。プルダウン ボックスは、オプションがわからない場合に使用するのに適したパターンですが、生年月日など、非常によく知っているものである場合、プルダウン メニューは面倒です。

さて、WRT 時間の入力 (ビッグペットピーブ) ですが、私が午前 3 時を意味しているとは思わないでください。時刻に 3 を入力した場合、午後 3 時を意味していると仮定します。午前 3 時に何かをスケジュールするために余分な仕事をさせてください。私に代わってそんなに多くのことを想定することに抵抗がある場合は、少なくとも午前 3 時に何かを予定していることを知らせてください。そうすれば、私のイベント招待リストの誰かがメールで「ばか、あなた。 D&D ミートアップを午前 3 時にスケジュールしました!」

于 2009-02-23T21:49:05.033 に答える
4

Googleカレンダーの日付範囲のエントリはかなり良いと思います。キーボードまたはマウスで入力できます。唯一の問題は、別の年の日付を入力することです。

キーボードを使用して簡単に行うことができますが、マウスを使用して1年ずつ前後にジャンプできるように、カレンダーに2番目の小さな矢印のセットが必要です。

日付入力の例

時間入力の例

編集：「火曜日の午後11時から水曜日の午前1時までのイベント（たとえば、デイリービルド）をスケジュールしたい場合はどうしますか？深夜に時間をどのようにラップしますか？」

「to」の時刻が深夜を超えた場合は、「to」の日付を翌日にロールします。これは、コンポーネントのビジネスロジックの一部にすぎません。上の2番目の画像でわかるように、ドロップダウンにはイベントの終了時間と期間の両方が表示されます。これはヒントになるはずです。

代替テキスト

終了日を開始日より前に設定しようとすると、フィールドの背景色を強調表示したり、保存時にエラーメッセージを表示したりできます。

代替テキスト

Googleカレンダーで遊んで、その動作を確認してください。

于 2009-02-23T22:51:10.657 に答える
2

横にポップアウトカレンダーへの画像リンクがあるテキストボックスが私の選択です. 両方の長所。

何か特別なものが必要な場合は、Chronic http://chronic.rubyforge.org/のような自然言語の日付/時刻パーサーにスパイスを加えることができます。

また、国際ユーザーも忘れないでください。

于 2009-02-23T21:12:56.993 に答える
2

カレンダー コントロールをクリックするのではなく入力することを好むユーザーにも許可することをお勧めします。そのため、テキスト ボックスとポップアップ カレンダーの組み合わせがうまく機能します。

そのような組み合わせでカスタム コントロールを作成しました。ユーザーは、テキスト ボックスにさまざまな形式で日付を入力するか、ボタンをクリックしてカレンダーをポップアップ表示できます。

"today"、"wed"、または "+2" (明後日) などのあらゆる種類の入力を許可し、ほとんどの検証クライアント側で正規表現を使用します。もちろん、サーバー側の検証も行います。

コントロールには、プロパティによって有効または非表示にできる時間用のオプションのテキスト ボックスもあります。日付と時刻を分離する方が簡単だと感じました。時間については、「午後 9 時」、「2100」、「09:00」などを使用できます。

コントロールは最小および最大の日付に対応しているため、生年月日はたとえば -100 年から現在の年までの範囲を持つことができ、クレジット カードの有効期限は今年から +5 年までの範囲になる可能性があるため、範囲バリデータを使用します。

于 2009-02-23T21:24:55.573 に答える
1

コンボボックス/リストボックスオプションを使用する場合は、月が「1」、「2」...「12」ではなく「1月」、「2月」...「12月」となるようにしてください。 .
値の範囲に応じて、どのスロットが月で、どのスロットが日であるかを把握するのはかなり面倒です。

于 2009-02-23T21:58:06.133 に答える
0

状況に応じて、次の 3 つの選択肢を使用します。

  1. コンボボックス2個。1 つの上場年 + 月、別の上場日
  2. 3つのコンボボックス。1 つのリスト年、1 か月、1 日
  3. 目に見えるカレンダーとYUI からのこのようなコンボ

そして、私が選択できる選択肢は他にもあると思います。

于 2009-02-23T21:28:12.743 に答える
0

UI 要件を確認する必要があります。スクリプト対応のサポートのみが必要な場合は、スクリプトのパノポリのいずれかを使用して、隠しフィールドに提供される日付/時刻形式で実行できます。

ただし、テキスト ボックスにユーザー エントリが必要な場合は、いくつかの決定に直面します。

  • 日付/時刻の形式は厳密ですか? たとえば、mm/dd/yyy hh:mm:ss 形式のみですか?
  • それとも、「今日」、「明日」、「1 月 23 日」のスタイル エントリを許可するために大まかに定義されていますか?
  • 形式はロケール固有になりますか? 例: mm/dd/yyyy 対 dd/mm/yyyy

検証方法は、要件に関する決定によって異なります。

jQuery 日付ピッカープラグインが気に入っています。特定の形式での出力が可能になります。

于 2009-02-23T21:28:13.977 に答える
0

複数の月を連続して表示するカレンダー: http://www.cs.helsinki.fi/u/salaakso/patterns/Calendar-Strip.html

于 2009-02-23T21:40:30.997 に答える
0

この点で、Google カレンダーは使いやすいといつも思っています。それをエミュレートしようとするよりも、確かに悪いことをする可能性があります。重要なのは、ユーザーが情報を入力する方法に多くの柔軟性を与えることです。たとえば、ドロップダウン リストから時刻を選択するか、手動で入力することができます。また、入力するときにコロンや「pm」に「m」を含める必要はありません。

于 2009-02-23T21:42:24.237 に答える
0

QT4 の Date/Time ウィジェットの動作がとても気に入っています。

  • 日付を手動で入力できます (一般的な形式で日付を入力します)。
  • スクロール ホイールを使用して、日付/時刻フィールドをすばやく変更できます。
  • 月のドロップダウンと前後の矢印がある拡張可能なカレンダーがあります。特定の日をクリックして年を手動で入力するか、コンボ ボックスを使用して入力できます (ここでもスクロール ホイールが機能します)。

ウィジェットの仕組みとその機能の一部を示す短いビデオ(~7.5MB) を次に示します。

洗練されたアプリケーションには、これらの機能の一部またはすべてが備わっていると思います。

相対的な日付 (今日、先週、3 日前) を入力できるのは便利ですが、「あなたの生年月日は?」や「いつですか? Xがあなたに電子メールを送ったように？」.

于 2009-02-23T22:23:53.187 に答える