5 Design-Tricks, um Ihr mobiles UX zum Leuchten zu bringen
Haben Sie sich in letzter Zeit Ihre Website-Analyse angesehen? Die Wahrscheinlichkeit ist groß, dass ein erheblicher Teil - vielleicht sogar mehr als die Hälfte - Ihrer Benutzer über ein Mobilgerät auf Ihre Website gelangt.
Unabhängig davon, ob Sie Ihre mobilen Bemühungen auf eine Website oder eine App konzentrieren, müssen Sie sicherstellen, dass das Design für jeden dieser mobilen Benutzer eine hervorragende Benutzererfahrung bietet. Sie müssen auch nicht bei Null anfangen, um dies zu tun. Wenn Sie über den mobilen Benutzer nachdenken und darüber, wie er mit dem Design interagiert, können Sie das Erscheinungsbild und die Funktion Ihrer Benutzeroberflächen beeinflussen.
Hier sind fünf Design-Tricks, mit denen Sie Ihr mobiles UX zu einem Gerät machen können, das Benutzer lieben.
Entdecken Sie Envato-Elemente
1. Optimieren Sie die Navigation
Diese Mega-Navigationsmenüs der alten Schule tun Ihnen keinen Gefallen - besonders wenn es um Mobilgeräte geht. Mobile Benutzer haben möglicherweise die kürzeste Aufmerksamkeitsspanne einer Benutzergruppe. Sie möchten die Website oder App öffnen und sofort finden, was sie brauchen.
Entwerfen Sie Navigationsmenüs mit nur wenigen Optionen. Sehen Sie sich Ihre Analysen an, um zu sehen, wonach die meisten Benutzer suchen, oder navigieren Sie zuerst.
Weniger Optionen benötigen weniger Platz auf dem Bildschirm, sodass Sie mehr Platz in das Design integrieren können, was sich ideal für Berührungen und Lesbarkeit eignet.
Während wir hier nicht über die Vorzüge des Hamburger-Symbols streiten, ist die Pop-out-Navigation ein Muster, an das Benutzer gewöhnt sind. Stellen Sie einfach sicher, dass Benutzer eine eindeutige visuelle Kennung haben, wenn Sie das Navigationsmenü öffnen oder herausziehen möchten.
Die Ebates-App verwendet zwei Navigationsebenen: Eine Liste der Top-Angebote und eine andere Liste Ihrer Lieblingsgeschäfte (im Hamburger- / Herz-Symbol). Keine der Optionen fühlt sich schwer an. Es sieht fast aus und funktioniert wie Inhalt. Das gesamte Design ist Navigation, ohne sich überwältigend zu fühlen.
2. Denken Sie in Gesten (und Haptik)
Mobile Benutzer interagieren ganz anders mit ihren Geräten als Desktop-Benutzer. Ihre Benutzeroberfläche sollte dies berücksichtigen.
Das Design sollte Gesten nutzen, um bestimmte Aktionen auszuführen. Eine Benutzeroberfläche mit allgemeinen und intuitiven Steuerelementen wird die Benutzer begeistern.
Diese Gesten umfassen:
- Tippen und doppelt tippen
- Drücken Sie
- Halt
- Drag & Drop
- Scrollen (Einzel- und Zweifinger)
- Vergrößern und verkleinern
- Wischen Sie
- Flick
Wenn es um mobile Gesten geht, sind die neuen Klicks.
Und während Sie über Berührungsinteraktionen nachdenken, vergessen Sie nicht die Haptik. Diese subtile „Beule“ von Ihrem Wearable oder die Vibration von Ihrem Telefon in einer Tasche sind haptische Benachrichtigungen, mechanische Simulationen von Berührungen mit Vibration oder Bewegung.
Der Trick zur Haptik ist, dass die Interaktionen subtil und ziemlich unauffällig sind. Während der Benutzer möglicherweise weiß, dass eine Benachrichtigung vorliegt, wird dies bei anderen Personen häufig nicht der Fall sein. Die Touch-Oberfläche wird immer häufiger und scheint von den Benutzern positiv aufgenommen zu werden.
Das Two Dots-Spiel verwendet beispielsweise jedes Mal eine Beule, wenn Sie Punkte auf eine bestimmte Weise löschen. Die lautlose Option sorgt für diskretes Spielen und bietet den Benutzern ein angenehmes Erlebnis.
3. Machen Sie es Konversation
Menschen möchten das Gefühl haben, mit anderen Menschen zu sprechen und mit ihnen zu interagieren. Zum Glück für Designer kann ein Hauch von künstlicher Intelligenz und Chatbots dabei helfen, diese Interaktionen zu erstellen, sodass Sie nicht 24 Stunden am Tag für Live-Chat-Sitzungen in Bereitschaft sein müssen.
Es gibt drei Möglichkeiten, eine Konversations-Benutzeroberfläche zu erstellen:
- Schreiben Sie eine Kopie über Ihre Benutzeroberfläche, die eine persönlichere Note hat. Von langen Textblöcken bis hin zu winzigen Mikrokopien sollte Text eine Persönlichkeit haben, wie in der WTFWeather-App oben. Es sollte so gelesen werden, wie die Leute sprechen. Achten Sie darauf, dass Ihre Nachrichten nicht zu formell oder roboterhaft klingen.
- Verwenden Sie Messaging-Funktionen oder Chatbots, um sofortige Interaktionen mit Benutzern zu erstellen. Dies kann ein großartiges Kundenservice-Tool sein und auch zur Kundenbindung beitragen, wenn immer jemand da ist, der ihnen bei Problemen hilft.
- Integrieren Sie eine Sprachbenutzeroberfläche in das Design. Siri und Alexa sind dank Sprachschnittstellen bekannte Namen. Der andere Bonus für die Integration von Sprachbefehlen? Dadurch wird Ihre Website oder App zugänglicher.
4. Animieren Sie es
Anscheinend gibt es auf fast jeder Website, die Sie besuchen, animierte Elemente. Und das ist beabsichtigt. Animation kann ein Design zum Leben erwecken.
Animierte Elemente sind sehr ansprechend, da sie die Aufmerksamkeit der Benutzer auf sich ziehen und den Benutzern zeigen können, wie sie besser mit einem Design interagieren können. (Es geht zurück auf die klassische Idee von "Show, Don't Tell" beim Erstellen eines Designs.)
Google Maps zum Beispiel ist voller kleiner Animationen. Achten Sie beim nächsten Gebrauch darauf.
Nick Babich für UX Planet hat eine großartige Einführung in die Verwendung von Animationen im Design mobiler Benutzeroberflächen. Er skizzierte drei Hauptanwendungen für die gute Verwendung von Bewegung.
- Für den Systemstatus: Verwenden Sie die Animation, um einen Ladestatus anzuzeigen, Inhalte zu aktualisieren und Benachrichtigungen zu erhalten.
- Für Navigation und Übergänge: Verwenden Sie Animationen, um Benutzern das Wechseln zwischen verschiedenen Inhaltstypen zu erleichtern, eine visuelle Hierarchie zwischen Elementen herzustellen und eine Statusänderung anzuzeigen.
- Für visuelles Feedback: Verwenden Sie eine Animation, um die Bestätigung einer Aktion anzuzeigen oder das Ergebnis einer Aktion zu visualisieren.
5. Gut an Bord und Formulare ordnungsgemäß verwenden
Insbesondere bei einer App ist das Onboarding für die Kundenbindung von entscheidender Bedeutung.
Denken Sie an das letzte Spiel, das Sie heruntergeladen haben. Bist du gleich reingesprungen? Oder brauchten Sie ein kurzes Tutorial, um den Erfolg sicherzustellen?
Mithilfe einer interaktiven Onboarding-Erfahrung für Apps lernen Benutzer, wie sie die in der Benutzererfahrung enthaltenen Funktionen optimal nutzen können. Eine unterhaltsame Option hilft dabei, sie auch an treue Benutzer weiterzugeben. Halten Sie das Onboarding-Tutorial kurz und stellen Sie sicher, dass Sie einen häufig gestellten Fragen- oder Hilfeabschnitt einfügen, damit Benutzer bei Problemen darauf zurückgreifen können.
Bei mobilen Websites ist das Onboarding weniger ein Hauptanliegen, aber Anmelde- oder Registrierungsformulare können ein Problem sein. Formulare auf Mobilgeräten müssen einfach und unkompliziert sein. Benutzer mögen keine sperrigen, komplizierten Formulare.
Optimieren Sie Formulare für Mobilgeräte, um die Conversions zu steigern. (Sie können später jederzeit weitere Informationen anfordern.)
Schauen Sie sich oben den einfachen Ausgangspunkt für GoodRx an. Es wird nur nach der Medizin gefragt, über die Sie mehr wissen möchten. Die Form steht im Mittelpunkt und ist super einfach.
Fragen Sie nach nur einer Information - einer E-Mail-Adresse. Das ist alles, was Sie brauchen, um eine Beziehung mit einem Benutzer aufzubauen. Wenn für Ihre Website oder App eine Anmeldung erforderlich ist, halten Sie sich an eine E-Mail-Adresse und ein Kennwort.
Entwerfen Sie das Formular so, dass die Felder (vom Standpunkt der Größe aus) einfach auszufüllen sind, und verzichten Sie auf automatische Vervollständigungsfunktionen, um die Wahrscheinlichkeit von falsch eingegebenen E-Mail-Adressen zu verringern. Noch ein Trick? Verwenden Sie ein soziales Anmeldeformular, wenn Sie den Vorgang noch weiter vereinfachen möchten. Benutzer sind an diesen Prozess gewöhnt und es ist einfach für sie… und es ist weniger wahrscheinlich, dass Fehler für Sie auftreten.
Fazit
Die mobile Benutzererfahrung ist eines der wichtigsten Dinge, über die Sie beim Erstellen Ihrer Website oder App nachdenken müssen. Und die Bedürfnisse mobiler Benutzer ändern sich ständig.
Erstellen Sie eine Benutzeroberfläche, die einfach zu bedienen ist und die moderne Technologie und Funktionen nutzt, um etwas zu erstellen, mit dem sich Benutzer immer wieder beschäftigen möchten.
