Eine für Smartphones optmierte Version wird in Kürze verfügbar sein
3.0.Komponenten    3.11.Progress Indicator

3.11.Progress Indicator

Fortschrittsanzeigen ermöglichen den Nutzern zu sehen, welche Schritte sie bereits abgeschlossen haben und welche noch anstehen, sowie den aktuellen Bereich, in dem sie sich befinden. Jeder Schritt ist normalerweise so nummeriert oder illustriert, dass der Fortschritt erkennbar ist.

3.0.Komponenten      3.11.Progress Indicator      3.11.1.Nutzung

3.11.1.Nutzung

Fortschrittsbalken

  • Zeigen Sie die Schritte in der Reihenfolge von links nach rechts. Zeigen Sie den Nutzern deutlich, dass sie sich in einem Prozess mit mehreren Schritten befinden, und zeigen Sie die Richtung der Bewegung. Geben Sie dem Nutzer die Möglichkeit, zu einem vorherigen Schritt zurückzukehren, um die von ihm/ihr eingetragenen Daten zu prüfen.
  • Werden die Nutzer über den aktuellen Status innerhalb des Prozesses oder der Aufgabe informiert, schafft dies Sicherheit. Damit wissen die Nutzer, wo sie sich in Relation zu vorher befinden und was noch folgt. Die Fortschrittsanzeige sollte klare Hinweise dazu geben, was der Nutzer mit jedem Schritt erreicht. Diese Hinweise (Labels) sollten sich auf ein bis zwei Worte beschränken.
  • Nutzen Sie das Mittel der Validierung, um den Abschluss eines einzelnen Schrittes zu bestätigen. 

 
Ladeanzeigen

  • Diese Anzeigen informieren die Nutzer, dass die Webseite/App noch Zeit zur Verarbeitung der letzten Nutzeraktion braucht.
  • Daimler verwendet die "Prozent-abgeschlossen-Anzeige". Das ist eine Fortschrittsanzeige, deren Balken sich von 0 % bis 100 % auffüllt und nie zurückgeht.
  • Als Faustregel gilt, dass dieses Element eine Prozent-abgeschlossen-Animation für Prozesse verwenden sollte, die länger als 5 Sekunden dauern.
Some Image
Abbildung

Beispiel für einen Fortschrittsbalken in einem Umfragemodul

    Some Image
    Abbildung

    Beispiel für das Laden von Grafiken