App-Design: So gestalten Sie mobile Anwendungen
Letzte Aktualisierung am 9 Februar 2023 um 10:00 am
5,00/5Mehr als ein Jahrzehnt nach der Einführung der ersten Smartphones sind mobile Anwendungen für die meisten von uns alltäglich geworden. Das Überraschungs- und Innovationselement ist zwar größtenteils weg, aber eine eigene mobile Anwendung zu haben, ist ein ernsthafter Vorteil, wenn man dem Nutzer eine Dienstleistung oder Inhalte mitgeben will.
Wenn Sie Ihre eigene App gestalten wollen, sollten Sie bei der Entwicklung einer Anwendung heute eine Reihe von bewährten Verfahren beachten, die sich durch die Anwendung neuer Konzepte herausgebildet haben. Ob Navigationslogik, visueller Komfort oder auch mentale Belastung, all diese Aspekte haben einen erheblichen Einfluss auf die Nutzung Ihrer Anwendungen und die Zufriedenheit Ihrer Anwender. Wenn wir zum Beispiel wissen, dass 2017 21% der Nutzer zwischen 20 und 30 Jahren eine Anwendung von ihrem mobilen Gerät gelöscht haben, weil ihnen das Logo nicht gefiel, wird klar, dass nichts dem Zufall überlassen werden sollte.
Warum eine mobile Anwendung anbieten?
Warum eine mobile Anwendung und nicht gleich eine Website erstellen? Vor allem da Websites sich mittlerweile einfach an mobile Geräte anpassen lassen, ist der Gedanke legitim.
In diesem Fall sind die beiden Ansätze allerdings komplementär. Hier geht es nicht um Technik, sondern um Ergonomie und Grafikdesign. Diese Elemente haben nichts mit der Technologie zu tun, die Sie verwenden werden, da sich die aktuellen Anwendungen und Websites immer mehr ähneln. Im Gegenteil, beides sollte eine Quelle der Inspiration für Sie sein. Es gibt überall etwas Gutes mitzunehmen und es ist wichtig, offen für neue Vorschläge zu bleiben und Trends zu beobachten.
Konzentrieren Sie sich auf das, was wichtig ist
Absolut jeder Aspekt Ihrer Anwendung ist wichtig. Einige haben jedoch Vorrang vor anderen und einige Grundregeln sollten beachtet werden. Hier sind die Wichtigsten:
Geben Sie der Ergonomie Vorrang vor der grafischen Gestaltung
Ihr Benutzer wird Ihre Anwendung mit einem Ziel vor Augen herunterladen. Er möchte etwas erreichen oder bestimmte Informationen erhalten: Es ist daher wichtig, dass die Erreichung dieses Ziels so einfach und direkt wie möglich ist.
In erster Linie sollten Ihre Inhalte jederzeit lesbar sein: Sie können dies sicherstellen, indem Sie den Kontrast der Elemente anpassen und die Menge der zu lesenden Schaltflächen oder Texte reduzieren.
Die Ergonomie kann in zwei Kategorien unterteilt werden: User Experience (UX) und User Interface (UI).
Das Erlebnis einfach machen
Laden Sie eine neue Anwendung herunter, registrieren Sie sich und verwenden Sie sie. Schreiben Sie nach 10 Minuten auf, was Ihnen daran gefallen und nicht gefallen hat. Wichtige Aspekte sind wiederkehrende Elemente.
- War die Registrierung einfach?
- Haben Sie schnell verstanden, wie Sie die App navigieren können?
- War es einfach, bestimmte Inhalte zu finden?
- Ist es möglich, attraktive Inhalte zu teilen? Wie ist das möglich?
Die meisten Anwendungen konzentrieren sich auf das Senden und Weitergeben von Informationen. Andere ziehen es vor, sich auf das Erstellen oder Konsumieren von Inhalten zu konzentrieren. So oder so, der Login, das Durchsuchen und die gemeinsame Nutzung sind praktisch unvermeidlich, und Sie müssen das Beste daraus machen.
- Lassen Sie den User soziale Netzwerke verwenden, um ein Konto zu erstellen, oder erlauben Sie es, die App ohne Anmeldung zu nutzen.
- Die Integration einer Suchleiste mit dynamischen Vorschlägen ist ein deutliches Plus.
- Wenn Sie aufdringliche Benachrichtigungen einschränken und ein flexibles System zu deren Konfiguration anbieten, können Sie nur dazu beitragen, dass Sie etwas länger in den Telefonen Ihrer Benutzer bleiben.
All diese Elemente sind Teil der User Experience (UX). Einige Anwendungen integrieren sie sehr gut.
- Xbox Game Pass bietet eine vollständige und grafische Oberfläche, in der alles am richtigen Platz ist.
- Microsoft Outlook verfügt über einen hellen und einen dunklen Modus sowie über eine sehr gut an Android angepasste UX.
- Skype ist ein Kommunikationstool, das den Übergang vom Büro zum Handy sehr gut gemeistert hat, indem es die wesentlichen Elemente für den Nutzer übernommen hat.
Die Schnittstellen beleuchten
Der Bildschirm Ihres Benutzers ist sehr klein, selbst bei den größten Smartphones auf dem Markt. Sie müssen also den Platz intelligent nutzen und die angezeigten Elemente je nach Kontext ändern. In diesem Fall ist es ratsam, die Schnittstelle Ihrer Anwendung unter Berücksichtigung der folgenden Praktiken zu überdenken.
- Verwenden Sie weniger Text und mehr Symbole zur Navigation, das macht die Oberfläche übersichtlicher und erspart Ihnen die Übersetzung in verschiedene Sprachen.
- Wählen Sie lesbare Schriftarten und recherchieren Sie je nach Kontext die Verwendung bestimmter Schreibweisen. Dieser Artikel stellt die besten Praktiken vor, die man über Grafikdesign wissen sollte.
- Vorsicht vor Kontrasten! Wenn Ihr Inhalt aufgrund von Farbproblemen zwischen dem Hintergrund und dem Text nicht lesbar ist, könnten Sie Benutzer verlieren. Mit diesem Werkzeug können Sie sichergehen, dass das Problem nicht auftritt.
- Verwenden Sie einen einheitlichen visuellen Stil, indem Sie ein flaches, materielles oder fließendes Design verwenden.
Einige Anwendungen haben diese Praktiken sehr gut übernommen und heben sich auf Handys und Tablets von der Masse ab.
- Asana, eine Projektmanagement-Anwendung, profitiert von einer sehr gelungenen und konsequenten Integration von Flat Design.
- Facebook verwendet Text nur für Benutzerbeiträge und an bestimmten Stellen auf den Seiten. Die Navigation erfolgt ausschließlich über Icons.
- Spotify hat sich für einen schlichten schwarzen Hintergrund mit weißem Text entschieden, um die Lesbarkeit des Inhalts zu maximieren.
- Netflix bietet eine mehrstufige Navigation zwischen der Startseite und der Serienwiedergabe, sodass der Benutzer nicht zu sehr unter der mentalen Belastung leidet.
Wie Sie Ihr App-Design erstellen
Die Arbeit eines Ergonomen oder Grafikers ist nicht immer die Gleiche. Es ist notwendig, einen kreativen Prozess zu respektieren, den sich jeder anders aneignet. Wenn auch die Empfindlichkeiten unterschiedlich sind, so ist doch die methodische Herangehensweise an die Arbeit oft die gleiche.
Erstellen eines ersten Modells
Das Mock-up ist ein unverzichtbares Werkzeug, mit dem der Weg des Benutzers und der Inhalt jedes Bildschirms abgebildet werden kann. Natürlich müssen Sie Ihre User Journey und den Inhalt Ihrer Bildschirme im Laufe der Zeit iterieren, testen und verbessern.
Beim Erstellen eines Mock-ups können Sie sich natürlich auf Software verlassen, um den Prozess zu vereinfachen und nicht alles von Hand oder in Photoshop zu zeichnen. Adobe XD ist eine interessante Alternative, obwohl viele Spezialisten Figma bevorzugen werden. Für einen ersten Ansatz ist Adobe XD jedoch durchaus zufriedenstellend und ausreichend.
Erstellen Sie eine visuelle Identität
Ein Logo, Farben, Typografie und inhaltliche Struktur bilden die Basis jeder visuellen Identität. Unabhängig vom Produkt oder der Dienstleistung vermittelt eine visuelle Identität Werte und Emotionen. Hier kommt es auf die Details an, denn eine einfache Farbänderung kann die Wahrnehmung Ihrer Nutzer erheblich verändern.
Daher müssen Sie Ihre Kernwerte mit Schlüsselwörtern versehen und Formen und Farben mit ihnen assoziieren. Durch die Verwendung der zuvor erwähnten Designphilosophien können Sie die Konsistenz der Identität Ihrer Anwendung sicherstellen.
Schnelles Prototyping
Im Gegensatz zu einem groben Mock-up muss ein Prototyp nutzbar sein, auch wenn der Inhalt nur ein Dummy ist. Dieser übernimmt auch die gewählte Bildsprache und spiegelt die endgültige Vision Ihres Produkts wider. Sie sollten einen ersten Prototypen möglichst schnell erstellen, um Feedback von Ihren Benutzern zu sammeln, das Ihnen hilft, Ihre Anwendung zu verbessern.
Vor dem Start der offiziellen Version können Sie einen begrenzten Kreis von Anwendern einladen, eine erweiterte Version Ihrer in Entwicklung befindlichen Anwendung zu testen. Feedback ist in dieser Phase wertvoll und hilft, große Überraschungen bei der Veröffentlichung zu vermeiden.
Anonymes Sammeln von Daten
Mit der Zustimmung Ihrer Benutzer können Sie anonym Daten darüber sammeln, welche Seiten sie am häufigsten aufrufen, wie viel Zeit sie auf diesen verbringen und wie schnell die Navigation insgesamt ist. Ein Tool wie Google Analytics kann Ihnen hier helfen, herauszufinden, an welchen Seiten Sie noch etwas anpassen müssen. Auf diese Weise wissen Sie, worauf Sie Ihre Arbeit konzentrieren müssen.
Bringen Sie Ihre Anwendung ins Rollen!
Das Erstellen einer mobilen Anwendung kann Zeit in Anspruch nehmen, aber die Mühe lohnt sich. Durch Apps sind Sie häufiger in Kontakt mit Ihren Nutzern und können eine besondere Beziehung zu ihnen aufbauen. Versuchen Sie, Feedback von Ihren Kunden zu erhalten, und überprüfen Sie fortlaufend die gesamte Navigation. Dadurch können Sie Bereiche finden, die verbessert werden können, und solche, die gut funktionieren. Darüber hinaus können wir Ihnen nur raten, mit einer auf die Entwicklung mobiler Anwendungen spezialisierten Agentur zusammenzuarbeiten, um Ihr Projekt möglichst schnell und professionell zu realisieren.
