Mobile UI Design – Wie kann ich ein heisses UI erstellen?

May 09
2013

Das Benutzerinterface (User Interface, kurz UI)  ist bei mobilen Applikationen definitiv einer der entscheidenden Erfolgsfaktoren. Die Benutzer sind sich einen hohen Standard gewohnt und fordern diesen – im Gegensatz zum Umgang mit Geschäftsapplikationen auf dem Desktop – auch ein.

Wie kann nun ein UI ​erstellt werden, welches die Benutzer anspricht und optimal zu einer Lösung passt. Wie bei der Frage, ob ein Musikstück letztendlich zu einem Hit wird oder nicht, gibt es keine Garantie, indem man “alles richtig” macht, auch einen Volltreffer zu landen. Trotzdem gibt es etliche harte Fakten, die berücksichtigt werden müssen, damit ein UI überhaupt das Potential zu einem solchen Volltreffer haben kann. Diese Fakten habe ich in folgende grafische Darstellung verpackt.

UI-Design
Viele mobilen Applikationen sind weit unter dem Gefrierpunkt – also schlichtweg unbrauchbar. Das liegt dann aber nicht in erster Linie am UI, deshalb heisst die Aufforderung hier: Focus! Nur wenn der Umfang und die Ziele der Applikation vollkommen klar sind und sich die Lösung wirklich darauf beschränkt, ist es möglich, ein gutes UI für eine Applikation zu erstellen.

Damit kann dann ein UI entstehen, mit dem man zwar das Richtige tun könnte, aber eben, es ist immer noch unbenutzbar. Hier heisst der nächste Schritt: Design for Mobile! Unter Beachtung der Ergonomie und er wichtigsten Layoutregeln kann damit ein UI entworfen werden, das wirklich zum mobilen Gerät passt.

Nun gibt es viele Benutzeroberflächen, mit denen man zwar arbeiten kann, die aber uneinheitlich, unprofessionell und zusammengebastelt wirken. Hier hilft Keep to the Code! (nicht nur für Piraten ;-)). Das bedeutet die konsequente Benutzung von Standard Elementen gemäss den Richtlinien, wie sie z.B. in den jeweiligen Human Interface Guidelines (z.B von Apple oder Windows) festgehalten sind.

Die Darstellung gemäss den Vorgaben reicht aber noch nicht aus. Auch das Verhalten muss für den Benutzer so sein, wie er sich das eben gewohnt ist, sonst ist die Bedienung unintuitiv und ungewohnt. Dagegen hilft Be Predictable! Das bedeutet, dass auch das Verhalten analog den Standards ist und der Benutzer zu allen seinen Aktionen auch ein entsprechendes visuelles Feedback bekommt, um festzustellen, was nun im Hintergrund passieren wird.

Damit überschreiten wir immerhin schon einmal den Gefrierpunkt, sind aber noch weit davon entfernt, ein heisses UI erstellen zu können. Die Gefahr besteht natürlich, wenn alles gemäss den Standards und Richtlinien realisiert wird, dass die Applikation dann langweilig und hässlich daher kommt. Deshalb nun die Aufforderung Stand Out! Zeig, was das Besondere bei dir ist. Hier kommt die graphische Gestaltung zum Zug, die mit dem entsprechenden Können und der Sorgfalt umgesetzt werden muss.

Schönheit ist aber nicht alles – ebenso wichtig sind Umgangsformen, sonst werden die Benutzer nicht gern damit arbeiten. Dazu gehören sorgfältige Überlegungen, wie für einen Erstbenutzer der Start aussehen soll, ohne unnötige Vorbereitungsschritte, aber mit der benötigten Unterstützung. Daneben braucht es ein besonderes Augenmerk darauf, den Benutzer in seinem Fluss nicht mit unnötigen Popups und Dialogen zu bremsen und hinauszureissen, sondern die Arbeit dezent zu unterstützen. Eben Be Polite!

Damit sind wir schon nahe an einem wirklich guten UI dran. Nun braucht es noch den Schliff für den Poweruser, da die App sonst eben nicht effizient bedienbar ist. Hier soll die Entwicklung des UI aus dem Vollen schöpfen, um z.B. mit Hilfe von Gesten effiziente Arbeitsweisen für geübte Nutzer anzubieten. Use the Force! Die Gesten müssen natürlich sehr sorgfältig gewählt werden, passend zu den Metaphern und basierend auf dem Verhalten, das sich der Benutzer von anderen Applikationen gewohnt ist.

Tja, und damit wäre nun also vieles richtig gemacht. Die Chancen, für ein wirklich gelungenes UI sind damit sicher schon sehr gut. Und wenn es dann noch gelingt, den Benutzer zu überraschen, dann ist die Ausgangslage für einen grossen Wurf sicher optimal.

Ps: Natürlich sind diese Punkte zu einem schönen Teil auch übertragbar auf andere UIs als nur für mobile Geräte!

Leave a Reply

Categories