Chroma Experience

Design vereinfachen

Unternehmen sind bestrebt, einfache und nutzungsfreundliche Produkte zu kreieren. Mehr Funktionen, neue Technologien, erweiterte Möglichkeiten, aber immer noch in einem leichten und einfach zu bedienenden Format. Dabei ist das Vereinfachen das Schwierigste.

Blaues Visual auf schwarzem Untergrund

Was ist „Einfachheit“?

Wir können „einfach“ definieren - als etwas, das leicht zu verstehen oder zu tun ist; das keine Schwierigkeit darstellt. Einfachheit ist etwas Subjektives. Dinge, die für eine Person einfach erscheinen, werden von einer anderen nicht identisch wahrgenommen. Im Allgemeinen bilden wir unsere persönliche Meinung darüber, ob ein Prozess einfach oder komplex ist, in drei schnellen Schritten:

Fragen, die man sich stellen sollte, um Einfachheit zu erreichen

Die Beseitigung von Hürden auf dem Weg des Anwendenden zu seinem Ziel - wird dabei helfen, sich in Richtung Einfachheit zu bewegen. In „The Laws of Simplicity“ (Die Gesetze der Einfachheit) beschreibt John Maeda zehn Gesetze für das Gleichgewicht zwischen Einfachheit und Komplexität in Wirtschaft, Technologie und Design - Richtlinien, um weniger zu brauchen und tatsächlich mehr zu bekommen.

Maßnahmen für ein vereinfachtes Design

Die Gesetze der Einfachheit, John Maeda: http://lawsofsimplicity.com/
Maeda - ein Professor im Media Lab des MIT und ein weltbekannter Grafikdesigner - geht der Frage nach, wie wir den Begriff „optimiert“ neu definieren können.

Was ist mit Komplexität?

Wenn wir über Einfachheit sprechen, müssen wir auch die andere Seite des Spektrums erwähnen. Wie Einfachheit ist das Empfinden von Komplexität subjektiv. Mit entsprechendem Training ist sogar Raketenwissenschaft nicht so schwer. Aber es gibt einige Faktoren, die dazu führen, selbst die einfachste Aufgabe zu verkomplizieren. Diese sollten im Produktdesign so gut wie möglich vermieden werden:

No Gos für barrierefreies, vereinfachtes Design

Wie lässt sich Einfachheit auf Produktdesign anwenden?

1. Produkte mit klarem Nutzen

Es gibt eine Menge Software, die versucht, zu viel für zu viele Zielgruppen gleichzeitig zu tun. Der Versuch, ein Schweizer Taschenmesser der Branche zu sein. Wenn ein Produkt einfach sein soll, muss der Kernnutzen definiert und identifiziert werden, der für den Erfolg des Produktes essentiell ist.

Produkte mit klarem Fokus

2. Entferne alles Unnötige

Der einfachste Weg, Einfachheit zu erreichen, ist die durchdachte Reduktion. Im Zweifelsfall entfernen. Sekundäre Informationen, nicht häufig verwendete Bedienelemente und ablenkende Auszeichnungen. Weg damit. Sobald man beginnt, dieses Prinzip anzuwenden, werden die Ergebnisse sofort sichtbar.

Es gibt eine Menge Software, die versucht, zu viel für zu viele Zielgruppen gleichzeitig zu tun. Der Versuch, ein Schweizer Taschenmesser der Branche zu sein. Wenn ein Produkt einfach sein soll, muss der Kernnutzen definiert und identifiziert werden, der für den Erfolg des Produktes essentiell ist.

Reduziertes Design ohne Unnötiges

3. Daten gehören in eine sinnvolle Form

Ein Großteil der Produkte, die täglich entworfen werden, konzentriert sich auf eine Menge Daten, die man sinnvoll nutzen soll, um seine täglichen Aufgaben effizient zu erledigen. Wenn man weiß, dass Anwender:innen an Entwicklungen und Veränderungen interessiert sind, sollte man sie mit einer visuellen Darstellung statt mit einem Haufen Zahlen unterstützen. Bei Bedarf können diese durch zusätzliche Informationen ergänzt werden. Das Ziel sollte sein, zweckdienliche Daten zu extrahieren und sie den Anwender:innen vor Augen zu führen.

Daten in anschauliche Formate übersetzen und interpretierbar machen

4. Unterstützung für eine schnelle Entscheidungsfindung

Anwender:innen, die mit Auswahlmöglichkeiten überflutet werden, müssen sich Zeit nehmen, um richtig zu interpretieren und Entscheidungen zu treffen. Das sorgt für Ineffizienz. Diese Situation wird in Hick's Law erklärt. Es besagt, dass die Zeit und der Aufwand für eine Entscheidung mit der Anzahl an Optionen zunimmt. Möchte man im Sinne einer guten User Experience eine intuitive Nutzung realisieren, muss eine schnelle Entscheidungsfindung berücksichtigt werden. Um das gewährleisten zu können sollte man, wann immer möglich, darauf verzichten Anwender:innen wählen zu lassen. Viel mehr sollte man ihnen Hilfestellung leisten, sich durch die Anwendung zu navigieren.

Grafisch: Zu viele Optionen verzögern das Treffen von Entscheidungen

5. Zu viele Auswahlmöglichkeiten schrecken Kunden ab

Forschungen in der Psychologie bestätigen die positiven und motivierenden Wirkungen von individuellen Auswahlmöglichkeiten. Diese Erkenntnisse haben zu der weit verbreiteten Vorstellung geführt: Je mehr Auswahl, desto besser. Doch in Wirklichkeit beweist die Forschung das Gegenteil.
Das „Jam-Experiment“ ist eines der berühmtesten Experimente der Verbraucherpsychologie. Demnach kann es gut für den Absatz sein, Verbrauchern weniger Auswahl zu bieten. Kritisch betrachtet zeigt die Studie, wann genau das Anbieten von weniger Auswahl den Umsatz steigern kann.

Vergleich: Zu viele Optionen wirken abschreckend

Dieses Experiment beweist, dass Kunden, denen weniger Auswahlmöglichkeiten präsentiert werden, zehnmal wahrscheinlicher einen Kauf tätigen, als solche, denen viele Auswahlmöglichkeiten gezeigt werden. Es wurde als entscheidendes Beispiel für das Überangebot mit Auswahlmöglichkeiten herangezogen, d.h. für die Idee, dass die Präsentation zu vieler Auswahlmöglichkeiten den Kauf von Kunden tatsächlich verhindert.

Vergleich: Zu viele Optionen wirken abschreckend

6. Klare Empfehlungen, wenn mehrere Auswahlmöglichkeiten präsentiert werden

Wenn Auswahlmöglichkeiten nicht vermieden werden können, sollte man versuchen, sie zu begrenzen. Hierzu eignet sich ein Hinweis, eine Empfehlung oder das Teilen einer Statistik darüber, was von anderen Kunden am bevorzugt wird. Wichtig ist, klar und deutlich zu kommunizieren, was der Hauptunterschied zwischen den angebotenen Optionen ist. Dieser Ansatz wird häufig auf Seiten mit Preisplänen verwendet.

Empfehlungen optisch hervorheben

7. Aufmerksamkeit auf die wichtigen Bereiche lenken

Eine Customer Journey zu verstehen, bedeutet die Ziele zu kennen und zu wissen welche Etappen innerhalb dieser Journey existieren. Manche dieser Etappen sind relevanter als andere. Es geht dabei darum, die Schlüsselbereiche zu finden und die Aufmerksamkeit auf diese zu lenken.

Aufmerksamkeit der Nutzer lenken

8. Farbe und Typografie, um eine Hierarchie von Inhalten zu kommunizieren

Wie oft hat man schon gehört: „User:innen lesen nicht“. Und es stimmt. Wir sind sehr wählerisch mit dem, was wir uns tatsächlich merken und wo wir in der Tiefe einsteigen. Wenn man jemals umfangreiche Nutzungsbedingungen akzeptiert hat, ohne ein Wort zu lesen, dann weiß man, was damit gemeint ist.

Es gibt eine Menge Merkmale, die beeinflussen können, was und wie Text kommuniziert: Schriftart und Schriftschnitt, Größe, Kerning, Zeilenabstand, Großschreibung und Farbe. Diese Merkmale sollte man nutzen, um die Hierarchie des Inhalts zu kommunizieren. Mit dem richtigen Einsatz von Farbe und Typografie sorgt man für bessere Erkennbarkeit, Attraktivität und macht Inhalte einprägsamer.

Farbe und Typografie nutzen, um die Hierarchie der Inhalte zu kommunizieren

9. Ordnung hilft dabei, viel nach wenig und das zusätzlich übersichtlicher aussehen zu lassen

Ein simpler Test. In der Abbildung unten sind zwei Darstellungsformen. Nun misst man mit einer Stoppuhr, wie viel Zeit (und Mühe) man braucht, um die Anzahl der schwarzen Punkte in jedem Quadrat zu zählen.

Vergleich: Saubere Anordnung der Elemente vermittelt bessere Handhabbarkeit

Fertig? Wie wahrscheinlich festgestellt, hat das Zählen der unorganisierten Darstellung von Punkten wesentlich mehr Zeit in Anspruch genommen und darüber hinaus kognitiv stärker belastet. Warum aber hat man dieses Ergebnis, wenn die Flächen eine identische Anzahl von Punkten haben?

Die Zuordnung der Punkte zu einem bestimmten Raster hilft uns, sie visuell zu erfassen und beim Zählen zu gruppieren. Während wir bei der unorganisierten Darstellungsform von Punkt zu Punkt wandern und sie einzeln zählen müssen.

Vergleich: Task-Journey wie Zeilen statt kreuz und quer abbilden

Das Aufräumen von Elementen verbessert nicht nur die Erkennbarkeit, sondern macht es auch einfacher, sich diese zu merken. Wenn man eine Maschine bedient, ist es sehr wichtig, sich die Position und Funktion aller Bedienelemente zu merken.

Eine weiterer Test. Gerade erst wurden die Punkte in den zwei Abbildungen gezählt. Wenn man sich jetzt an die Positionen jedes einzelnen Punktes erinnern möchte, stellt man fest, dass es nahezu unmöglich ist, sich an die unorganisierte Struktur zu erinnern.

Vergleich: Elemente in sinnvoll angelegter Reihenfolge wirken ordentlicher

10. Zusammengehörige Inhalte gruppieren

Oft ist es eine zielführende Maßnahme mit der Gruppierung von Komponenten zu beginnen, um eine komplexe Bedienoberfläche zu vereinfachen. Im Ergebnis haben es die Anwender:innen mit wenigen Gruppen zu tun und nicht mit einer Vielzahl von nicht zusammenhängenden Komponenten. Das Hinzufügen von Separatoren (Erstellung zugehöriger Bereiche) um ein Element oder eine Gruppe von Elementen ist eine einfache Möglichkeit, eine Trennung von den umgebenden Elementen zu schaffen. In der Gestaltpsychologie gibt es mehrere Prinzipien der Gruppierung, die dazu beitragen, dass sich Elemente zusammengehörig fühlen: Nähe, Ähnlichkeit, Kontinuität, Geschlossenheit und Verbundenheit.

Content in sinnvollen Gruppierungen

11. Große Aufgaben in kleinere Schritte aufteilen / Einspaltigkeit evaluieren

Verschiedene Arten von Formularen sind wesentlicher Bestandteil vieler Anwendungen. Sie sind eine Möglichkeit, Daten zu erfassen. Manchmal sind diese selbst nach dem abwählen aller optionalen Angaben unnötig umfangreich. Solche Formulare können in der Nutzung sehr demotivierend sein und zum frühzeitigen Absprung führen. Dieser Situation kann man entgegen wirken, indem man eine umfangreichen Task in eine Reihe kleinerer Tasks aufteilt. Im Resultat scheint es viel einfacher zu sein, diesen Prozess bis zum Ende auszuführen. Das Beenden kleiner Teilaufgaben gibt Anwender:innen eine Portion Endorphine und Zufriedenheit, um weiterzumachen.

Bei der Gestaltung von Formularen sollte man versuchen ein einspaltiges Layout anstelle mehrerer Spalten zu nutzen. Ein einspaltiges Layout ist deutlich einfacher auszufüllen. Auf diese Weise müssen Anwender:innen nicht überlegen, was sie als Nächstes ausfüllen müssen, sondern navigieren sich in gelernter Manier von oben nach unten.

One Column Layout für Aufspaltung umfangreicher Vorgänge

12. Transparenz in der Kommunikation des Prozesses und des Systemstatus

Ungewissheit verunsichert uns und sollte so weit wie möglich vermieden werden. Deshalb sollte man innerhalb einer Anwendung zu jeder Zeit, sofern es nicht offensichtlich ist, sehen können, wo man sich im Prozess befindet, woher man kommt und was als Nächstes kommt. Eine Zusammenfassung der zuvor bereitgestellten Informationen ist ebenfalls eine gute Idee, da sie das Gedächtnis der Anwender:innen weniger belastet und sie nicht mehr zurückgehen müssen, um die vorherigen Schritte zu überprüfen.

Kommunizieren des Fortschritts während eines Prozesses

13. Kopfrechnen vermeiden

Das menschliche Gehirn ist (meistens) schlecht im Umgang mit rohen Zahlen. Die Evolution hat dazu geführt, dass wir Objekte gut erfassen und zuordnen können, jedoch weniger gut darin sind, arithmetische Vorgänge durchzuführen. Diese Erkenntnis sollte man nutzen, um alle Berechnungen für die Anwender:innen durchzuführen.

Rechnungen für User vorgenommen

14. Komplexität mit „Progressive Disclosure“ verbergen

Progressive Disclosure ist ein Entwurfsmuster, das im UX-Design verwendet wird, um Bedienoberflächen für Anwender:innen leichter verständlich zu machen. Es beinhaltet die Sequenzierung von Aktionen und Informationen über mehrere Schritte bzw. Ansichten hinweg, um Komplexität zu reduzieren und Überforderung zu vermeiden. Dabei wird auch großer Wert auf das Ausblenden irrelevanter Informationen gelegt. Progressive Disclosure folgt der simplen Idee, sich vom Abstrakten zum Konkreten zu bewegen, einschließlich der Sequenzierung von Nutzungsverhalten oder Interaktionen. Ein gutes Beispiel für „Progressive Disclosure“ ist die „nested doll“ Navigation von iOS.

Komplexe Inhalte ausklappbar machen

15. Auf allgemein akzeptierte Muster und Interaktionen bauen

Anwender:innen verbringen den größten Teil ihrer Zeit mit anderen Produkten. Das bedeutet, dass sie es bevorzugen, wenn alle Anwendungen gleich oder mindestens ähnlich funktionieren wie alle anderen, die sie bereits kennen. Außerdem existieren bestimmte Erwartungen an das Aussehen und Verhalten von Anwendungen. Diese Erkenntnis gilt sowohl für jedes digitale als auch physische Produkt, vom sozialen Netzwerk bis zum Kühlschrank und spiegelt die Denkweise und Erwartungshaltung von Verbraucher:innen wider. Das bedeutet nicht, dass man aufhören sollten, innovativ zu sein. Vielmehr sollten man evaluieren, ob eine Abweichung von der etablierten Art und Weise, wie Navigation oder die Bedienelemente präsentiert werden, rechtfertigt, dass Anwender:innen ihre Denkweise ändern müssen.

Nutzung gängiger Darstellungen von Interaktion

16. Der erste Eindruck zählt

Das primäre Ziel eines jeden Designs sollte es sein, Anwender:innen so schnell wie möglich den Wert des Produkts zu vermitteln. Alles, was zwischen Anwender:innen und der Interaktion mit einem System steht, ist eine Art Barriere, es sei denn, es dient einem funktionalen Nutzen. Die Experience bei der ersten Nutzung ist äußerst wichtig für jeden Prozess. Wir bilden uns schnell eine Meinung über ein Produkt und ignorieren es, wenn wir nicht zufrieden sind.

Selbst die einfachste Aufgabe kann zur Herausforderung werden, wenn wir uns das erste Mal daran versuchen. Manchmal ist eine zusätzliche Schulung erforderlich, bevor wir ein Produkt bedienen können. Bei digitalen Produkten ergibt es Sinn, die analoge Denkweise abzulegen. Die Erwartungshaltung von Anwender:innen ist, dass das Produkt einfach genug ist, um es ohne Erläuterung zu verstehen. Gleichzeitig erwartet man Hilfestellung bei Bedarf oder wenn etwas schief geht. Dabei soll man kontextbezogen vorgehen, anstatt im Vorfeld eine „Betriebsanleitung“ mitzugeben.

Optimierte Erfahrung von der ersten Nutzung an

17. Berücksichtigung von Ergonomie und der Umstände, unter denen das Produkt verwendet wird

Ergonomie ist der Prozess der Gestaltung oder Anordnung von Arbeitsplätzen, Produkten und Systemen, so dass sie zu den Menschen passen, die sie bedienen. Die meisten Menschen denken, dass es etwas mit Sitzgelegenheiten oder mit dem Design von Bedienelementen und Instrumenten im Auto zu tun hat - was es auch nicht ausschließt, aber es ist noch vieles mehr.

Ergonomie bezieht sich auf das Design von allem, was mit Menschen zu tun hat, einschließlich digitaler Produkte.
1954 zeigte der Psychologe Paul Fitts bei der Untersuchung des menschlichen Bewegungsapparats, dass die Zeit, die benötigt wird, um sich zu einem Ziel zu bewegen, von der Entfernung zu diesem Ziel abhängt und sich umgekehrt zu dessen Größe verhält. Man sollte also gewährleisten, dass häufig verwendete Elemente eine ausreichende Größe haben und so positioniert sind, dass sie von Anwender:innen einfach erreicht werden können.

Ergonomie und Umstände für den Nutzungskontext im Design beachten

18. Inline-Edit und Autosuggest-Werte

Weg mit allen unnötigen Interaktionen, Ansichten, Schritten in jedem Prozess. Es gibt eine optimale Geschwindigkeit, mit der Anwender:innen das System bedienen sollten. Man nennt sie „state of the flow“. Dieser Flow sollte nicht mit Popups unterbrochen werden. Bei allen Aktionen/Werten, die später geändert werden können, ist die Inline-Eingabe ein gutes Hilfsmittel. Wenn eine große Anzahl von Werten verfügbar ist, bietet sich die Nutzung von Autosuggest an.

Umbenennung erleichtern und Autosuggest nutzen

19. Smart Defaults zur Reduzierung der kognitiven Belastung

Smart Defaults sind Auswahlmöglichkeiten, die Antworten auf Fragen bereitstellen. Sie unterstützten dabei, Formulare schneller auszufüllen. Beim Ausfüllen von Formularen müssen Anwender:innen das Formular analysieren, eine Antwort formulieren und dann ihre Antwort in einem vordefinierten Format eingeben. Um relevante Vorgaben zu definieren, müssen Designer:innen die Anwenderschaft und den Kontext, in dem sie ein Produkt verwenden, verstehen. Dies ist nur durch gründliche Analyse und Tests möglich, um von Anwender:innen zu lernen und die Standardeinstellungen auf Grundlage der historischen Daten und Nutzungsmuster anzupassen.

Nutzung von Default-Eingaben für einfache Nutzung

20. Fehler vermeiden

Fehlermeldungen führen zu Frustration und vermitteln das Gefühl, dass man etwas falsch gemacht hat oder der Aufgabe nicht gewachsen ist. Man sollte daher für eine automatische Überprüfung der eingegebenen Daten sorgen und Warnhinweise für unzulässige oder fehlende Dateneingaben darstellen, um Fehler zu reduzieren.

Fehlervermeidung durch Passworthilfe

21. Barrierearmut

Designer:innen sollten sich für Barrierearmut einsetzen und sicherstellen, dass Ihr Produkt für ein möglichst breites Publikum zugänglich ist und das ohne Ausnahmen. Weltweit gibt es über 1 Milliarde Menschen, die eine Behinderung haben. Man sollte Farbe nicht als einziges visuelles Mittel zur Übermittlung von Informationen verwenden. Ausreichender Kontrast zwischen Text und Hintergrund ist essentiell. Auch die Navigation per Tatstatur ist zu berücksichtigen.

Barrierefreies Design mit Verlinkungen und Icons

Fazit

Es ist nicht einfach, Produkte so zu gestalten, dass sie einfach zu bedienen und zu verstehen sind, aber es ist ein lohnender Weg, und es gibt viele Möglichkeiten, sich in Richtung Einfachheit zu bewegen.