Die 10 Gebote des Designs mobiler Apps
Veröffentlicht: 2017-09-20Du sollst die Dinge nicht zu kompliziert machen
Es gibt über 3,4 Millionen Apps im Google Play Store – und etwas mehr als 2 Millionen im App Store von Apple. Das bedeutet, dass durchschnittlich 3.389 Apps pro Tag zum Google Play Store hinzugefügt werden – und obwohl Apple etwas selektiver ist, schaffen es immer noch 1.557 Apps täglich in den App Store.
Wenn Sie ein Entwickler mobiler Apps sind und möchten, dass sich Ihre App von der täglichen Flut abhebt, müssen Sie ein Produkt erstellen, das sowohl schön als auch angenehm zu bedienen ist.
Benötigen Sie ein wenig Anleitung, um sicherzustellen, dass Sie alles tun, um eine erfolgreiche App zu entwerfen? Sie müssen keinen Berg erklimmen – wir haben Ihre 10 Gebote für das Design mobiler Apps genau hier:
Du sollst die Dinge nicht zu kompliziert machen
Als App-Designer lässt man sich leicht mitreißen. Wenn Sie eine neue App auf den Markt bringen, haben Sie das Gefühl, dass Sie alle möglichen Funktionen einbauen müssen, die sich (im Moment) einfach so notwendig anfühlen. Dies gilt insbesondere, wenn Sie mit einem Team an einem Projekt arbeiten. Niemand möchte die Person sein, die ständig die Ideen aller anderen unter die Lupe nimmt – oder die dafür bekannt ist, ein Killer-Feature aus einem Projekt herauszuschneiden. Beim Design mobiler Apps führt das Einbeziehen zusätzlicher Funktionen an der Peripherie jedoch oft nur zu Verwirrung der Benutzer und zu einer überladenen, unkonzentrierten Benutzeroberfläche.
„Mobile Benutzer wollen eine elegante und schnelle Benutzererfahrung. Das Aufladen Ihrer App mit einer Reihe zusätzlicher Schritte oder der Versuch, ein Desktop-Erlebnis für ein Produkt zu kopieren, ist der falsche Designansatz“, sagt Mark Tuchscherer, Präsident von Geeks Chicago. „Mobile Benutzer werden einen minimalistischen Ansatz über alles andere stellen.“
Wir stimmen zu – beschränken Sie Ihre Funktionen auf das Nötigste, und wenn Sie schon dabei sind, stellen Sie sicher, dass Ihre Benutzeroberfläche eine ähnliche Denkweise widerspiegelt. Ihre Benutzeroberfläche sollte genau das tun, was der Benutzer benötigt, und nicht mehr.
Sie müssen sicherstellen, dass Ihr Design barrierefrei ist
Wie wir bereits gesagt haben, ist Barrierefreiheit nicht nur etwas, das man gerne hätte – es ist ein entscheidendes Feature, das in Ihrer App unbedingt vorhanden sein muss. Um es ganz klar zu sagen: Wenn Sie Barrierefreiheit nicht in den Vordergrund des Designs Ihrer mobilen App stellen, müssen Sie zurück zum Reißbrett gehen.
Zum einen ist es absolut notwendig, ein repräsentatives Publikum zu gewinnen, wenn man bedenkt, dass 57 Millionen Amerikaner eine Behinderung haben. Tatsächlich gibt es im Internet mehr Amerikaner mit Hörbehinderung als Italiener auf der ganzen Welt. Dasselbe gilt für Amerikaner mit einer Sehbehinderung. Denken Sie daran – das sind nur Amerikaner!
Darüber hinaus ist barrierefreies Design einfach gutes Design. Sowohl von Apple als auch von Android vorgeschlagene Best Practices für das Barrierefreiheitsdesign heben Dinge hervor, die Sie sowieso unbedingt tun sollten, wie z.
Unabhängig davon, ob Sie für Android oder iOS entwerfen, müssen Sie Ihre App natürlich unbedingt mit einem breiten Publikum testen. Geben Sie es nicht einfach in Ihrem Büro herum – bringen Sie es in die Hände einer vielfältigen Bevölkerung. Das Letzte, was Sie wollen, ist, dass Ihre App von einem großen Teil des Marktes unbrauchbar wird.
Du sollst das Rad nicht neu erfinden
Obwohl es viele Geräte gibt, gibt es ein paar universelle Design- und UX-Hinweise, denen fast jeder folgt. Betrachten Sie Ihre eigene Erfahrung mit Apps: Wenn Sie mit Ihrem Bildschirm interagieren, erwarten Sie, dass bestimmte Dinge passieren. In einigen Apps könnte das bedeuten, dass Sie erwarten, dass ein Menü an der Seite erscheint, wenn Sie mit dem Daumen darüber gleiten. Für andere könnte es logische und vertraute Berührungsgesten bedeuten, wie z. B. das Bewegen von Objekten per Drag & Drop.
Wir schlagen nicht vor, dass Sie Ihre App einfach Stück für Stück zusammenstellen, basierend auf UI-Elementen, die bereits in freier Wildbahn vorhanden sind, aber Sie sollten sich darüber im Klaren sein, was Ihre Benutzer von ihrer App-Erfahrung erwarten. Alle neuen Elemente, die Sie hinzufügen, müssen erklärt werden, entweder durch einen benutzerdefinierten Onboarding-Prozess oder durch intuitives Lernen. Das fügt eine zusätzliche Ebene der Komplexität für Ihren Benutzer hinzu. Es sollte vermieden werden, es sei denn, Sie haben absolut keine andere Wahl.
Stellen Sie sich das so vor: Wenn Sie eine App zum Durchsuchen Ihrer Fotos heruntergeladen haben und Sie eine völlig neue Art der Interaktion mit Ihrem Bildschirm erlernen müssten (z. B. durch Verwendung von Gesten, mit denen Sie nicht vertraut sind), würden Sie sie weiterhin verwenden? es? Was wäre, wenn es eine andere App gäbe, mit der Sie Gesten verwenden könnten, mit denen Sie bereits vertraut sind?
Werfen Sie Konventionen nicht weg, nur um sich von Ihren Mitbewerbern abzuheben. Sie sollten immer innerhalb der Designsprache arbeiten, mit der Ihre Benutzer vertraut sind, es sei denn, das Hinzufügen neuer Elemente ist unvermeidlich und trägt zum App-Erlebnis bei
Du sollst immer daran denken, für wen du designst
Wenn Sie eine mobile Fotobearbeitungs-App für Fotografen entwerfen, werden Sie andere Prioritäten haben, als wenn Sie ein Spiel zum Auswendiglernen von Wörtern für Kleinkinder entwerfen. Jedes Publikum, für das Sie entwerfen, hat unterschiedliche Erwartungen und reagiert auf unterschiedliche Arten von Designs.
Es kann hilfreich sein, Personas für fiktive Benutzer Ihrer App zu entwickeln, um zu modellieren, wie Sie erwarten, dass Menschen damit interagieren. Entwerfen Sie für einen Profi? Ein Student? Ein Arzt? Ein Unternehmen? Ein kleines Unternehmen? Erstellen Sie etwas, das von Kunden oder Mitarbeitern verwendet werden soll? Programmierer oder Designer? Musiker oder Läufer?
Bevor Sie mit dem Skizzieren eines Designs beginnen, vergewissern Sie sich, dass Sie genau wissen, was Sie erstellen – und für wen Sie es erstellen. Sie sollten in der Lage sein, Ihr Ziel und Ihre demografische Zielgruppe in einem einzigen, einfachen Satz zusammenzufassen: „Eine Dating-App für Reiseliebhaber.“ „Eine Studio-Mixing-App für unerfahrene Produzenten.“ „Ein Netzwerkdiagnosetool für IT-Profis.“
Für dich empfohlen:
Wenn Sie damit Schwierigkeiten haben, überlegen Sie, warum das so ist – konzentrieren Sie sich wirklich darauf, das beste Erlebnis für Ihre Benutzer zu schaffen, oder versuchen Sie nur, etwas zu entwerfen, das für Sie cool aussieht? Verlieren Sie niemals den Fokus auf Ihr Ziel.
Du sollst Schriftarten verwenden, die nicht anstößig sind
Diese Konstruktionssünde kennen wir alle. Egal ob in einer App, auf einem Briefkopf aus der Arztpraxis oder auf einer PowerPoint-Folie – wenn eine Schrift nicht dazugehört, merken wir das.
Es wurde genug über den Niedergang von Comic Sans oder Papyrus geschrieben, dass man meinen könnte, Designer mobiler Apps würden den Schriftarten, die sie in ihren Designs verwenden, etwas mehr Aufmerksamkeit schenken – aber das ist nicht immer der Fall. Und es reicht nicht aus, nur ein paar schlechte Schriftarten zu vermeiden, um Ihre App schön zu machen. Sie müssen eine Schriftart finden, die zu Ihrer App passt und die Ihre UX nicht beeinträchtigt.
„Typografie ist ein wesentlicher Bestandteil der Benutzererfahrung, daher ist es wichtig, saubere und einfache Webschriften zu verwenden“, sagt Mike Spencer, Senior UX/UI Engineer bei Pointman. „Ich bevorzuge serifenlose Schriftarten für mobile Apps, aber was wirklich zählt, ist, dass sie zu Ihrem Design passen und lesbar sind.“
Du sollst konsequent bleiben
Sie müssen Designentscheidungen treffen und sich in der gesamten App daran halten. Haben Sie nicht auf jeder Seite eine obere Navigationsleiste, bevor Sie auf einigen ausgewählten Bildschirmen abrupt zu einem ausziehbaren Seitenbereich wechseln. Verwenden Sie keine sanften Erdtöne für den Begrüßungsbildschirm und wechseln Sie nach dem Laden zu Pastelltönen. Wenn eine Schaltfläche in Ihrer App eine bestimmte Polsterung hat, sollten alle dieselbe Polsterung haben. Ihre App muss sich durchgehend einheitlich anfühlen, sonst wird sie für den Benutzer irritierend und unangenehm.
Bei der Aufrechterhaltung der Konsistenz geht es nicht nur um Ästhetik. Die von Ihnen verwendeten Designelemente vermitteln Ihrem potenziellen Benutzer auf subtile Weise etwas über Ihre App. Wenn Sie plötzlich die Regeln ändern, werden Sie sie über den Haufen werfen und verwirren.
Wenn es andere Apps gibt, die Ihrer ähnlich sind, beachten Sie, was sie designtechnisch tun. Dies zeigt Ihnen, welche Erwartungen Benutzer an Ihre App haben werden. Sie werden feststellen, dass alle Apps von Google ein einheitliches Aussehen haben – dasselbe gilt für Apple. Wenn Sie etwas für ein bestimmtes Unternehmen oder eine bestimmte Branche entwerfen, stellen Sie sicher, dass Ihre App ihrem Stil entspricht. Wenn Sie eine App für eine bestimmte Branche erstellen, sollte sie sich für diese Branche ästhetisch „richtig“ anfühlen.
Du sollst Mobil im Auge behalten
Das Design mobiler Apps ist … nun ja, mobil. Trotzdem scheinen viele Designer zu vergessen, dass Benutzer ihre Apps mit ihren Fingern (und in vielen Fällen nur mit ihren Daumen) navigieren. Während Telefone in den letzten Jahren größer geworden sind, gibt es immer noch viele Benutzer und Anwendungsfälle, die eine Einhandbedienung erfordern.
Sie sollten auch an die Umgebung denken, in der sich Ihre Benutzer befinden werden. Sie sitzen möglicherweise in einem fahrenden Fahrzeug oder tippen während des Gehens auf Schaltflächen. Wenn Sie zu viele Schaltflächen zu eng gestapelt oder einen Bildschirm mit unnötigen Designelementen überladen haben, wird Ihre App schwer verständlich und unangenehm zu bedienen sein. Ihre Benutzeroberfläche muss sauber und übersichtlich sein, damit Ihre Benutzer die gewünschte Funktion finden und mühelos die richtige Taste drücken können.
Robert Grashuis und Jason Moccia, CIO bzw. CEO von OneSpring, weisen darauf hin, wie wichtig es ist, viel negativen Raum zu verwenden, um Benutzern bei der Navigation in Ihrer App zu helfen. „Zu viel Aktivität auf einem Bildschirm lenkt die Leser ab. Verwenden Sie Leerraum mit Bedacht, um Unordnung zu vermeiden und dem Benutzer zu helfen, sich zu konzentrieren.“
Du sollst dich an den Benutzerfluss erinnern
Egal wie sauber Ihr Design ist, wenn Ihre App keinen natürlichen Fluss hat, wird sie die Benutzer nicht überzeugen. Bevor Sie sich mit dem Design mobiler Apps befassen, müssen Sie sich einige grundlegende Fragen stellen, wie zum Beispiel:
- Welchen Zweck erfüllt Ihre App für den Nutzer?
- Wie werden sie darin navigieren, um zu den Funktionen zu gelangen, die sie benötigen?
- Wie viele Seiten müssen sie analysieren?
- Wie viele Menüklicks sind erforderlich, um auf eine bestimmte Schaltfläche zuzugreifen?
- Welche Funktionen müssen am besten zugänglich sein?
Dies kann Ihnen bei Ihrem Design helfen, indem es Ihnen genau zeigt, was auf jeder Seite enthalten sein muss. Idealerweise sollte dieser Schritt erfolgen, bevor Sie mit dem Skizzieren (oder Prototyping) Ihrer App beginnen. In einem leeren Dokument oder auf einem Blatt Papier können Sie den Benutzerfluss für verschiedene Aufgaben darstellen. Wenn Sie beispielsweise eine App entwerfen, die Musikern hilft, ihre Instrumente zu stimmen, könnten Sie einen Ablauf haben, der in etwa so aussieht:
Hauptbildschirm > Instrument auswählen [Gitarre] > Stimmung auswählen [Standard] > Saite auswählen [E]
Sie können sich entscheiden, den Ablauf für allgemeine Aufgaben zu vereinfachen. Beispielsweise könnte Ihr Stimmgerät Benutzern ermöglichen, eine bestimmte Kombination aus Instrument und Stimmung auf einer Schaltfläche auf dem Hauptbildschirm zu speichern. Sobald sie ihr bevorzugtes Instrument und ihre bevorzugte Stimmung ausgewählt haben, würde der Ablauf wie folgt aussehen:
Hauptbildschirm > Gespeichertes Instrument/Stimmung > Saite auswählen [E]
Das Abbilden des Benutzerverhaltens wie dieses kann Ihnen dabei helfen, eine App zu entwerfen, die natürlich fließt. Es stellt auch sicher, dass Sie nicht vergessen, ein bestimmtes Designelement hinzuzufügen, das für den Erfolg Ihrer App entscheidend sein könnte.
Du sollst einen realistischen Prototyp erstellen
Das Entwerfen einer App – ganz zu schweigen vom Programmieren – kann ein langer, frustrierender Prozess sein. Nahezu jeder Designer oder Entwickler hat die Erfahrung gemacht, ein unglaubliches Design zu entwickeln, es zu codieren und an einen Kunden zu schicken, nur um zu erfahren, dass es einfach nicht das ist, wonach sie suchen.
Ebenso können Sie mit Jonglierskizzen nur so weit kommen. Es gibt einen ziemlich großen Unterschied zwischen etwas, das auf die Rückseite einer Serviette geätzt ist, und einem realistischen Prototyp, den Sie tatsächlich testen können. Während eine Skizze die allgemeine Idee vermitteln kann, kann ein interaktiver, realistischer Prototyp Ihren Kunden dazu bringen, aus seinem Sitz zu springen. Und selbst wenn sie davon nicht begeistert sind, wird es ein funktionierender Prototyp viel einfacher machen, Feedback zu erhalten und notwendige Änderungen vorzunehmen.
Proto.io gibt Ihnen die Möglichkeit, realistische, interaktive und ausgearbeitete Prototypen zu entwerfen, die sich wie „echte“ Apps verhalten, ohne dass Sie eine einzige Codezeile schreiben müssen. Auf diese Weise können Sie Ihrem Kunden und Ihrem QA-Team eine echte praktische Erfahrung bieten, bevor Sie zu tief eintauchen.
Apropos QA…
Du sollst testen – dann teste noch mehr
Um ehrlich zu sein, als wir anfingen, diesen Blogbeitrag zu skizzieren, waren wir versucht, 1 bis 10 „Tests“ durchzuführen – so wichtig ist QA. Das sollte offensichtlich sein – tatsächlich wird Ihnen fast jeder Entwickler oder Designer auf dem Planeten sagen, dass Tests für die Erstellung einer reibungslosen UX von entscheidender Bedeutung sind.
Und doch haben wir alle die gleiche Erfahrung gemacht, eine App herunterzuladen und völlig verblüfft darüber zu sein, wie schlecht sie läuft – vielleicht startet sie nicht richtig auf unseren Telefonen, oder vielleicht ist der Onboarding-Prozess so schrecklich, dass Sie sie sofort löschen es. Alternativ könnte es technisch gut funktionieren, aber Designelemente enthalten, die keinen Sinn ergeben, oder Text, der nicht lesbar ist.
Selbst wenn Ihre App keinen schwerwiegenden Fehler aufweist, können Benutzer unbeständig sein. Ein winziger Fehler könnte ausreichen, damit sie Ihre App nie wieder verwenden. Um dies zu vermeiden, testen Sie Ihre App während des gesamten Prozesses. Von Ihrem ersten Prototyp bis zu dem Moment, in dem Sie Ihre startbereite App zur Validierung abgeschickt haben, sollten Sie immer nach Dingen suchen, die behoben oder verbessert werden können.
Während diese 10 Regeln Sie auf dem richtigen Weg halten, geht es beim Design mobiler Apps nicht nur darum, Leitfäden zu befolgen oder Punkte von Ihrer To-do-Liste abzuhaken. Sie müssen kreativ werden – die besten Apps finden komplexe Probleme und lösen sie elegant.
[Dieser Beitrag erschien zuerst auf Proto.io und wurde mit Genehmigung reproduziert.]