web-dev-qa-db-ja.com

週をテキストとして表示する直感的な方法はありますか?

特定の週に基づいて、一連のデータが表示されるアプリケーションに取り組んでいます。ユーザーは今週をドロップダウンボックスから選択します。私の目標の1つは、これらの週オプションがこのドロップダウンボックスに表示される方法をフォーマットすることです。ドロップダウンは一定の要件です。私はそのリストに週が表示される方法のみをフォーマットしています。

At present, the drop down displays a list of options, all labelled "2017-07-06"; but these are just placeholders.

私は過去にいくつかのHCI調査を行いました。週は「<start> to <finish>」の形式で表示する必要があると確信しています。たとえば、現在のプレースホルダーは「2017-07-06」と表示され、「2017-07-06から2017-07-13」に変更します。週は常にSundayから始まりますが、これまでのところ、それは無関係に見えます。これが最善の方法であるかどうか、具体的には、週をテキストとして直感的に表示するための効果的な解決策があるかどうかはわかりません。 daysについて有効な情報をいくつか見つけましたが、週全体を表示するための何もありません

私は純粋にオーストラリアのユーザー向けに設計していますが、これはday monthの形式にのみ影響を与えるはずであり、月日。 ISO標準を満たす必要はありません。したがって、必ずしも厳密な数値形式を使用する必要はありません。

週をテキストとして表示する特に直感的な方法はありますか、それとも主観的な問題ですか?

8
Gnemlock

ああソクラテスは私が描いている間に答えたので、同じことを示唆しているのでテキストのものは無視してください。もう1つのタイプは、カーソルを置く線の週を選択するようにプログラムされたカレンダーコントロールです。

ソクラテスは正解です。さまざまなタイプのユーザーをテストして、ユーザーにとって何が有効かを調べる必要があります。

Week Selector

10
DarrylGodden

問題は少し主観的であり、ユーザーが正しいアイデアを得られるようにテストする必要があります。

これらのUI要素のコンテキストを維持することとは別に、ユーザーが1週間全体を選択していることを明確に示すテキストを用意します。

私が試すことをお勧めする解決策は次のようになります:

週が始まる日の名前を完全に書き(あなたと私はそれが日曜日であることを知っていますが、リマインダーは決して痛くない)、その横にその年の何週目かを書きます。これは、ユーザーに表示されているものが1週間であることをさらに示す可能性があります。

いくつかの例:

  • 2017-07-09(28週目)
  • 07/09-07/15(28週)
  • 7月9日〜7月15日(28週)
  • 日曜日、09/09-土曜日、07/15

最後の2つの例では、私が想像する週番号を省略できる可能性があります。

また、日付ピッカーで年を本当に言及する必要がありますか?日付はどこまでですか?

年の下に日付を段階的に(つまり、最初に年を選択するように)表示し、その年に関連付けられているすべての日付を表示する方が良いでしょうか?

私がユーザーとして個人的に持っている、調査する価値があるかもしれないいくつかの質問。

いつものように、思いついたさまざまなメソッドをテストし、より具体的にはロケールをテストします。オーストラリアがこのように予定を立てる決まった方法がまだないのですか?地元や政府のウェブサイトをチェックして、アイデアを得てください。

PSあなたのシステムが使用している逆の日付は、ヨーロッパ人として私にとってすでにかなり混乱していることに注意してください。最初はこれが6月なのか7月なのかわからなかった:P

8
Socrates Kolios

有名なホテルの予約サイトのバックエンドについても同様のことを行いました(公開できないので、画像がなくて申し訳ありません)。

前後関係と説明:調査の結果、特定の期間に非常に一般的な行動があったことがわかりました。つまり、週末、休日、季節、月の週。バックエンドユーザーは、日付を使用する代わりにこれらの期間に条件を一括適用する必要があったため、これらの所定の期間で一括変更を許可しました。したがって、管理ユーザーは「夏の第2週すべて」を選択して、ワンクリックでデータを大量に適用できます。

以上のことから、期間を特定する方法を見つける必要がありました。この質問で興味深いのはweekです。

だから私がしたことは単にweek 1week 2week 3。これを行った直後、私はこのアプローチでいくつかの明らかな問題を見つけました:

  • その月の最初の日が日曜日である場合にのみ機能します。これは明らかに翌月には起こりません。
  • 上記を考慮しても、孤児の日はどうなりますか? (この場合、29日、30日、31日)
  • 孤児の日を(たとえば)week 5、残りの曜日はどうなりますか?

だから私がしたことは次のように上記の問題を検討することです:

  • 月の最初の週は常に日曜日に始まります
  • その月の最初の週は、その特定の月の日付を持つ最初の日曜日になります
  • 前月から1週間(5th week)は翌月からの日数を必要とし、翌月の最初の日曜日まで日の進行を続けて追加されます。例えば: Week 5 of month: Wed 28, Thu 29, Fri 30, Sat 1 // Week 1 of following month: Sun 2, Mon 3, Tue 4.....これは通常5th week 7日ありません
  • Fifth weeksは不完全な週になるはずです

このように、ユーザーは数回のクリックですばやく変更できるいくつかの仮想期間(または仮想ブロック)を定義できます。年以内に。

さらに、異なる仮想ブロックにまたがる予約の問題がありますが、まったく役に立たないため、拡張しません。

実装

上記を念頭に置いて、タイムラインインターフェイスを作成しました。繰り返しますが、私たちは何をしたかを示すことができないので、以下の例のようなものを考えてください:

enter image description here

この例との違いは、ユーザーがビューをフィルタリングして、さまざまなレベルの細分度(カレンダー:年、月、日など)を表示したり、前述のように仮想ブロック(weeksを使用したりできることですが、他にもありました)。

それから私はあなたにとって重要なことを解決しなければなりませんでした:ラベル付け。上記の問題により、これは最も重要なことでした。私が選択したのは、ブロックにweek [n]、開始日と終了日。例えば:

**Week 2:** Jul 23 - Jul 29

月の呼び出しに数字を使用しなかったことに注意してくださいではなく、月の省略形(言語設定に基づいて動的に変化します)。

それがあなたの質問への答えとその背後にある理由です!

いくつかの考慮事項

これに注意してください:

  • 月の最初の日曜日を使用する代わりに、月の最初の日アプローチ、それは同じように動作します
  • これをタイムラインインターフェース(図のように)、カレンダービュー、checkboxベースのフィルターに適用しました。 dropdownsを使用する場合は、追加の考慮事項が必要になると思います
  • 上記のすべてが述べられているので、[〜#〜] [〜#〜]をこのように適用する理由を2度考えてみてください。シナリオで数週間を仮想ブロックと見なさない場合は、time picker
1
Devin