Es gibt viele verschiedene Designprinzipien oder Gestaltungsprinzipien. Wenn es aber um Web- und Interaktionsdesign geht, bietet Donald A. Norman die vielleicht besten sechs Prinzipien an, an die man sich als UI/UX-Designer oder als Webdesigner, halten sollte.
Noch ein kurzer Exkurs:
Wer ist Donald A. Norman und was ist der Hintergrund zu den Designprinzipien?
Donald Norman ist einer der Großen der human computer interaction und der Begründer des User-Centered Designs und seine Prinzipien sind eine gute Basis für jedes Designprojekt.
Normans Hauptgedanke ist, dass Geräte, Dinge, Computer und Schnittstellen funktional, leicht zu bedienen und intuitiv sein sollten. Er sagt, dass es zwei Gräben zu vermeiden gilt: den Graben der Ausführung und den Graben der Auswertung.
Angenommen, du möchtest ein Foto aus Facebook löschen. Dein Ziel ist es, das Foto zu löschen, und das Endergebnis ist, dass es gelöscht wird.
Was dazwischen passiert, ist die sogenannte Ausführungslücke, z.B. wenn du auf eine Schaltfläche mit der Aufschrift „Löschen“ klickst. Diese Lücke ist klein, wenn es nur wenige Hindernisse gibt (z.B. wenn Sie ein Foto löschen). Sie ist größer, wenn es viele Hindernisse gibt, z.B. wenn ein Kontaktformular viele Felder hat.
Die Bewertungslücke entsteht, wenn ein Benutzer eine Rückmeldung von einem System erwartet und das System entweder überhaupt keine Rückmeldung gibt oder alternativ dazu nicht die Rückmeldung gibt, die der Benutzer erwartet.
Am Beispiel eines Online-Shops: Du hast deine Kreditkartendaten eingegeben und auf „Einkauf abschließen“ geklickt. Du erwartst jetzt, dass eine Nachricht erscheint: „Vielen Dank! Ihre Bestellung ist bei uns eingegangen. Hier weiter einkaufen.“. Wenn nichts passiert, weißt du nicht was du tun sollst, weil die erwartete Rückmeldung nicht eingetroffen ist, und in Wahrheit überhaupt keine Rückmeldung eingetroffen ist. Diese Verwirrung (die oft zu panischem Knopfdrücken führt) wird als die Bewertungskluft bezeichnet – es gibt nichts zu bewerten!
Don Norman hat sich zu Themen wie diesen viel Gedanken gemacht und unter anderem die folgenden sechs Designprinzipien entwickelt. Diese sollen Interface-Designern helfen, ein gut navigierbares, übersichtliches, verständliches System zu bilden.
Norman hat dazu sechs Designprinzipien entwickelt, die diese zwei Kluften vermeiden sollen:
1. Visibility (Sichtbarkeit)
Die Benutzer müssen alle Optionen kennen und sofort wissen, wie sie darauf zugreifen können. Im Falle von Websites ist das leicht zu erreichen.
Verwende z.B. intuitive Icons, die deutlich darauf hinweisen, dass es mehr Optionen gibt, die weiter unten versteckt sind (z.B. das Hamburger-Menü). Dies ist umso wichtiger für mobiles responsive Design, wenn der Platz auf dem Bildschirm begrenzt ist und der starke Wunsch besteht, alles außer dem CTA loszuwerden.
2. Feedback
Jede Aktion erfordert eine Reaktion. Es muss einen Hinweis darauf geben, wie ein Geräusch, ein sich bewegendes Zifferblatt, ein sich drehendes Regenbogenrad, dass die Aktion des Benutzers etwas ausgelöst hat. Das beruhigt den User ungemein. Denn er weiß, dass zumindest etwas passiert, selbst wenn die gezeigte Ladetätigkeit nur Schein ist.
3. Affordance (Erschwinglichkeit)
Affordance ist die Beziehung zwischen dem, wie etwas aussieht und wie es benutzt wird.
Für Designer bedeutet es, dass sobald ein User etwas sieht, der User wissen muss, wie man es benutzt. Ein Becher hat zum Beispiel eine hohe Affordance: Es ist einfach und intuitiv herauszufinden, wie man ihn benutzt. Für Webdesigner ist die Affordance sogar noch wichtiger. Die Benutzer müssen auf einem Blick in der Lage sein zu erkennen, wie sie von einer Website auf die gewünschten Informationen zugreifen können, sonst verlassen sie die Website einfach.
4. Mapping
Mapping ist die Beziehung zwischen Kontrolle und Wirkung. Die Idee dahinter ist, dass bei gutem Design die Steuerung dem, was sie bewirkt, sehr ähnlich ist.
Ein gutes Beispiel für Mapping ist die vertikale Bildlaufleiste. Sie zeigt an, wo du dich auf einer Seite befindest, und wenn du sie nach unten ziehst, bewegt sich die Seite mit der gleichen Geschwindigkeit nach unten. Steuerung und Wirkung werden somit eng verbunden.
5. Constraints (Einschränkungen)
Constraints sind die Grenzen einer Interaktion oder einer Schnittstelle. Einige sind offensichtlich und physisch, zum Beispiel die Bildschirmgröße eines Telefons. Andere sind abgestufter, wie z.B. eine One-Pager Website mit einem Bild, das teilweise auf die Hauptseite schaut. Für den Benutzer ist es logisch, nach unten zu scrollen, um das nächste Bild und damit den Rest der Website zu sehen.
6. Consistency (Durchgängigkeit)
Dieselbe Aktion muss jedes Mal die gleiche Reaktion hervorrufen. Wenn eine Website eine Zurück-Taste hat, die den Computer manchmal ausschaltet, wird es sehr schwierig, zu navigieren.
Dasselbe gilt für die visuelle Konsistenz. Logos und Marken haben Macht und Wiedererkennung, weil sie dasselbe Logo verwenden. Coca Cola verwendet ihr Logo seit den 1890er Jahren und es hat sich seitdem nur minimal verändert und jeder kennt sich aus, wenn er das Logo sieht.
Das waren die sechs Designprinzipien nach Donald A. Norman. Sie bilden die Basis für ein großartiges Benutzererlebnis und großartiges Website-Design.
