12 schlechte UX/UI-Fehler, die man beim App-Design nicht machen sollte

Text zu klein zum Lesen.

Kleiner heller Schriftinhalt auf weißem Hintergrund.

Benutzer sind nicht in der Lage, die entscheidenden Funktionen irgendwo in der Benutzeroberfläche zu sehen.

Dies sind einige der häufigsten Probleme beim UX/UI-Design in Apps, und viele Fehler wie diese würden Sie teuer zu stehen kommen. Bei der Planung eines Softwareprojekts ist es unerlässlich, solche Fehler schon früh in der Designphase zu erkennen, da das Ziel darin besteht, eine intuitive und schnelle Benutzeroberfläche zu schaffen, die eine nahtlose Benutzererfahrung bietet.

Hier sind einige tödliche Fehler, die der App zum Verhängnis werden können, und wie Sie sie schließlich vermeiden können.

1. Abweichung von den Benutzererwartungen

Interessanterweise haben Benutzer einige Erwartungen, wenn es um die Verwendung dieser grundlegenden GUI-Widgets (Optionsschaltflächen, Kontrollkästchen, Bildlaufleisten, Befehlslinks/Schaltflächen usw.) geht. Der Versuch, eine revolutionäre Änderung an diesen Schaltflächen vorzunehmen, wird möglicherweise nicht gut angenommen.

Betrachten Sie dieses einfache Beispiel: Sie haben Ihr ganzes Leben lang BBC-Nachrichten gehört. Plötzlich beschließt jemand in Ihrer Familie, stattdessen CNN zu hören, und Sie haben das Gefühl, „Fisch aus dem Wasser“ zu sein. Genau das werden auch die Benutzer spüren, wenn Sie umfangreiche Änderungen an den GUI-Widgets vornehmen.

Die meisten der beliebten GUI-Widgets wurden jahrelang perfektioniert und damit experimentiert, und es gibt einen Grund, warum Benutzer sie mögen. Es ist nicht einfach, dieses Gefühl von Leichtigkeit und Komfort über Nacht zu ändern. Dies liegt daran, dass Benutzer viel Energie und Gehirnleistung aufwenden müssen, um etwas Neues zu tun. und sie sind möglicherweise nicht empfänglich dafür.

Nehmen Sie daher keine drastischen Änderungen am Erscheinungsbild der GUI-Widgets Ihrer App vor. Ihre Benutzer bevorzugen eine problemlose Navigation durch die App, daher ist es besser, wenn Sie das ursprüngliche Erscheinungsbild der GUI beibehalten.

2. Nicht wissen, was der Benutzer wirklich braucht

Wenn Unternehmen die tatsächlichen Bedürfnisse der Benutzer nicht erkennen und etwas entwickeln, das nicht auf ihre Bedürfnisse eingeht, führt dies zu einem großen Fehler. In solchen Fällen können Sie den Umsatz nicht steigern und Ihre App fällt aus.

Es ist wichtig, zu recherchieren und tiefe Einblicke in die Interessen der Benutzer zu gewinnen, bevor man sich für die Funktionen entscheidet, die integriert werden sollen. Führen Sie dazu eine gründliche Benutzer- und Marktforschung durch.

Verstehen Sie, was Ihre Zielbenutzer vom Design Ihrer App erwarten – sofortige Reaktionszeit, reibungslose Navigation zwischen den Steuerelementen, einfache Lesbarkeit und so weiter – kurz gesagt, eine intuitive Benutzererfahrung.

Führen Sie auch eine kritische Analyse Ihrer Konkurrenten durch – kennen Sie den Usability-Faktor ihrer Apps; welche Funktionen sie in ihren Apps enthalten, wie interaktiv ihre Benutzeroberflächen sind usw.

Und Anfänger-Entwickler aufgepasst: Überfrachten Sie die App nicht mit zu vielen Funktionen. Der Hauptzweck einer App besteht darin, die Aktivitäten Ihrer Benutzer zu vereinfachen.

Es wäre also ratsam, es mit Funktionen nicht zu übertreiben, da dies zu einer Flut von Aktivitäten führen würde, die es sofort in eine mittelmäßige App verwandeln würden. Eine geringere Anzahl von Funktionen (natürlich die besten) würde ausreichen.

3. Schlechte Berührungsziele

Benutzer sind mit unterschiedlich großen Fingern ausgestattet. Die Berührung muss also so konfiguriert werden, dass sie den Fingern aller Menschen im Zielsegment gerecht wird. Die durchschnittliche Breite eines erwachsenen Zeigefingers beträgt 1,6 bis 2 cm. Denken Sie daher beim Entwerfen berührungsbasierter mobiler Anwendungen daran.

Wenn es Benutzern schwer fällt, die Funktionen der App zu berühren und zu aktivieren, können sie die Verwendung der App ganz aufgeben, und das wäre wirklich tragisch. Und dies gilt wiederum für die Anzahl der Funktionen, die Sie haben. Je mehr Funktionen Sie haben, desto kleiner sind die Tippbereiche in der App. Auf der anderen Seite würde die Einbindung weniger erstklassiger Merkmale zu größeren Zapfflächen führen.

4. Der Scroll-Horror

Zeitschriften- und Zeitungsredakteure und Werbetreibende lebten einst im ewigen Schrecken von „the fold“. Als mobile Anwendungen populär wurden, ließ der „Fold-Horror“ etwas nach, da die Inhalte auf einem Bildschirm sichtbar waren, der leicht gescrollt werden konnte.

Dies war jedoch nur teilweise richtig, da es immer wichtiger wurde, ein ansprechendes und längeres Weblayout zu erstellen, bei dem die Hauptaktionen nicht unter die Falte gehen sollten, oder vielmehr einen Ort schlagen sollten, an dem die Leute leicht scrollen und es finden können.

Die Conversions steigen nur, wenn die entsprechenden Schaltflächen „above the fold“ platziert werden oder die Nutzer nicht scrollen müssen. Die Platzierung eines klaren Call-to-Action an prominenter Stelle würde zu mehr Conversions führen.

5. Schaltflächen, die das Aussehen von GUI-Steuerschaltflächen nachahmen

So wie es ein schrecklicher Fehler sein kann, zu viele GUI-Steuerelemente zu haben, kann auch das Gegenteil davon tödlich sein. Unterstrichene Texte und Überschriften erzeugen den Eindruck, es handele sich um Links, die den Nutzer auf eine neue Seite führen würden.

Sie klicken darauf, aber wenn sie die Seite nicht erreichen, gehen sie davon aus, dass der Link defekt ist, und verlassen die App. Die Benutzer sind aufgrund dieser Farce oft verwirrt und manchmal irritiert und kommen möglicherweise nicht mehr zurück.

Zeigen Sie die Radiobuttons dort, wo sie unbedingt notwendig sind, aber erwecken Sie nicht den falschen Eindruck von Radiobuttons, wo keine sind.

6. Inkonsistente GUI-Steuerelemente

Die GUI-Steuerelemente sollten konsistent sein. Wenn Sie bestimmte Wörter für Call-to-Action und ähnliche Aktionen verwenden, verwenden Sie dieselben Wörter in der gesamten App. Die Verwendung unterschiedlicher Wörter für dieselbe Aktion kann zu Verwirrung führen.

Manchmal bewirken Aktionen, von denen die Entwickler annehmen, dass sie für die Benutzer einfach sind, genau das Gegenteil. Wenn Sie in Ihrer App einem bestimmten Muster folgen, befolgen Sie es durchgehend. Stellen Sie sicher, dass die Schaltflächen und Seiten dort erscheinen, wo die Benutzer sie erwarten.

7. Überspringen der Flussdiagramme und Herunterkommen zum Entwerfen

Entwickler sparen keine Zeit, indem sie die Flussdiagramme überspringen und direkt in den Designteil der App eintauchen. Es ist sehr wichtig, ein Flussdiagramm mit Blick auf die Benutzer zu erstellen, und viele Entwickler erstellen diese Diagramme mit Benutzerpersönlichkeiten, damit sie immer den Endbenutzer im Auge haben.

Dies würde auch dabei helfen, festzustellen, woher die Benutzer kommen, was ihre Interessen sind und wo sie liegen. Daher ist es beim Entwerfen der Flussdiagramme unerlässlich, über die Benutzer- und Geschäftsziele zu entscheiden und darüber, ob sie am Ende erreicht werden oder nicht. Durch das Erstellen einer Flussgliederung ist es möglich, verschiedene Optionen mit Seitenflüssen durchzugehen und sich für die beste zu entscheiden.

8. „Wahrgenommene Affordances“ nicht berücksichtigen

Laienhaft bedeutet Erschwinglichkeit alle Aktionen, die in Abhängigkeit von den Eigenschaften eines Objekts / einer Umgebung physikalisch möglich sind. Eine Treppe ermöglicht den Auf- oder Abstieg, ein Flaschenverschluss das Auf- oder Abschrauben.

In ähnlicher Weise erfüllt ein Schieberegler auf einer Webseite die Funktion, sich nach oben und unten zu bewegen, das Kontrollkästchen ermöglicht es Ihnen, es zu aktivieren oder zu deaktivieren, und der verlinkte Text führt Sie zu einer anderen Seite. Affordance ermöglicht es einem Benutzer, etwas zu tun, das er leicht verstehen kann.

Die Wahrnehmung dieser Angebote basiert auf dem Wissen des Benutzers über die Webseite, Erfahrungen, Überzeugungen und Ziele. Beim Entwerfen von Benutzeroberflächen ist es für den Designer wichtig, korrekte Hinweise zu geben, da dies sonst zu Verwirrung und damit zu einer schlechten Benutzererfahrung führen kann.

Designer müssen korrekte visuelle Zeichen verwenden, durch die Benutzer erkennen können, wie sie diese UI-Elemente beobachten und mit ihnen interagieren. Es ist auch wichtig, sich daran zu erinnern, dass nicht alle Benutzer gleich sind; Daher werden möglicherweise nicht alle Angebote von allen gleich wahrgenommen oder interpretiert. Untermauern Sie also alle visuellen Hinweise mit den richtigen Etiketten und Anweisungen.

9. Fehlen der richtigen Art von Dialogfeldern

In der Dialog-Usability einer Web-App ist es zwingend erforderlich, die Benutzer über den aktuellen Zustand des Systems und die Interpretation ihrer Befehle zu informieren. Dialoge sollen Benutzer darüber informieren, wie sich ihre Aktionen entwickeln, ohne sie vom aktuellen Bildschirm abzulenken.

Schweigen kann die Benutzer im Unklaren lassen. Stellen Sie daher beim Erstellen einer Web-App sicher, dass das Dialogfeld keine Informationen für die Benutzer verdeckt. Aber gehen Sie sparsam damit um, da fortlaufende Nachrichten störend sein können.

Wenn sich der Benutzer zum Beispiel entscheidet, eine bestimmte Seite zu verlassen, nachdem er Informationen eingegeben hat, kann das Dialogfeld mit dem Bestätigungsfeld „Entwurf verwerfen? Abbrechen oder verwerfen“.

Es kann jedoch sehr irritierend sein, sie viel zu oft mit Abonnement-Dialogfeldern zu bombardieren (z. B. „Bitte abonnieren Sie unseren täglichen Newsletter, indem Sie Ihre E-Mail-Adresse eingeben“).

10. Häufige Fehler bei Fehlermeldungen machen

Benutzer verbringen Zeit und Mühe damit, Formulare auszufüllen, und wenn sie einen Fehler enthalten, ist es zwingend erforderlich, sie darüber zu informieren, was und wo schief gelaufen ist. Wenn es bestimmte Regeln für die Erstellung eines Passworts gibt, informieren Sie die Benutzer vorher, damit sie nicht zweimal dasselbe tun müssen.

Oder, wenn es einen Promo-Code gibt, der angewendet werden soll, informieren Sie sie einfach vorher, welche Art von Promos gelten und warum. Sie nicht rechtzeitig zu informieren, kann beim Benutzer Angst und Frustration erzeugen. Denken Sie daran, diese Fehler beim Erstellen von Fehlermeldungen nicht zu machen:

1. Mehrdeutigkeit – Unklarheit über den vom Benutzer gemachten Fehler.
2. Den Benutzer beschuldigen – Es ist besser, demütig zu sein, selbst wenn der Benutzer den Fehler macht. Weisen Sie vorsichtig auf den Fehler hin, damit sie aufgefordert werden, es erneut zu versuchen.
3. Schlechte Platzierung von Fehlermeldungen – Es ist ratsam, die Fehler nicht in eine Liste mit Aufzählungszeichen zu setzen, da sie dadurch wirklich ausgeschaltet werden. Platzieren Sie die Fehlermeldungen direkt über den Fehlern, damit die Benutzer sofort sehen können, was falsch ist.
4. Keine Mikrokopie verwenden, um Fehler zu vermeiden – Kleine erklärende Textstellen in der Nähe der Lücken können dem Benutzer tatsächlich mitteilen, was er ausfüllen soll, damit er es gleich beim ersten Mal versteht.

11. Fehlen von Smart Defaults

Ein zusätzliches Feld auf der Formularausfüllseite Ihrer App kann abschreckend wirken. Wenn dieses zusätzliche Feld also absolut notwendig ist, stellen Sie sicher, dass Sie Standardwerte in die Formulareingabefelder eingeben. Die Leute scannen Formulare schnell, um zu prüfen, wie viel Zeit sie zum Ausfüllen des Formulars benötigen, und wenn das Formular bereits einen Standardwert enthält, werden sie wahrscheinlich fortfahren und die anderen ausfüllen.

Wenn Sie keine intelligenten Standardeinstellungen haben, kann dies zeitaufwändig und frustrierend für den Benutzer sein, und das ist ein schwerwiegender Fehler. Es ist auch ratsam, keine Standardwerte für Eingabefelder festzulegen, die die Aufmerksamkeit des Benutzers erfordern. Gehen Sie nicht davon aus, worauf der Benutzer klicken wird, und selbst wenn es sich um eine gut recherchierte Standardeinstellung handelt, möchten Benutzer möglicherweise etwas anderes.

12. Ignorieren von Akzentfarben für die Call-to-Action-Buttons

Es ist sehr wichtig, gute Akzentfarben zu integrieren, um die Aufmerksamkeit auf Schaltflächen wie „Jetzt kaufen“, „Kostenloses Tutorial starten“, „Jetzt anmelden“ usw. zu lenken. Verwenden Sie eine andere Farbe für die Schaltflächen, damit sie sich von anderen abheben, insbesondere für diejenigen, die es sehr sind wichtige Call-to-Action-Buttons.

Die Akzentfarbe muss hell genug sein, um Aufmerksamkeit zu erregen, aber nicht irritierend und ablenkend. Stellen Sie sicher, dass die Akzentfarbe mit dem Rest des Farbthemas in der App harmoniert. Reservieren Sie auch eine bestimmte Farbe für den Call-to-Action und verwenden Sie diese nicht an anderer Stelle auf der Seite.

Fazit

Dies sind einige der am häufigsten gefundenen Fehler im UI/UX-Design. Und denken Sie daran, wann immer Sie Designänderungen vornehmen, stellen Sie sicher, dass Sie diese gründlich testen, um zu sehen, wie effektiv sie wären.

App-Design ist ein Unterscheidungsmerkmal für den Erfolg, und bei Tausenden von Apps, die jeden Tag veröffentlicht werden, erhalten nur eine Handvoll von ihnen die Genehmigung. Schlechte Praktiken können zu tödlichen Fehlern im UX/UI-Design führen, und alle Bemühungen so vieler Menschen gehen den Bach runter.

Eine letzte Erinnerung:

Denken Sie beim Entwerfen Ihrer App daran, für mehrere Plattformen zu entwerfen, es sei denn, Sie zielen auf eine bestimmte ab. So kommt ein Minimum Viable Product (MVP) direkt in den Laden.