Die 8 goldenen Regeln des Interface Design

full-shot

Dahinter stecken eine ganze Reihe von psychologischen Erkenntnissen, die es bei der Gestaltung eines User Interfaces zu beachten gilt.

Das User Interface bildet die Schnittstelle zwischen Mensch und Maschine. Sie zeigt dem Benutzer, wie der aktuelle Status eines Programms ist, was er für (Interaktions-)Möglichkeiten hat und nimmt entsprechende Benutzereingaben entgegen. Es übersetzt also zwischen dem Programmcode, welcher im inneren der Maschine läuft, und dem Benutzer, welcher vor derselben sitzt.

Du erinnerst Dich an die Momente, wo du - vor Wut gleich platzend - mit dem Gedanken gespielt hast, diese verdammte Maschine auf dem Tisch möglichst wuchtig durchs Fenster runter auf die Strasse zu werfen, nur um zu sehen, wie sie in tausend kleine Stücke zerschellt. Ja, gut hätte es getan, oder?   

Doch was ist es, was uns bei der Bedienung eines Programms so rasend machen kann? Es ist dasselbe, was uns davor abhält, ein Tool noch einmal zu öffnen, noch einmal zu besuchen oder in einem Online Shop überhaupt einzukaufen: Wir verstehen die Bedienung nicht, sie kommuniziert schlecht mit uns. Dinge sind unklar, fehlen vielleicht sogar oder sind schwer auffindbar, hierarchisch völlig sinnfrei angeordnet, irreführend benannt und so weiter. Dies löst innerlich ein Gefühl der Unsicherheit bis zur Verzweiflung aus und führt zu einer ablehnenden Haltung dem Programm gegenüber.

Basierend auf diversen psychologischen Erkenntnissen, wie der Mensch kommuniziert, hat Ben Shneiderman bereits 1987 ein Buch veröffentlicht (Link unter Literatur), welches die Regeln für eine effektive Mensch-Computer-Interaktion beschreibt. Die Regeln gelten noch heute (da sie auf den Menschen angepasst sind, nicht auf den Rechner).

So stellt sich Microsoft die Zukunft vor. Wie praktisch und benutzerfreundlich muss Software sein, um dermassen starken Einzug in unseren Alltag zu erhalten?

Die 8 goldenen Regeln für eine positive Nutzererfahrung

1. Konsistenz

Verwandte Elemente müssen in der Anordnung, Farbe und Funktionalität über die gesamte Applikation konsistent bleiben.
Beispiel: Ein Menü bleibt immer an der selben Stelle, wo immer man sich gerade befindet, wie z.B. die "Fenster schliessen"-Buttons in allen Betriebssystemen.

Bildschirmfoto 2015-11-27 um 11.26.53

2. Informatives Feedback

Feedbacks zu durchgelaufenen Aktionen wie Speichern, Öffnen oder eine laufende Verarbeitung müssen dem User unverzüglich angezeigt werden. 

Bildschirmfoto 2015-11-27 um 11.29.30

3. Abgeschlossenheit

Jede Funktion und jeder Prozess hat einen Anfang und ein Ende. Der Nutzer hat jederzeit den Überblick.
Beispiel: Wenn ein Registrationsprozess mehrere Schritte beinhaltet, muss der User immer sehen, auf welchem Schritt er sich aktuell befindet und wieviele Schritte er noch vor sich hat.

Bildschirmfoto 2015-11-27 um 11.30.40

4. Fehler vermeiden

Fehleingaben sollen vermieden werden durch genügend Information, was eingegeben werden soll. Trotzdem gemachte Fehleingaben sollen vom Programm erkannt werden, worauf es den User bei der Korrektur unterstützt.
Beispiel: Wenn ein Formular nicht oder falsch ausgefüllt wurde, sollten die betreffend Felder direkt optisch als nicht (korrekt) ausgefüllt markiert werden, inklusive dem Hinweis, was für Kriterien für ein korrektes Ausfüllen gelten. 

Bildschirmfoto 2015-11-27 um 11.33.48

5. Umkehrbarkeit

Jede Eingabe soll rückgängig gemacht werden können.
Beispiel: Eine Datei wird fälschlicherweise gelöscht oder verschoben. Hier ist ein “Undo” Button wichtig, welcher die Aktion rückgängig macht.

Bildschirmfoto 2015-11-27 um 11.34.40

6. Benutzerkontrolle gewährleisten

Benutzer sollen alle Aktionen selbst auslösen, unterbrechen und stoppen können. Der Benutzer will die Kontrolle darüber haben, was passiert.
Beispiel: Ein Updateprozess soll nicht einfach starten, das System auslasten und dann noch neu starten. Selbst wenn dies standardmässig aus anderen Gründen so geschieht, muss der User dies jederzeit ändern können.

osx4

7. Kurzzeitgedächtnis entlasten

Dem Benutzer sollen nur die nötigen Elemente und Informationen angezeigt, die er zur Ziellerreichung benötigt.
Hinweis: Die Regel 7 (+/-2) hat sich im Web als sinnvoll erwiesen. Laut der Hirnforschung kann das menschliche Kurzzeitgedächtnis ca. die letzten 7 Elemente präsent halten. Alles Ältere fällt also quasi aus dem Speicher raus und muss neu gesucht werden.

Beispiel: Umfangreiche Menüs, nicht enden wollende Buttonansammlungen und nah aneinanderliegende, komplexe Menüs sind für den User schwer zu bedienen und sollten nach Möglichkeit vermieden werden. Hier spielt auch die Zielgruppe eine starke Rolle. Eine Software für Audio-Profis, welche von diesen täglich eingesetzt wird, darf etwas komplexer werden.

Bildschirmfoto 2015-11-27 um 11.41.02

8. Universelle Benutzbarkeit

Das selbe Interface soll für Neulinge und Profis praktisch zu bedienen sein. Während es für Neulinge eine einfache Bedienung sicherstellt, stellt es für Profis Tastaturshortcuts und Kontextmenüs für eine schnelle Bedienung bereit.
Beispiel: Betriebssysteme ermöglichen die Bedienung mit der Maus. Sie können aber auch ausschliesslich mit der Tastatur bedient werden.

Bildschirmfoto 2015-11-27 um 11.42.59

Wie Sie sehen, ist es gar nicht so schwer, diese Regeln zu beachten. Allein der Gegencheck jedes Website-Konzepts gegen diese 8 Regeln garantiert beinahe bereits ein gutes Nutzererlebnis. Vergessen Sie nicht: User Experience und User Interface Design haben nur begrenzt mit Design an sich zu tun. Unsere Agenturerfahrung zeigt, dass alleine die konsequente Beachtung dieser Regeln gute Ergebnisse verspricht.

Literaturverweise

Ben Shneiderman – Effektive Interaktion zwischen Mensch und Maschine
Gebundene Ausgabe: 704 Seiten
Verlag: mitp, (2001, 1. Aufl.) Sprache: Deutsch
ISBN-10: 3826607538; ISBN-13: 978-3826607530

Titelbild: https://dribbble.com/KreativaStudio

Abonniere 
unseren Newsletter

Nur wertvolle Infos – kein Spam. Mit der Ameldung bestätigst Du, dass wir Dir einmal im Monat eine Zusammenfassung der neuesten Themen im Web-Bereich als E-Mail zusenden dürfen.

Mehr Artikel wie dieser

So funktioniert ein Workshop mit UX

Wenn wir von UX Workshops reden, meinen wir Workshops, welche UX Prozesse voranbringen. Daher befinden wir uns mit unserem Workshop in der menschzentrierten Entwicklung (auch…
Weiterlesen

Wie funktioniert UX Prototyping?

Es scheint komisch, wie bekannt die Methode des Prototyping ist. Dennoch wird sie manchmal nicht richtig verstanden. Oft wird von einem Prototyp geredet, aber eigentlich…
Weiterlesen

Die Macht der Interviews im UX Bereich

Bevor ich anfange, möchte ich darauf hinweisen, dass ich es verstehe, wenn man denkt, dass jeder ein Interview durchführen kann. Genau so kann man auch …
Weiterlesen

Basiswissen für User Testings

Gemäss ISO 9241 gilt die tatsächliche Usability (Benutzbarkeit) eines Produktes, als ein Teilbereich der gesamten User Experience (Nutzererlebnis). Das bedeutet, die reine Benutzbarkeit eines Produktes…
Weiterlesen

Personas und ihre Vorteile und Gefahren

Zuerst gilt die Frage, für welche Benutzer etwas entwickelt werden soll. Dabei kommen zunächst generische Antworten. „Unser System soll von allen genutzt werden.“, „Unsere Benutzer…
Weiterlesen

UX Irrtümer Teil 3 – Unzertrennbares UI/UX

Im Grunde gibt es zu UI/UX gar nicht so viel zu schreiben, sollte man meinen. UX steht für User Experience und UI steht für User…
Weiterlesen

UX Irrtümer Teil 2 – Mach mal UX Design!

Wie im letzten Artikel versprochen, geht es heute um das Missverständnis, wie UX Design eigentlich funktioniert. Viele verstehen UX nicht wirklich. Das ist weiter nicht…
Weiterlesen

UX Irrtümer Teil 1 – Design ist nicht Design

Ich bin UX Designer. Wer nicht weiss, was das ist, fragt gerne mal nach. Interessanterweise wollen die meisten jedoch nur wissen, wofür das UX steht.…
Weiterlesen

Design Thinking – Endlich verstehen

Design Thinking – die Innovations-Methode von dem jeder zu reden scheint. Die Lösung für jedes Problem, in jeder Lage. Doch kaum einer weiss wirklich was…
Weiterlesen

Design Sprint – Car-Sharing-App

Wenn sich verschiedene Leute entscheiden ein Auto zu teilen, scheint dies am Anfang noch ziemlich einfach und sinnvoll. Es wird eine Menge Geld gespart und…
Weiterlesen

Vom Graphic Designer zum UX-Designer – 7 Tipps für Berufsumsteiger

Wie viele andere UX-Designer komme auch ich ursprünglich aus der Printwelt. Ich bin sozusagen mit Büchern, Flyern und Magazinen gross geworden und wurde durch die Druckersprache…
Weiterlesen

Adobe Experience Design – oder auch: Bye-bye Sketch?

Wenn wir ehrlich sind, wissen wir es doch alle: Adobe hat ein Monopol auf Software für die kreative Branche. Kein anderer Softwarehersteller konnte sich so stark…
Weiterlesen