CRA P

MARVIN LUCHS, 13.

4 Gestaltungsprinzipien fr mehr Benutzerfreundlich

CONTRAST

REPETITION

ALIGNMENT

PROXIMITY

CONTRAST

Aufmerksamkeit des Benutzers lenken

Wichtige Optionen und Elemente hervorheben

Sekundre Optionen und Elemente in den Hintergrund rcken lassen

Hinweise geben, wo es weitergeht

CONTRAST

REPETITION

ALIGNMENT

PROXIMITY

Twitter
CONTRAST REPETITION ALIGNMENT PROXIMITY

eBay
CONTRAST REPETITION ALIGNMENT PROXIMITY

REPETITION

Wiederholung im Sinne von Konsistenz

Gleiche oder hnliche Sachverhalte in gleicher oder hnlicher Weise prsentieren

Interne Konsistenz
Uniforme Gestaltung der Seiten, einheitliche Verwendung von Farben und Schriften, ...

Externe Konsistenz
Beachtung von Konventionen und Standards
CONTRAST REPETITION ALIGNMENT PROXIMITY

Users spend most of their time on other web sites

Jakob Nielsen

Benutzererwartungen sind von Erfahrungen auf anderen Websites geprgt Jede Abweichung bedeutet Erschwerung der Benutzung

CONTRAST

REPETITION

ALIGNMENT

PROXIMITY

Web Style Guide, 3rd Edition

CONTRAST

REPETITION

ALIGNMENT

PROXIMITY

Wikipedia
CONTRAST REPETITION ALIGNMENT PROXIMITY

DaWanda
CONTRAST REPETITION ALIGNMENT PROXIMITY

ALIGNMENT

Horizontale und vertikale Ausrichtung von UI-Elementen Unregelmig ausgerichtete Layouts wirken komplizierter, unordentlich Ausgerichtete Layouts helfen bei der Orientierung Faktor bei der Bewertung der Vertrauenswrdigkeit
CONTRAST REPETITION ALIGNMENT PROXIMITY

Userfocus

CONTRAST

REPETITION

ALIGNMENT

PROXIMITY

Userfocus

CONTRAST

REPETITION

ALIGNMENT

PROXIMITY

PROXIMITY

Elemente mit geringen Abstnden zueinander zusammengehrig werden als wahrgenommen

Gestaltpsychologie, Gesetz der Nhe

CONTRAST

REPETITION

ALIGNMENT

PROXIMITY

Nhe zu verwandten Elementen hilft beim Auffinden von gesuchten Elementen Art und Weise der Anordnung von Elementgruppen auf der Seite untersttzt den Benutzer bei der Bildung eines mentalen Models der Website

CONTRAST

REPETITION

ALIGNMENT

PROXIMITY

Userfocus

CONTRAST

REPETITION

ALIGNMENT

PROXIMITY

Nhe kann mit unterschiedlichen Mitteln erzeugt werden

Abstnde, White-Space Hintergrundfarbe Rahmen

Sie erzeugen fr den Anwender erkennbare, zusammengehrige Blcke

CONTRAST

REPETITION

ALIGNMENT

PROXIMITY

Zeit Online
CONTRAST REPETITION ALIGNMENT PROXIMITY

QUELLEN
Userfocus: A CRAP way to improve usability
http://www.userfocus.co.uk/articles/A_CRAP_way_to_improve_usability.html

Web Style Guide, 3rd Edition

Patrick J. Lynch, Sarah Horton

When They Click: Psychology of Web Design and User Behavior

Susan Weinschenk, in The Smashing Book #2

Wikipedia: Gestaltpsychologie
http://de.wikipedia.org/wiki/Gestaltpsychologie

Usability Friction: Aesthetic Usability Effect

http://usabilityfriction.com/2010/03/30/aesthetic-usability-effect/