Mikrointeraktionen: Entwerfen mit Details
"Die besten Produkte machen zwei Dinge gut: Funktionen und Details. Funktionen zeichnen die Menschen für Ihr Produkt aus; Details halten sie dort ", sagt Dan Saffer. Die Bedeutung von Details kann nicht überbetont werden. Details sorgen dafür, dass Nutzer eine App oder eine Website lieben oder hassen. Mikrointeraktionen sind diese Details. Sie könnten im globalen Designschema leicht übersehen werden, aber sie halten tatsächlich die gesamte Erfahrung zusammen.
In diesem Artikel werde ich erklären, was eine Mikrointeraktion ist, warum sie wichtig sind und einige großartige Beispiele liefern.
Was ist eine Mikrointeraktion?
Mikrointeraktionen sind subtile Momente, die um eine einzelne Aufgabe zentriert sind. Fast alle Anwendungen um uns herum sind mit Mikrointeraktionen gefüllt.
Das bekannteste Beispiel für eine Mikrointeraktion gab es lange bevor Computer überhaupt erfunden wurden. Der Ein- / Ausschalter ist oft die erste Mikrointeraktion, die Menschen mit einem Produkt begegnen.
Einige andere Beispiele für spezifische Mikrointeraktionen umfassen:
- Die Vibrationsbenachrichtigung wird zusammen mit dem Silent-Modus-Symbol angezeigt, wenn Sie ein iPhone auf Stumm schalten.
- Das Pull-to-Refresh-UI-Muster. Indem der Wunsch des Benutzers, mehr Inhalt zu finden, mit der Aktion des Auffrischens verbunden wird, wird die Erfahrung nahtloser.
Bildnachweis: Ramotion
- Die Schaltfläche "Gefällt mir" in sozialen Netzwerken, die Änderungen mithilfe interaktiver Animationen hervorhebt. Ein solches Feedback informiert die Benutzer, dass sie in der Liste derjenigen sind, denen der Beitrag gefallen hat.
Bildnachweis: Dribbling
Warum sie arbeiten
Kurz gesagt, Mikrointeraktionen verbessern die UX, indem sie die Benutzeroberfläche weniger maschinell und menschlicher machen. Viele Male denken wir über Look & Feel und wie es sich auf Design bezieht. Wenn wir über Mikrointeraktionen nachdenken, stellen sie ziemlich genau fest, wie sich die Nutzer über das Produkt, den Service oder die Marke fühlen. Mikrointeraktionen verfeinern menschzentriertes Design durch:
- Sofortiges Feedback geben - Visuelles Feedback spricht den natürlichen Wunsch des Benutzers nach Bestätigung an. Der Benutzer weiß sofort, dass seine Aktion akzeptiert wurde, und er möchte sich über eine visuelle Belohnung freuen.
- Als Vermittler für die Interaktion wirken - Mikrointeraktionen können Benutzer dazu anregen, tatsächlich zu interagieren. Sie können Benutzern helfen, mit der App zu arbeiten.
- Bringing delight - Mikrointeraktionen sind die perfekte Chance für ein wenig mehr Freude am Design, ohne die Haupterfahrung zu beeinträchtigen.
Zusätzliche Vorteile
Da Mikrointeraktionen kurz sind, müssen sie für eine wiederholte Verwendung ausgelegt sein. Gut gestaltete Mikrointeraktionen können Folgendes erzeugen:
Gewohnheit Schleife
Mikrointeraktionen sind die Schlüsselkomponenten von Gewohnheitsschleifen. Gewohnheiten werden gebildet, wenn Menschen wiederholt dieselben Aktionen ausführen. Typische Gewohnheit Schleife besteht aus drei Elementen:
- Cue - Auslöser, der die Aktion auslöst
- Routine - Als Reaktion auf den Cue führen Sie eine Aktion aus
- Belohnung - Ein Vorteil, den Sie durch das Ausfüllen der Routine erhalten, Grund für den Abschluss der Aktion
Je stärker die Belohnung, desto stärker wird die Angewohnheit.
Die Facebook-Benachrichtigung über eine neue Freundschaftsanfrage ist ein gutes Beispiel für eine Gewohnheitsschleife: Das rote Abzeichen und das weiße Symbol ( Cue ) weisen auf eine neue Anfrage hin, die den Benutzer auf das Symbol ( Routine ) zeigt, um Informationen über die Person ( Belohnung ) zu erhalten. Nach einer Weile klicken Benutzer automatisch auf das Symbol, wenn sie das rote Abzeichen sehen.
Unterschrift Momente
Wenn es gut gemacht wird, können Mikrointeraktionen Signaturmomente sein, die die Kundenloyalität erhöhen. Signature Momente sind Mikrointeraktionen, die erhöht wurden, um Teil der Marke zu sein. Denken Sie an den Like-Button von Facebook. Es wird ein natürlicher Teil der Facebook-Oberfläche. Wenn Facebook diese Funktion plötzlich entfernt, bemerken Nutzer dies und denken, dass die App defekt ist.
Chancen erkennen
Ein Teil der Schönheit von Mikrointeraktionen besteht darin, dass sie an einer Vielzahl von Orten eingesetzt werden können, um jede mögliche Aktion zu ermöglichen. Mikrointeraktionen sind gut für:
Änderungen hervorheben
Mikrointeraktionen können die Aufmerksamkeit des Benutzers lenken . In vielen Fällen werden Animationen verwendet, um die Aufmerksamkeit des Benutzers auf wichtige Details (dh Benachrichtigungen) zu lenken.
Bildnachweis: Dribbling
Minimierung des Benutzeraufwands
Autocomplete ist ein gutes Beispiel für Mikrointeraktion. Das Schreiben hat hohe Interaktionskosten; Es ist fehleranfällig und zeitaufwendig, selbst mit einer vollständigen Tastatur (und noch mehr auf einem Touchscreen). Autocomplete hilft dem Benutzer, die richtige Antwort schneller und ohne Tippfehler zu liefern. Während Sie jeden Buchstaben eingeben, wird das System seine besten Vermutungen bezüglich der Wörter machen, die Sie suchen.
Feedback geben, um zu zeigen, was erreicht wurde
Mikrointeraktionen können die Aktionen verstärken, die ein Benutzer ausführt. Indem Sie dem Prinzip " Zeigen, nicht erzählen" folgen , können Sie animiertes Feedback verwenden, um zu zeigen, was erreicht wurde. Im Beispiel von Stripe Wenn der Nutzer auf "Bezahlen" klickt, wird kurz ein Drehfeld angezeigt, bevor die App den Erfolgsstatus anzeigt. Durch die Häkchenanimation fühlt sich der Benutzer so an, als hätte er die Zahlung leicht gemacht, und die Benutzer schätzen solche wichtigen Details.
Stellen Sie Statusinformationen bereit
Das erste usability-heuristische Prinzip von Jakob Nielsen besagt: Das System sollte die Benutzer immer über das Geschehen auf dem Laufenden halten. Typisierungsindikator im Chat ist ein großartiges Beispiel für Mikrointeraktionen, die Statusinformationen bereitstellen. Es erscheint auf dem Bildschirm deines Freundes, während du eine Nachricht im Chat verfasst.
Bildnachweis: Dribbling
Benutzerdaten validieren
Einer der wichtigsten und oft übersehenen Aspekte des Formularentwurfs ist die Fehlerbehandlung . Es liegt jedoch in der menschlichen Natur, Fehler zu machen, und Ihre Form ist wahrscheinlich nicht von menschlichen Fehlern befreit. Benutzer mögen es nicht, wenn sie ein Formular ausfüllen, nur um bei der Einreichung herauszufinden, dass sie einen Fehler gemacht haben. Hier spielt die Validierungsmikrointeraktion in einer benutzerfreundlichen Form eine Rolle. Echtzeit-Inline-Validierung informiert Benutzer sofort über die Richtigkeit der bereitgestellten Daten. Mit diesem Ansatz können Benutzer die Fehler schneller korrigieren, ohne warten zu müssen, bis sie auf die Senden-Schaltfläche drücken, um die Fehler zu sehen. Wenn es richtig gemacht wird, kann es eine mehrdeutige Interaktion in eine klare verwandeln.
Fazit
Design ist im Detail. Selbst kleine Details verdienen Aufmerksamkeit, denn all diese kleinen Momente machen das Gefühl aus, sie vereinen sich zu einem schönen ganzheitlichen Produkt.
"Der Unterschied zwischen Produkten, die wir lieben und denen, die wir einfach tolerieren, sind oft die Mikrointeraktionen, die wir mit ihnen haben." - Dan Saffer
Wenn Sie Wert auf Benutzerfreundlichkeit legen, müssen Sie sich um Mikrointeraktionen kümmern. Weil Ihr Produkt nur so gut ist wie die kleinste Mikrointeraktion, die Menschen damit haben.