Formulare bieten immer wieder Diskussionsbedarf: Wie werden Pflichtfelder gekennzeichnet? Wie erlange ich eine bessere Usability für meine Formulare? Warum erhalten wir keine Anfragen über unser Kontaktformular?
Auch Formulare sollten daher eine gute Usability aufweisen, um den Bedürfnissen ihrer Nutzer gerecht zu werden und zusätzlich um die Conversion-Rate zu steigern. Je weniger Hindernisse im Formular enthalten sind, desto wahrscheinlicher ist es, dass der Nutzer sein Aufgabenziel erreichen wird.
In diesem Artikel wird daher die erfolgreiche Konzeption von Formularen für Apps oder mobile Websites präsentiert.
Grundbedürfnisse der Nutzer erkennen
Ein wichtiger erster Schritt in der Konzeption besteht darin, die Bedürfnisse und Wünsche der Nutzer zu identifizieren. Darüber hinaus müssen Anforderungen erfasst werden, die sich nicht nur aus der Zielgruppe heraus ergeben, sondern ebenfalls durch verschiedene weitere Einflussfaktoren, wie zum Beispiel das zu benutzende Gerät oder die Umgebung entstehen.
Die Tatsache, dass Nutzer circa zwei Stunden täglich in Apps verbringen bedeutet auch, dass sie diese Zeit so effizient wie möglich in ihren Apps nutzen wollen, aber vor Allem auch eine gute User Experience eine entscheidende Rolle spielt. Somit muss bei der Entwicklung eines Formulars berücksichtigt werden, dass Inhalte auf kleinen Bildschirmen schnell wahrgenommen werden müssen. Für Formulare heißt das konkret: Reduktion auf wesentliche Inhalte! Sofern optionale Felder nicht unabdingbar sind, sollten diese entfernt werden, sodass den Nutzern eine effiziente Informationserfassung gewährleistet wird. Falls jedoch optionale Felder unabdingbar sind sollten diese entsprechend gekennzeichnet werden bzw. als solche direkt zu identifizieren sein. Des Weiteren sollten die einzelnen Felder eines Formulars selbsterklärende und vor allem präzise Bezeichnungen besitzen.
Formulare, die sehr viele Informationen abfragen, weisen häufig einen sehr langen Inhaltsbereich auf. Dieses Problem kann dennoch durch das Aufteilen des Formulars in mehrere Abschnitte umgangen werden. Hierbei sollte berücksichtigt werden, dass zu viele Abschnitte den Nutzer abschrecken können, was wiederum zu einem Formularabbruch führen kann. In der Regel gelten drei bis vier Schritte als gängig und überfordern den Nutzer nicht.
Nutzerführung
Den Benutzern von mobilen Geräten sollte die Benutzung so einfach wie möglich gemacht werden. Wichtig ist es, dass der Nutzer „geleitet“ wird anstelle von ihn sich selbst zu überlassen. Dies kann allein durch kleinere Anpassungen erreicht werden. Damit die Nutzer ihr Ziel ohne Umstände und Umwege erreichen, sollte beispielsweise der Fokus auf den zielführenden Buttons liegen. Das heißt Buttons wie „Abbrechen“ sollten weniger präsent, als Buttons wie „Weiter“ sein und dennoch die Regeln für die Gestaltung von Interaktionselementen, welche in der Corporate Identity festgelegt werden, berücksichtigen.
Wichtig ist auch, dass der Nutzerfluss nicht durch einen komplizierten Aufbau des Formulars gestört wird. Bestenfalls sollten die Formular-Elemente untereinander aufgeführt werden. Eine Kombination aus Eingabefeldern, wie beispielsweise von „Straße“ und „Hausnummer“, ist empfehlenswert, um den generellen Aufwand so gering wie möglich zu halten.
Ein Gutes Beispiel für die schnelle und einfache Nutzung von mobilen Formularen bietet Xing. Möchte ein Nutzer beispielsweise seine eigene Berufserfahrung bearbeiten, so erscheint durch Tippen in ein bereits ausgefülltes Feld ein Kreuz am rechten Seitenrand. Wählt der Nutzer dieses Symbol, so wird die gesamte Zeile gelöscht, ohne dass der Nutzer die Löschen-Taste lange gedrückt halten muss. Auf diese Weise wird dem Nutzer eine effizientere Verwendung gewährleistet.
Fehlervermeidung & Fehlerbehebung
Nutzer müssen über das, was tatsächlich passiert informiert werden. Wichtig ist es vor allem, dass das System dem Nutzer Rückmeldungen liefert, die zur Behebung von Fehlern beitragen. Gerade in Apps kommt es häufig vor, dass Nutzer ihre Eingaben überarbeiten müssen, da sie eine Falsche getätigt haben. Bestenfalls liefert das System Live-Feedback, welches konkrete Hinweise zur Behebung aufzeigt und den Nutzer nicht überfordert.
MailChimp und photobucket liefern ihren Nutzern Live-Hinweise. MailChimp gibt jedoch direkt bei der Eingabe Hinweise zur korrekten Dateneingabe, photobucket hingegen wartet auf eine fehlerhafte Eingabe seines Nutzers und zeigt diesem erst dann eine Fehlermeldung an. Auf diese Weise wird der Anwender von photobucket durch die vielen Hinweise überflutet. MailChimp versucht Fehlern konkret vorzubeugen, indem der Nutzer direkt Eingabehinweise erhält.
Ein weiterer Punkt ist die Autokorrektur. Diese führt gerade beim Ausfüllen von Formularen zu großen Schwierigkeiten. Daher sollte diese für Formulare vollständig deaktiviert werden. Um die Bedienung dennoch zu Erleichtern können beispielsweise durch einen Autocompleter Eingabevorschläge, wie man es von Google kennt, gegeben werden. Auch ein zweimaliges Ausfüllen von Feldern, wie bei der Eingabe von Passwörtern oder E-Mail-Adressen, sollte in mobilen Formularen vermieden werden, um einer zweifachen fehlerhaften Eingabe und der einhergehenden Frustration des Nutzers vorzubeugen.
Touchbare vs. nicht-touchbare Elemente
Oft kommt es vor, dass in Formularen Call-to-Action Elemente nicht eindeutig erkennbar sind. Es ist jedoch sehr wichtig, dass dem Nutzer seine Handlungsoptionen klar aufgezeigt werden. Hierbei sollten beispielsweise touchbare und nicht touchbare Interaktionselemente unterschieden werden können. Des Weiteren ist es hilfreich für die Nutzer, wenn Elemente noch nicht touchbar sind, entsprechend gekennzeichnet werden, sodass klar wird, dass Abhängigkeiten zwischen verschiedenen Interaktionen besteht. Auf diese Weise kann der Nutzer direkt Interaktionen den einzelnen Elementen zuordnen. Generell sollte dabei beachtet werden, dass die gewählte Darstellung der CI der App entspricht, um eine Darstellungs-Konsistenz zu gewährleisten.
Außerdem sollte insbesondere bei der Konzeption von mobilen Formularen die Größe von Eingabefeldern, Buttons oder weiteren Interaktionsflächen berücksichtigt werden. Oftmals geraten diese viel zu klein und sind für Nutzer schwer auswählbar. Eine leichte Bedienung durch den Daumen muss berücksichtigt werden, sodass die Nutzer nicht unzufrieden mit der Handhabung sind.
Fokussierung & Transparenz
Pflichtfelder sollten stets als solche gekennzeichnet werden, damit Nutzer wissen, was von ihnen verlangt wird.
Im Registrierungsbereich der App Mondly wird dem Nutzer keinerlei Aufschluss darüber gegeben, welche Felder notwendig sind. Des Weiteren ist nicht erkenntlich, wo hier der Fokus liegt. Die Buttons zum Verbinden über die Social-Media-Kanäle stehen zu stark im Vordergrund. „Konto erstellen“ hingegen hebt sich weniger stark von den Umgebungselementen ab. Auch ist in diesem Formular keine Unterscheidung zwischen ausgewähltem und nicht ausgewähltem Eingabefeld erkennbar. In den Beispielen von Zalando hingegen ist ein klarer Fokus ausmachbar. Der Login und der Registrations-Button heben sich klar von den übrigen Elementen durch die farbliche Kennzeichnung und die gewählten Versalien ab. Zalando arbeitet sehr minimalistisch und klar im Gegensatz zum linken Beispiel. Der Nutzer erhält Informationen dazu, welche Felder erforderlich sind. Allerdings fehlt hier der Hinweistext, dass der Stern für ein Pflichtfeld steht. Benutzer, die diese Kennzeichnung noch nicht erlernt haben, wüssten nicht was dieses Sternchen bedeutet.
Eine weitere Funktion, die Zalando elegant umgesetzt hat, ist der Wechsel zwischen der Anmeldung und Registrierung. Über die zwei Tabs „LOG IN“ und „NEUER KUNDE“ kann der Nutzer auf einfachstem Weg zwischen diesen beiden Optionen wechseln. Bei der App Monldy muss der Nutzer sich zunächst durch das überladene Formular arbeiten bis er den „weggestalteten“ Link zum Anmelde-Bereich findet.
Faktor „Joy of Use“
Der Faktor „Joy of Use“ gerät leider viel zu häufig in Vergessenheit. Formulare so zu konzipieren, dass sie dem Nutzer Spaß bereiten und Begeisterungsfaktoren besitzen, ist nicht einfach. Allerdings gibt es zahlreiche Möglichkeiten um den Nutzern ein positives Nutzungserlebnis, eine gute User Experience zu schaffen – mit Neuem oder Unerwartetem überraschen, Animationen kleinerer Inhalte, witzige Erläuterungstexte für verschiedene Eingabefelder, etc.
Ein Unternehmen, welches mit seinen Kunden auf eine lockere Art und Weise kommuniziert, kann sich durchaus witzige Erläuterungen oder Fehlermeldungen, wie zum Beispiel MailChimp es macht, erlauben.
Testen Sie!
Falls Sie in Erwägung ziehen Ihre bestehenden Formulare hinsichtlich der Usability zu verbessern, konzipieren und strukturieren Sie nicht nur neu, sondern testen Sie zuvor Ihr Formular auf mögliche Schwachstellen. Auf diese Weise kann gezielt überprüft werden, an welchen Stellen Optimierungsbedarf besteht. Wir können Ihnen genau dabei helfen:
Google Analytics und der Google Tag Manager ermöglichen die Erfassung von potenziellen Schwachstellen durch das Tracken von Interaktionsereignissen und Absprüngen im Formular. Darüber hinaus kann mittels dieser Tools beispielsweise überprüft werden, ob ein Nutzer ein Formular tatsächlich abgeschickt hat und vieles mehr. Allerdings können diese Online-Werkzeuge nicht die Frage nach dem Warum beantworten. Hier helfen Usability-Tests oder expertenbasierte Methoden weiter um bestehende Formulare oder Konzepte auf deren Usability zu überprüfen. Wir beraten Sie gerne und konzipieren dann auf Basis der Testergebnisse Ihr Formular!
