Es gibt Ladezustände, um dem Benutzer eine Frage zu beantworten: Passiert etwas? Ohne eine Antwort tippen die Leute erneut, laden die Seite neu oder verlassen sie. Die richtige Antwort hängt davon ab, wie lange sie warten.
Bei sehr kurzen Wartezeiten, weniger als etwa einer Zehntelsekunde, bemerken die meisten Menschen keine Verzögerung, sodass ein Indikator nur ein Flackern hinzufügt. Eine gängige Technik besteht darin, kurz zu warten, bevor ein Spinner angezeigt wird, sodass bei schnellen Antworten überhaupt kein Spinner angezeigt wird.
Zeigen Sie bei Wartezeiten von einer oder mehreren Sekunden Feedback an, wo das Ergebnis angezeigt wird. Ein Skelettbildschirm, ein grauer Umriss des kommenden Layouts, eignet sich gut für Listen, Karten und Profile, da er anzeigt, was kommt, und Layoutverschiebungen reduziert. Ein Spinner eignet sich für kleine Bereiche oder wenn das Ergebnis keine vorhersehbare Form hat.
Zeigen Sie bei langen Aufgaben wie Uploads, Exporten oder KI-Generierung echten Fortschritt, wenn Sie ihn messen, erklären können, was passiert, und es den Leuten ermöglichen, andere Arbeiten abzubrechen oder fortzusetzen. Ein Spinner, der sich eine Minute lang ohne weitere Informationen dreht, fühlt sich wie ein Versager an.
Das Steuerelement, das die Aktion gestartet hat, benötigt ebenfalls einen Status. Eine Absenden-Schaltfläche, die in den Ladezustand wechselt und nicht zweimal gedrückt werden kann, verhindert doppelte Bestellungen und Nachrichten. Wenn der Ladevorgang beendet ist, gehen Sie klar zu Erfolg oder Fehler über, anstatt stillschweigend zur Standardeinstellung zurückzukehren.
Animation hilft hier, aber halten Sie sie ruhig und kurz in einer Schleife und respektieren Sie die bewegungsreduzierte Einstellung. Mit dem von uns erstellten ExodeUI können Sie einen Loader oder eine Schaltfläche mit Lade-, Erfolgs- und Fehlerzuständen in einer Datei entwerfen, zwischen denen Ihr Code wechselt.