Realismus im UI-Design ist derzeit ein heißes Thema. Jeder Design-Blog, der etwas wert ist, teilt Apple offen mit, dass er weit davon entfernt ist, dass iPad-Apps die Realität nachahmen sollten.
Schließen Sie sich uns an, während wir der Debatte etwas Leben einhauchen, indem Sie einige dieser Vorstellungen direkt angehen. Wir gehen weiter, wenn Realismus effektiv ist und wenn er destruktiv ist und wie Sie ihn in Ihren eigenen Entwürfen einsetzen können, ohne Ihre Schnittstelle zu ruinieren.
Das iPad löst eine Debatte aus
Seit der Veröffentlichung des iPad wurde viel über die Verwendung von Realismus beim Design der Benutzeroberfläche diskutiert. Apple fordert Designer dazu auf, ihren iPad-Apps eine visuelle Metapher zu geben, anstatt sie so zu gestalten, dass sie wie die typische digitale Kunst aussehen, die wir traditionell im UI-Design sehen.
Zunächst einmal mögen wir Designer nicht besonders gern Menschen, die uns sagen, wie sie unsere Arbeit erledigen sollen. Darüber hinaus sind viele mit Apples UI-Vorschlägen oder sogar der eigenen Benutzeroberflächenauswahl in Standard-iPad-Apps wie Notes und Kalender nicht ganz zufrieden.
Dies hat zu einigen strengen Warnungen der Design-Community bezüglich der Verwendung von pseudo-realistischen Schnittstellen geführt. Obwohl diese Warnungen gut beabsichtigt, gut argumentiert und legitim sind, scheint die Debatte an diesem Punkt etwas einseitig zu sein, daher möchte ich eine neue Perspektive einbringen, um die Dinge ehrlich und intelligent zu halten.
Auf den Schultern von Riesen
Die meisten heutigen Diskussionen in dieser Arena werden aus drei hervorragenden Artikeln zu diesem Thema von Kollegen bestehen, die ich sehr respektiere:
- Design für iPad: Reality Check von Oliver Reichenstein
- Realismus im UI-Design von Lukas Mathis
Das unheimliche Tal
Der am besten geeignete Titel für den Kampf, dem wir mit Realismus im Design gegenüberstehen, stammt von Francisco Inchaust in seinem Artikel von GetFinch.com. Er stellt fest, dass Masahiro Mori den Begriff "Uncanny Valley" geprägt hat. In den 70er Jahren beziehen wir uns auf einen Punkt in der Entwicklung der Robotik, wo die Maschinen den Menschen so ähnlich werden, dass wir von ihnen entsetzt oder zumindest durch ihr Aussehen unruhig werden.
Diese Idee trifft perfekt auf den Trend im UI-Design zu. Reichenstein hat in seinem Artikel ein exzellentes Beispiel: einen Screenshot aus der fürchterlich pseudo-realistischen Oberfläche von Kai's PhotoSoap.
Ist Trend-Bashing nur ein weiterer Trend?
Es ist definitiv ein Fall, in dem sich Interface-Design in derselben Richtung wiederbelebt. Als Designer jedoch anfangen, sich damit auseinanderzusetzen und andere dafür zu verprügeln, stelle ich fest, dass die Design-Community nur zögerlich ist, aus Angst vor Mobbing jegliche Art von Realismus anzuwenden. In gewisser Weise werden Twitter, Dribbble und die Blogosphäre zu einem Spielplatz und es gibt viele Kinder, die sich anpassen und das tun wollen, was cool ist, ohne jemanden zu beleidigen.
Anstatt das Kind, das sich für das Teenage Mutant Ninja Turtles T-Shirt entschieden hat, zu verprügeln, neigen wir dazu, Designer zu meckern, die Interfaces kreieren, die alles andere als Volltonfarben und einen minimalistischen Designstil verwenden.
Das Problem entsteht, wenn der Angriff auf Trends lediglich zu einem Trend wird, ohne eine genaue Analyse dessen vorzunehmen, was aus Sicht des Benutzers am besten ist und was nicht. Designer sollte kritisiert werden und Trends sollte richtig identifiziert werden, aber wir müssen sicherstellen, dass wir keine harten und schnellen Regeln erstellen, die auf Vorzug und nicht auf Logik basieren.
Was ist so schlimm am Realismus?
Die oben genannten Artikel enthalten einige beliebte UI-Designbeispiele, die mit dem Uncanny Valley flirten, was bedeutet, dass ihr Realismus tatsächlich von der Erfahrung ablenkt.
Schauen wir uns ein paar davon an, um zu sehen, ob wir die anstehenden Probleme wirklich angehen können. Die erste ist die iBooks-Schnittstelle von Apple (siehe unten).
Jetzt habe ich zugegebenermaßen schon darüber geschrieben, wie sehr ich die iBooks-Leseschnittstelle hasse. Ich denke jedoch, dass das Gleichsetzen des Problems mit dem Uncanny-Tal tatsächlich eine Fehldiagnose ist. Das Buch-Interface ist offensichtlich ziemlich "toony". und nicht so realistisch, dass es mein Gehirn misstrauisch macht. Ich starre nicht stundenlang auf diese gestapelten Seiten und denke, dass sie so echt sind, aber immer noch auf eine wichtige Weise ausgeschaltet sind, wie ich es mit der stark modifizierten Version von Jeff Bridges in Tron Legacy gemacht habe.
Was ist also wirklich das Problem hier? Das Problem ist, dass Apples süßes, kleines Interface eine vollständige Ablenkung ist, die den verfügbaren Platz sehr schlecht nutzt. Diese Falte in der Mitte der Seite macht mich nicht für Realismus begeistern, sondern ahmt nur den schlimmsten Teil des Lesens eines echten Buches nach!
Der Realismus in der iBooks-Benutzeroberfläche behindert tatsächlich den Fokus der App: Lesen. Weil sie Platz für ihre Metapher geschaffen haben, habe ich weniger Platz für meine Leseerfahrung. Dies wird offensichtlich, wenn wir die Kindle iPad-Oberfläche betrachten:
Im Vergleich zu iBooks ist dies ein Hauch frischer Luft, aber warum? Kann mein Gehirn endlich von den Qualen des Uncanny Valley befreit werden oder hat das Interface viel mehr Platz zum Atmen und gibt mehr Raum für das, was ich wirklich sehen möchte? Ich übergebe das letztere. Beachten Sie den Schieberegler am unteren Rand, der einem echten Knopf ähnelt, den Sie vor und zurück bewegen können. Das stört mich kein bisschen. Es ist sowohl attraktiv und vor allem aus meinem Weg!
Eine Effizienzgeschichte
Ich denke, das obige Beispiel zeigt deutlich, wo gute Designer mit Realismus schief gehen. Sicher, es gibt viele Interface-Designer, die in der Lage sind, etwas zu schaffen, das aus seinem eigenen Verdienst einfach hässlich ist, aber es gibt auch viele extrem talentierte Designer, die sich einfach so bei der Erstellung ihrer realistischen Benutzeroberfläche einfangen, dass sie die Benutzerfreundlichkeit vergessen. Das Streben nach Bewunderung ihrer Photoshop-Fähigkeiten lässt sie das Hauptziel einer Benutzeroberfläche aus den Augen verlieren: die Anwendung einfach und angenehm zu machen.
Um diese Idee näher zu untersuchen, werfen wir einen Blick auf ein anderes Beispiel, das von Inchauste verwendet wird: Die alte Cockpit für Mac-Benutzeroberfläche (siehe unten).
Noch einmal frage ich mich, ob das Problem wirklich der Versuch des Realismus ist oder wie sich dies auf die Effizienz der Schnittstelle auswirkt. Um ehrlich zu sein, die Glas-, Gummi- und Metallstrukturen lassen mich nicht zusammenzucken. Sicher, sie sind trendy, aber durchaus attraktiv genug.
Was mich wirklich reizt, ist die verwirrende zirkuläre Kontrolle (die inzwischen aufgegeben wurde) und all den leeren Raum um sie herum. Die Knöpfe wurden aufgrund einer realistischen Design-Metapher, die gerade ausgeführt wird, unnötig in einen winzigen, überladenen Raum gedrückt. Wie wir in iBooks gesehen haben, würde das Aufgeben dieser Metapher eine viel logischere und benutzerfreundlichere Nutzung des Raums ermöglichen.
Beginnen Sie mit Effizienz
Wie können wir Apples Idee, dass realistische Schnittstellen Spaß machen und für die Benutzer wünschenswert sind, mit dem Prinzip abwägen, dass diese Arten von Schnittstellen häufig die Nutzbarkeit beeinträchtigen?
Ein entsprechendes Beispiel gibt es direkt auf dem Startbildschirm des iPad und iPhone. Diese Schnittstelle begann auf dem ersten iPhone mit Blick auf die Effizienz. Das ursprüngliche Kernkonzept bestand einfach aus einem Raster von Symbolen auf schwarzem Hintergrund. Unten sehen Sie das Layout des Startbildschirms des iPad, um die Struktur hervorzuheben.
Zugegebenermaßen verliert das Rasterlayout seine Wirksamkeit, wenn Sie 75 Apps haben (manchmal würde ich für eine Listenansicht töten), aber für eine Handvoll gut organisierter Inhalte funktioniert es hervorragend. Designer verwenden ständig Raster für alles, von einer Miniaturgalerie bis hin zu kompletten Website-Layouts. Beachten Sie, dass wir mit einer soliden Grundlage begonnen haben, nicht mit einer einschränkenden Metapher.
Können wir hier also etwas Realismus hinzufügen, ohne unsere Nutzbarkeit zu zerstören? Können wir noch mehr Realismus hinzufügen und unsere Benutzerfreundlichkeit erhöhen? Sie wetten Sehen Sie, wie viel besser es wird, wenn wir den Symbolen Leben hinzufügen.
Beachten Sie, dass das abstrakteste, nicht realistische Symbol tatsächlich das am schwersten zu interpretierende ist. Das App Store-Symbol ist für jeden, der nicht mit dem Anwendungsordner von OS X vertraut ist, völlig verwirrend. Ihre Oma hätte wahrscheinlich keine Ahnung, was dieses Symbol bewirkt. Zeigen Sie ihr jedoch das Symbol für realistische Notizen und sie kann sofort erkennen, was die Anwendung tun soll. Lukas Mathis erforscht in seinem Artikel ähnliche Ideen bezüglich des Ikonendesigns.
Können wir den Realismus jetzt noch weiter gehen, ohne das Design zu zerstören? Was ist, wenn wir einige dieser trendigen Texturen einbringen, die Designer so sehr hassen? Das wird es sicher töten, richtig?
Um dies zu beantworten, fügen wir jetzt einen Hintergrund aus einer der Top-Ten der beliebtesten kostenpflichtigen iPad-Apps im App Store hinzu (Pimp Your Screen). Wenn es eine Möglichkeit gibt, dass Benutzer wirklich für die Erfahrung stimmen können, die ihnen am besten gefällt, ist dies mit ihren Geldbörsen.
Hier haben wir eine vertraute visuelle Metapher hinzugefügt. Ist dies die schönste Holzstruktur? Sicherlich nicht. Tatsächlich würde ich sagen, dass sich das Uncanny Valley gefährlich nähert. Und dennoch hat es unsere Nutzbarkeit nicht wirklich ruiniert, wie dies bei der iBooks-Leseschnittstelle der Fall ist. Dies ist darauf zurückzuführen, dass unsere Kernstruktur, die auf Benutzerfreundlichkeit und effizientem Layout basiert, intakt bleibt.
Interessanterweise ist alles zerstört, wenn Sie das Hintergrundbild oben anwenden und dann das iPad vertikal drehen. Die Symbole passen nicht zu den Regalen und die Metapher wird ablenkend.
Ich denke, das ist der Schlüssel, um realistische Schnittstellen richtig abzubilden. Probleme treten auf, wenn Designer mit trendigen Metaphern beginnen und das Ergebnis ist eine Benutzeroberfläche, die sowohl ineffizient als auch ineffektiv ist. Die Usability wird im Namen hübscher Bilder geopfert. Wenn Sie jedoch mit einem einfachen und soliden Fundament beginnen, das auf Benutzerfreundlichkeit ausgerichtet ist, können Sie allmählich Stil hinzufügen. Denken Sie daran, dass Sie immer noch jede Änderung beurteilen und entscheiden müssen, ob sich die Änderung verbessert, verringert oder in Bezug auf die Benutzerfreundlichkeit neutral war.
Der Test
Ein guter Test für Ihre Schnittstellen ist, ob Sie die Metapher entfernen können und das Layout trotzdem sinnvoll ist. Wenn Sie beispielsweise die Flusen aus der iBooks-Benutzeroberfläche entfernen, bleiben Ihnen unbequeme Absätze, die den verfügbaren Platz offensichtlich nicht besonders gut nutzen. Dies liegt daran, dass die Seitenfalte in der Mitte das Layout durcheinander gebracht hat.
Stellen Sie sich nun vor, Sie hätten die unten abgebildete Hitliste genommen und jegliche Ähnlichkeit mit Notizpapier oder dreidimensionalen Registerkarten entfernt. Wäre das Layout noch sinnvoll? Die Antwort lautet "perfekt". Der Designer hier hat eine starke, vertraute Struktur, die so gestaltet wurde, dass sie attraktiver wird. Dies unterscheidet sich sehr von einer Schnittstelle, die unbeholfen strukturiert ist, um mit einer vorgefertigten visuellen Idee mitzuwirken.
Ist Realismus nur für Designer?
In der bisherigen Diskussion wurde die Idee angesprochen, dass Realismus vorhanden sein kann, ohne die Nutzbarkeit zu beeinträchtigen. In den Händen von jemandem mit echtem Talent kann er diese sogar verbessern. Es gibt jedoch noch einen weiteren wichtigen Aspekt dieser Debatte, der nicht angesprochen wird: Wollen die Nutzer das?
Die derzeitige Schlussfolgerung in dieser Debatte ist, dass die realistischen Schnittstellen vieler iPad-Apps aus Eye-Candy bestehen, die von Designern für Designer erstellt wurden. Normalerweise kümmern sich normale Benutzer nach diesem Argument nicht um diese verfestigten Pixel und möchten nur eine bestimmte Aufgabe ausführen.
Ich glaube, dieses Argument ist weit weg von der Basis. Erstens geben Sie durchschnittlichen Leuten nicht genug Kredit. Nur weil jemand kein Designer ist, heißt das nicht, dass er attraktives Design nicht schätzen kann. Ich bin kein Maler, aber ich habe die Kunstgeschichte an der Universität sehr genossen.
Zu oft höre ich, wie Designer die Öffentlichkeit verfolgen, als Menschen, die "gutes Design" nicht schätzen. Wenn das wahr wäre, wären wir arbeitslos! Viele Menschen erkennen und schätzen attraktives Design und stellen uns ein, weil sie wissen, was sie selbst produzieren können, oder?
Zweitens finde ich das für jeden? Normale Person? Wer eine trendige, realistische Oberfläche mag, kann zehn Designer finden, die es hassen. Picky-Designer sind die Leute, die Apples Kalender-App kritisieren. Der Rest der Welt kauft iPads wie Süßigkeiten auf, zum Teil aufgrund der ordentlichen Schnittstellen, die sie in den Werbespots sehen.
Designer wie wir diskutieren stundenlang über die Vor- und Nachteile von Realismus im UI-Design. In der Zwischenzeit sitzt Penultimate auf Platz vier für kostenpflichtige Downloads. Diese App verwendet eine realistische Notebook-Oberfläche, um ein echtes Schreiberlebnis nachzuahmen, und die Benutzer können nicht genug davon bekommen.
Bin ich als Designer von dem Realismus in der vorletzten Schnittstelle beeindruckt? Nicht aus der Ferne In der Tat mag ich nicht, wie die App aussieht. Ihr durchschnittlicher iPad-Besitzer hält es jedoch für großartig.
Mein Punkt ist, das populäre Argument hat es rückwärts. Effektiver Realismus im UI-Design ist nicht nur ein sabbernauchendes Dribbble-Futtermittel, es ist etwas, das die Benutzer zu schätzen wissen und bereit sind, eine Prämie zu zahlen, die sie erhalten können.
Fazit
Wird Realismus im UI-Design missbraucht? Sie wetten Sind realistische iPad-Schnittstellen ein Trend, der bestehen bleibt? Absolut. Sind sie für alle da? Absolut nicht. Minimal-Apps wie iA Writer verkaufen sich oft wie heiße Kuchen, weil sie den Realismus zugunsten der reinen Effizienz aufgeben.
Der Punkt, den ich in diesem Artikel erwähne, ist der? Realismus? ist nicht das schmutzige Wort, das Designer derzeit ausmachen. Als Designer sollten Sie nicht auf eine wirklich großartige Interface-Idee verzichten, da Sie befürchten, dass die Uncanny Valley-Polizei Sie kommen wird. Sie sollten auf jeden Fall auf dieses Prinzip achten. Beachten Sie, dass selbst Apples Interfaces absichtlich weit weg vom Fotorealismus scheuen. Sie sollten jedoch keine Angst haben, dass ein wenig Textur die Nutzer dazu bringt, Ihre App zu hassen.
Erfolgreiche UI-Designer wissen, dass eine solide, nutzbare Basis die Grundlage für jede gut gestaltete Anwendung ist. Wie viel zusätzliches Styling Sie anwenden, hängt von Ihrer Zielgruppe ab und davon, ob sie das Design oder den Kontext der Anwendung als hilfreich oder hinderlich empfinden wird.
Stellen Sie sich folgende Fragen: Ist meine Metapher in dieser Umgebung sinnvoll? Bleibt das Layout stark, wenn die Metapher weggenommen wird? Wende ich Realismus an, um die Akzeptanz und Benutzerfreundlichkeit der App zu verbessern, oder weil ich dazu neige, Trends zu folgen? Neigt meine Zielgruppe dazu, ähnliche Ideen zu lieben oder zu hassen?
Hinterlasse einen Kommentar und lass uns wissen, was du darüber denkst, ob es einen richtigen und einen falschen Weg gibt, um an eine realistische Schnittstelle heranzukommen. Wie beurteilen Sie, wann Realismus wirksam ist und wann die Integrität eines Entwurfs beschädigt wird?