web-dev-qa-db-ja.com

期間にルールを柔軟に適用するためのインターフェースを簡素化する

アプリケーションにモジュールがあり、ユーザーがさまざまな基準の期間を定義して、後でいくつかのリストをフィルタリングするために使用します。

デフォルトでは、各基準がいつでも適用されます。適用される期間を制限することと、除外期間を追加することの両方によって、その有効性を制限できます。適用および除外の定義済み期間は編集または削除できます。

現在のインターフェースは次のとおりです。

mockup

download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム

ユーザーは、「アプリケーション」と「除外」の期間のロジックを理解するのが難しいと感じています。既存の可能性をすべて維持しながら、インターフェースを簡素化する解決策が見つかりません。

ここでユーザーエクスペリエンスを向上させるために何ができますか？

usabilitygui-designtimesimplicity
17
Yannick Blondeau

制限時間と免除時間を設定しているので、視覚的に表示してみてください。各基準が追加されると、タイムラインが更新されます。

私はあなたのユースケースを完全に理解しているとは思いませんが、ユーザーは制限と例外の結果を明確に見る必要があるようです。フィードバックとして結果を見る方法に少し焦点を当てています。

日付（および比例配分）を読み取って計算するように強制すると、作業負荷が増えるようです。また、各基準の期間も調べる必要がある場合もあります。

基準を追加するときにそれらを表示するのに役立つ視覚化がありますか？

ヒートマップの例：

Githubは、1年分のデータを表示する例です。一目でアクティビティの期間を確認できます。

enter image description here

読まないでください。タンデムでビジュアルを提供します。

別の状態がある場合（私はこれについてあまり明確ではありません）：無制限および未宣言の時間、ヒートマップはこれらのギャップも表示できます。

enter image description here

35
Mike M

私はあなたのニーズを誤解していないことを願っていますが、私の推奨は例外/除外期間を排除することです。彼らは単に「制限」の期間（基準は適用されません）でデフォルト（基準*が適用されます）を回復するだけなのでです。直感的には（3番目の例のように）「基準は夏休みを除いてすべての年に適用する必要があります」と言うのがより簡単に見えるかもしれませんが、それを言うには2行必要であり、（同じスペースで）精神体操なし）：Applies from 2019-01-01 to 2019-07-13 Applies from 2019-08-16 to 2019-12-31

例外をより簡単に挿入できるようにするには、現在の行を2倍にするsplit（または同様の名前の）ボタン（editとdeleteに加えて）をお勧めしますそして、最初のラインの開始と2番目のラインの終了を元のラインの開始と終了で事前に埋めます。これを視覚化するのに役立つ色分けされたカレンダー（他の回答で提案されているように）は確かに役立ちますが、厳密には必須ではありません。

ちなみに、例の基準1は単にApplies from -infinity to infinityと同等です。

*） "Criteria"は、 " criterion "（標準または特性）または "criterium"（）のpluralです。自転車レース）。

8
Thomas

ルールの重複

[〜＃〜] ask [〜＃〜]を誤解した場合は申し訳ありませんが、これは[〜＃〜]および[〜＃〜]＆[〜＃〜]または[〜＃〜]操作（種類：P）。

  1. ユーザーがルールを追加（期間を設定）、つまりアプリケーション
  2. ユーザーは、上記のルールの上に別のルールを追加できます。つまり、例外で、設定した期間と重複する場合と重複しない場合があります。

アプリケーションと例外は作成時にメンタルマップに密接に関連しているため、個別の階層を与えるのではなく、親子関係を持っている必要があります。

私の提案

ZapierがAND/OR演算を視覚化する方法が大好きです。 

上記の設計に近いと、インターフェイスは次のようになります enter image description here

4
tridip1931

下部にアクションボタンを配置する代わりに、各セクションに「追加」ボタンを配置します。

Applies:
From 2019-01-01 to 2019-12-31    edit   delete

+ Add

Except:
From 2019-07-14 to 2019-08-15    edit   delete

+ Add
3
Stacy H

通常、コピー言語を単純化すると役立ちます（ "有効な時間範囲を追加"＆ "特定の日付をブロックする"など）。

2番目のオプションは、次のロジックに従って、緑（制限時間の場合）や赤（例外時間の場合）などの色を追加することです。

緑=>移動、赤=>停止

3番目のオプションは、アイコンを追加することです（+は追加、-は制限）。

3つすべてを一緒に実行すると、より多くのユーザーのロジック（つまり、グラフィック指向とリーダー）を確実にカバーできますユーザーを子供と話しているように考えてみてください;）これは常に私に役立ちます！

2
Andrea Maillard

問題は、ルールを提示しているが、結果を提示していないことです。

リトマステストとして、質問に答えてみてください。基準は3月23日に適用されますか？

の代わりに：

Applies from 2019-01-01 to 2019-12-31

Except from 2019-07-14 to 2019-08-15

次の表示は、特に例外が山積しているため、簡単に推論できます。

Applies from 2019-01-01 to 2019-07-13
Applies from 2019-08-16 to 2019-12-31

これをより視覚的にすることも役立つでしょう。カレンダーは非常に役に立ちます。特にクリックしてオン/オフを切り替えたり、Shiftキーを押しながらクリックしたり、Ctrlキーを押しながらクリックして一括選択/選択解除したりします。

スペースが限られている場合は、テキストを使用しても、ユーザーに役立つ情報を追加できます。

Applies from 2019-01-01 to 2019-07-13 (x days)
       -- y days later --
Applies from 2019-08-16 to 2019-12-31 (z days)

この大きさのチェックは、ユーザーがタイプミスを識別するのに役立ちます。

1
Matthieu M.