Visuelle Designs für iOS

Aus den vorangegangenen Artikeln lässt sich bereits festhalten: der Entwicklungsprozess einer App ist stets an die Ausrichtung auf verschiedene Endgeräte gebunden. Das Betriebssystem iOS stammt aus dem Hause Apple und läuft ausschließlich auf den Mobilgeräten iPhone und iPad. Da neben der reinen Funktionalität natürlich auch das ästhetische Erleben zu den ausschlaggebenden Aspekten einer erfolgreichen User Experience zählt, sollen in diesem Artikel die wichtigsten Schritte in Richtung visuelles Design beleuchtet werden.

Die Grundlage: das Layout

Die Grundlage für eine marktreife App bildet auch beim Betriebssystem iOS die Funktionalität auf allen Endgeräten und Bildschirmgrößen. Über Auto Layout, also einem Entwicklungstool zur Konstruktion adaptiver Interfaces, lassen sich vorab individuelle Designregeln festlegen. Diese werden in einem weiteren Schritt automatisch auf den geänderten Screen übertragen. Ganz abgesehen von den verschiedenen Bildschirmgrößen gilt es auch den Wechsel zwischen Porträt- oder Pivot-Modus und Landschafts-Modus einzukalkulieren. Auf diese Weise können das konsistente Design und die visuelle Gewichtung des Contents stets beibehalten werden.

Bei der Anpassung an die verschiedenen Screens sollte schrittweise vorgegangen werden

Das geeignete Farbspektrum finden

Was visuelle Designs für eine iOS-Anwendung angeht, sind Farben das essentielle Kommunikationstool. Eine durchdachte Balance an verschiedenen Tönen ermöglicht es dabei, die Gewichtung des Contents zu untermalen. Ein bekanntes Beispiel ist das rote Warndreieck, welches auf ein Problem verweist, das möglichst schnell behoben werden sollte.

Generell lässt sich mit der Verwendung von Komplementärfarben ein sehr stimmiges Endergebnis erzielen. Diese sollten natürlich auf das Markenlogo abgestimmt sein und sich auf ein Minimum an Farbvarianten beschränken. Besonders für die Benutzerführung können spezifische Töne für aktive und nicht-aktive Elemente unterstützend und eventuell als Anhaltspunkt für die Entwicklung des Interfaces hilfreich sein. Zusätzlich empfiehlt es sich, immer zwei Designvarianten zu erstellen: sowohl für den Light Mode, als auch für den Dark Mode.

Der Aspekt Licht spielt eine entscheidende Rolle in Sachen visuelles Design für iOS, denn eine App sollte zu jeder Uhrzeit des Tages benutzbar sein. Unsicherheiten lassen sich an dieser Stelle durch Usability Testings umgehen. Und auch der kulturelle Aspekt sollte, sofern die App für den globalen Markt entwickelt wird, nicht außer Acht gelassen werden. David McCandless hat diese Farbsymbolik in seinem Projekt „Information is beautiful“ zum Hauptthema gemacht und die Bedeutung innerhalb verschiedener Kulturen grafisch dargestellt. Eine Matrix, die nicht nur ein optisches Highlight, sondern auch informativ ist.

Wer sich nun im Urwald der Farbtöne verloren fühlt, kann natürlich auch auf die System Colours von Apple zurückgreifen. Auf diese Weise werden ausreichende Kontraste und eine reduzierte Transparenz der verschiedenen Ebenen innerhalb des Interface Designs sichergestellt. Die Dynamic System Colours bieten wiederum eine Erweiterung der klassischen Systemfarben und sind speziell auf den Dark und Light Mode ausgerichtet.

Komplementärfarben sprechen visuell an und sorgen für Überraschungen

Minimalistische Schriftarten für lesbare Inhalte

Ähnlich wie in puncto Farben stellt Apple den Entwickler*innen natürlich auch vorgefertigte Schriftarten zur Verfügung. Wie wir bereits im Einführungsartikel festgestellt haben, sollte der Schwerpunkt der Designs, welche spezifisch für das Betriebssystem iOS entwickelt werden, auf Minimalismus liegen. Dementsprechend reduziert sind auch die Apple-Fonts, was selbstverständlich auch die Lesbarkeit des Contents erhöht.

Die Schriftart San Francisco für die Gruppe sans Serif sowie New York für die Gruppe Serif sind schlicht und elegant. Ein großer Vorteil dieser Typefaces liegt dabei in der Anwendbarkeit in verschiedenen Stilen und Sprachen. Zusätzlich vereinfachen die dynamischen Größen der Buchstaben die Ausrichtung der App auf unterschiedliche Bildschirmgrößen und Endgeräte.

Im Grunde genommen ist der simpelste Weg in Sachen Content-Koordination die Verwendung von Texteditoren. Diese verhelfen den Entwickler*innen, relevante Inhalte zu priorisieren und weniger relevante Abschnitte in den Hintergrund zu stellen. Eine zusätzliche Unterstützung der Benutzerführung lässt sich durch eine möglichst minimale Nummer an unterschiedlichen Schriftarten sowie modifizierten Abständen zwischen den Texten herbeiführen. Schließlich ist die Lesbarkeit der Inhalte ausschlaggebend für die finale User Experience.

Visuelle Designs in iOS umsetzen

Die Ausrichtung einer Anwendung gemäß den Anforderungen von iOS ist alles andere als ein steiniger Weg. Mithilfe vorgefertigter Richtlinien nimmt Apple Entwickler*innen an die Hand und stattet sie teilweise sogar mit Farbspektren und Fonts aus. Die künstlerische Freiheit des Einzelnen wird dabei natürlich nicht in den Hintergrund gestellt. Schließlich soll die App weiterhin den individuellen Charakter der kreativen Köpfe hinter dem Konzept widerspiegeln. Und falls dennoch einmal Not am Mann ist: die Human Interface Guidelines können höchstwahrscheinlich Abhilfe schaffen.