it-swarm.com.de

Natürliche Benutzeroberfläche: Der beste Weg, um einen Zeitbereich anzuzeigen und mit ihm zu interagieren

Ich habe einen Zeitbereichsfilter (für eine Web-App, einen Desktop und ein Handy), der folgendermaßen aussieht:

time range filter

In diesem Fall ist die Zeit nicht relativ zum Benutzer in Bezug auf die Anzahl der Tage (vor 7 Tagen), sondern berücksichtigt die tatsächlichen Kalenderabteilungen (diese Woche bedeutet von diesem Montag bis zu dem Tag, an dem ich bin, diese Monate bedeutet von der 1).

Ich bin ziemlich zuversichtlich in Bezug auf die Klassifizierung (heute, gestern, diese Woche ...), aber ich habe zwei Probleme:

1) Was passiert, wenn ich an einem Montag bin? Ist "gestern" eine gültige Option? Sollte es verschwinden und einfach "letzte Woche" gehen? (Hört sich schlecht an, wenn UX Elemente im Menü hat, die sich von einem Tag zum anderen ändern.).

2) Ich möchte, dass der Hover-Status des Menüs die vorherigen Daten enthält. Wenn Sie beispielsweise mit der Maus über "Letzter Monat" fahren, sollte für alle vorherigen Kategorien ein anderer Hintergrund angezeigt werden. Ist das bei der Struktur sinnvoll? Was passiert auch, wenn Sie sich am ersten Tag des Monats befinden und Ihre aktuelle Kategorie tatsächlich "gestern" ausschließt?

7
Yisela

Ich empfehle nicht, "enthaltene" Auswahlmöglichkeiten hervorzuheben. Es ist eine interessante Idee, aber die Edge-Fälle (in denen der vorherige Tag, die vorherige Woche oder was auch immer teilweise oder mehrdeutig in der ausgewählten Auswahl enthalten sind) würden sie verwirrend und nicht klarstellend machen. Wenn der Effekt niemandem etwas sagt, das er nicht leicht erkennen kann, hat er keinen wirklichen Zweck.

Sie können deaktivieren, wenn in einem bestimmten Datumsbereich keine Elemente angezeigt werden sollen. Erklären Sie in einem Tooltip, warum es deaktiviert ist (Keine Elemente gestern geplant). Dies löst jedoch nicht ein anderes Problem der Mehrdeutigkeit von "Diese Woche" und "Letzte Woche" über das Wochenende. Für dieses Problem müssen Sie die Daten anzeigen, die von der ausgewählten Auswahl abgedeckt werden:

mockup

bmml source herunterladen - Wireframes erstellt mit Balsamiq Mockups

Wenn der Benutzer mit der Maus über eine bestimmte Auswahl fährt, wird der auszuwählende Datumsbereich rechts in ausgeblendetem Text angezeigt. In diesem Bild würde die Maus auf "Diese Woche" zeigen. Wenn es auf Gestern zeigte, würde dort der Hinweis angezeigt, dass am Sonntag keine Artikel geplant sind. Beispiele für die obige Liste:

  • Montag, 30. April
  • Keine Einträge Sonntag
  • 30. April - 4. Mai
  • 23. April - 27. April
  • 2. April - 30. April
  • 1. März - 30. März

Sie klären alle Unklarheiten, während Sie eine größtenteils saubere Oberfläche haben. Wo genau Sie den Hover-Text platzieren, hängt am besten von den Layoutanforderungen Ihrer Benutzeroberfläche ab. Eine Stelle direkt neben dem Menü sollte in Ordnung sein.

8
Myrddin Emrys