So entwerfen Sie One-Tap-Mikrointeraktionen
Mikrointeraktionen sind die „geheime Sauce“, die Apps und Websites für Benutzer zum Leuchten bringt. Diese winzigen Details machen es einfach, einen Alarm einzustellen, einen Knopf zu drücken oder einfach besser zu verstehen, wie man mit einem digitalen Produkt arbeitet.
Das Geheimnis ist, dass die besten Mikrointeraktionen Elemente sind, an die der Benutzer wahrscheinlich nicht einmal denkt. Sie passieren im Handumdrehen - oft mit nur einem Fingertipp auf einem mobilen Bildschirm. Trotz der geringen Art der Interaktion, also „Mikro“, ist der Wert für die Benutzer immens, da diese Engagements stärker in die täglichen Aktivitäten integriert werden.
Wie entwerfen Sie One-Tap-Mikrointeraktionen, die Benutzer begeistern werden? Hier sind einige Ideen.
Entdecken Sie Envato-Elemente
Animieren Sie einen Button
Erinnerst du dich an das erste Mal, als du Facebook wie in Messenger bemerkt hast? Sie haben auf das Symbol "Daumen hoch" getippt und es wurde in der Box zu der Person, mit der Sie chatten. Hat es dich zum Lächeln gebracht? Hat Ihnen diese kleine Bewegung ein bisschen Freude bereitet?
Eine einfache Animation vor dem Tippen, um sie zu fördern, oder nach dem Tippen, um zu zeigen, dass die Mikrointeraktion funktioniert, ist ein sicherer Weg, um etwas zu erstellen, auf das Benutzer tippen möchten. Kleine Animationen bieten Informationen darüber, was passiert, damit sich Benutzer in Bezug auf ihre Rollen in der Feedback-Schleife wohl und sicher fühlen.
Tu es nicht
Die Animation sollte so einfach sein wie die Mikrointeraktion selbst. Halten Sie Bewegungen einfach und flüssig und schnell zu starten und zu beenden. Das Hinzufügen eines Ratings zu IMDb folgt diesem Prinzip. Bewegen Sie den Mauszeiger über die Bewertung und sehen Sie schnell die Anzahl der Sterne, die Sie hinzufügen müssen, wenn Sie sich über die einzelnen Sterne bewegen. Tippen Sie hier, um die Aktion zu beenden und zu bestätigen.
Optionen bereitstellen
Es ist eine Lektion in UX, die auf Liebesbriefe für Grundschule und Kindergarten zurückgeht. Magst du mich? Markiere Ja oder Nein.
Mit demselben Konzept können großartige Mikrointeraktionen entworfen werden. Geben Sie den Benutzern zwei schnelle Auswahlmöglichkeiten. Tippen Sie hier, um eine Aktion zu starten (oder zu stoppen). Tippen Sie zum Umschalten auf. Benutzer möchten Entscheidungen treffen und die Kontrolle über digitale Erlebnisse haben, möchten sich jedoch nicht mit mehreren Bildschirmen festsetzen, um dorthin zu gelangen.
Sofortige Aktion erstellen
Der beste Weg, um sicherzustellen, dass Benutzer mit Ihrer Mikrointeraktion interagieren? Das Ergebnis sollte sofort eintreten. Das gewünschte Ergebnis sollte:
- Passiert mit einem einzigen Fingertipp
- Stellen Sie die gewünschte Aktion innerhalb von 0, 1 Sekunden bereit
Die Unmittelbarkeit von Mikrointeraktionen ist entscheidend für ihren Erfolg. Da die Art dieser Elemente gering ist, wird jede Verzögerung der Aktion die Benutzer stören. (Denken Sie nur daran, wie frustrierend es wäre, wenn drei Klicks erforderlich wären, um einen Alarm auszuschalten, oder wenn es eine Verzögerung von 2 Sekunden gäbe, um den Klingelton bei einem Anruf während eines Meetings zum Schweigen zu bringen.)
Das schnelle Umschalten zwischen "Gefällt mir" (oder "Nicht") oder "Folgen" auf Instagram ist ein perfektes Beispiel. So schnell sollte Ihre Mikrointeraktion sein.
Design für die Wiederholung
Eines der Dinge, die die Mikrointeraktion von einigen anderen interaktiven Elementen in Ihrer Benutzeroberfläche unterscheiden, ist, dass sie immer wieder verwendet werden. Mikrointeraktionen sind normalerweise nicht für die einmalige Verwendung vorgesehen. (Wie oft hast du in der letzten Stunde auf den herzförmigen Instagram-Button getippt?)
Entwerfen Sie für diese sich wiederholende Aktion, aber die Aktion sollte sich nicht wie eine sich wiederholende Bewegung anfühlen. Das klingt vielleicht nach viel zu tun, aber es kommt auf die intuitive Art des Wasserhahns an. Ist es offensichtlich und natürlich? Wenn ein Benutzer nicht über eine Aktion nachdenken muss, wird sich diese nie wiederholen.
Die Verwendung allgemein akzeptierter Benutzermuster, Animationen und Symbolstile hilft bei der Gestaltung von Mikrointeraktionen. Erfinden Sie das Rad hier nicht neu. Machen Sie es Benutzern einfach, Aufgaben mit einem Fingertipp zu erledigen, ohne sich die Köpfe darüber kratzen zu müssen.
Machen Sie es lesbar und zuordenbar
Hier ist der Schritt, der viel zu oft vergessen wird: Anweisungen innerhalb von Mikrointeraktionen müssen lesbar und nachvollziehbar sein.
Lesbar bezieht sich auf alle Texte oder Anweisungen, die sich auf die Mikrointeraktion beziehen. Wörter müssen leicht zu sehen und zu scannen sein. Aus gestalterischer Sicht sind die Auswahl einer guten Schrift und die Sicherstellung, dass genügend Platz um Wörter und viel Kontrast zwischen Schrift und Hintergrund vorhanden sind, der Schlüssel. Vermeiden Sie komprimierte, dünne oder neuartige Schriften, die auf einen Blick nicht leicht zu lesen sind.
Relatable bezieht sich auf Text, der genauso gelesen wird, wie Menschen sprechen. Gelegentliche Sprache oder umständliche Phrasierung sollten vermieden werden. Anweisungen in Formularfeldern, die verschwinden, wenn ein Benutzer mit der Eingabe beginnt, sind ein gutes Beispiel. Dies gilt insbesondere dann, wenn der Wortlaut einen Ton oder eine Stimme verwendet, die der Benutzer von der Marke oder Website erwartet, mit der er interagiert.
Konzentrieren Sie sich auf Details
Eine Mikrointeraktion ist eines von vielen Designdetails, aus denen sich Ihre Benutzeroberfläche zusammensetzt. Sie müssen bei jedem von ihnen besonders vorsichtig sein.
Mikrointeraktionen sollten sich als Teil des Gesamtdesigns anfühlen. Aber Sie müssen auch auf andere Weise über diese winzigen Handlungen nachdenken. Von der Farbauswahl bis zur Größe der Elemente, mit denen ein Benutzer interagieren muss, werden diese Details zum Handeln anregen oder dazu führen, dass Benutzer das Design für etwas anderes aufgeben.
Erstellen Sie wie bei jedem anderen Designelement eine Reihe von Stil- und Designregeln für Mikrointeraktionen innerhalb einer App oder Website, damit die Aktionen im gesamten Design konsistent und für Benutzer leicht zu finden und zu bearbeiten sind. Je kleiner das Element - oder die Interaktion - desto wichtiger werden die Details.
Halte es einfach
Eine Million Mal zu sagen ist nicht genug - halten Sie es einfach. Es gibt einfach zu viele Designs, die zu schwer zu verwenden sind. Du denkst vielleicht, dass es cool ist, aber Benutzer werden es nicht. Sie mögen Vorhersehbarkeit, Konsistenz und Einfachheit.
Je einfacher es ist, mit etwas zu interagieren, desto wahrscheinlicher ist es, dass Benutzer tatsächlich auf eine Schaltfläche tippen. Deshalb sind One-Tap-Aktionen so wichtig. Woher wissen Sie, ob Ihr Design einfach genug ist? Es benötigt eine definierte Struktur mit einer Rückkopplungsschleife für Aktionen, einfache Anweisungen und Grafiken sowie eine Nachricht, die klar kommuniziert und leicht zu verstehen ist.
Hören Sie nicht auf, sich zu entwickeln
Das Entwerfen von Mikrointeraktionen ist ein evolutionärer Prozess. Weil dies ein so neues Konzept ist, ändert es sich ständig. Es gibt neue Ideen und neue Möglichkeiten, um etwas zu erstellen, auf das Benutzer tippen möchten.
Mit der Entwicklung der Mikrointeraktionen auf dem Laufenden zu bleiben, geht auf die Grundlagen zurück, die Dan Saffer zuerst definiert hat. (Er schrieb auch eines der maßgeblichsten Bücher zum Thema „Mikrointeraktionen: Entwerfen mit Details“.) Mikrointeraktionen umfassen einen vierstufigen Prozess, der mit einer Auslöseaktion beginnt, Regeln für die Funktionsweise der Interaktion und eine Rückkopplungsschleife, damit der Benutzer sie kennt Es ist etwas passiert und es gibt Schleifen und Modi, die bestimmen, wie zukünftige Interaktionen funktionieren oder was als nächstes kommt. Denken Sie daran und Sie sind auf dem Weg zum Erfolg der Mikrointeraktion.
Fazit
Es gibt viele Teile, um etwas so Kleines zu entwerfen. Denken Sie also nicht, dass Sie in fünf Minuten eine Mikrointeraktion erstellen und weitermachen können. Das Entwerfen einer Mikrointeraktion erfordert besondere Berücksichtigung und Planung.
Denken Sie daran, dass die besten Mikrointeraktionen im Allgemeinen mit einem einzigen Fingertipp funktionieren und Elemente sind, mit denen Benutzer nicht einmal darüber nachdenken, sich zu beschäftigen, obwohl sie dies regelmäßig tun.
