05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

34
So funktioniert’s ! – wie der Mensch Informationen auf Websites wahrnimmt Vortrag: update! digital media, HTW Chur

description

So funktioniert's! Wie der Mensch Informationen aufnimmt. Vortragsreihe update! digital media an der HTW Chur

Transcript of 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Page 1: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

So funktioniert’s ! – wie der Mensch Informationen auf Websites wahrnimmt

Vortrag: update! digital media, HTW Chur

Page 2: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Hauptproblem

Weshalb gibt es immer noch so viele Websites, die bei der Benutzerin, beim Benutzer nicht ankommen?

Derjenige, der die Website entwickelt, ist nicht derjenige, der sie effektiv verwendet … Falschannahme: „Ich bin ja auch Nutzer, also weiss ich, wie es funktionieren soll!“

Die Technologie steht im Vordergrund und nicht die Bedürfnisse der Benutzer

Die Grundlagen und das Wissen über den Menschen als Nutzer einer Website fehlen im Team oder insgesamt im Projekt

| Folie 2soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 3: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Ablauf (sehr vereinfacht)

Sehen -> Wahrnehmen -> Handeln

| Folie 3soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 4: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Ablauf (sehr vereinfacht)

Sehen

| Folie 4soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 5: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Grundlagen der Anatomie und Physiologie

Visuelles System -> Sehen

Auditives System -> Hören

Weitere Systeme Tastsinn Gleichgewichtssinn Geruchssinn Geschmackssinn

| Folie 5soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 6: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Visuelles System

Der Mensch nimmt ca. 80-90% aller für ihn relevanten Informationen über das visuelle System, also über die Augen auf!

| Folie 6soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 7: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Limitation unseres visuellen Systems

Wie empfinden sie das Lesen dieses Textes?

7| Folie 7soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Hintergrund: Chromatische Abberation

Page 8: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Experiment

Schauen Sie auf diesen Punkt

| Folie 8soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 9: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Gesichtsfeld: Orientierungsreflex

Im peripheren Gesichtsfeld

Evolutionäres Erbe

Ablauf Wahrnehmung von Bewegung Fokus / Aufmerksamkeit Evtl. Reaktion

| Folie 9soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 10: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Orientierungsreflex: Anwendung

Achtung: Banner-Blindness!

| Folie 10soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 11: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Alter: Akkommodationsgeschwindigkeit

A l t e r [ Jahre ]

rel.

Ge

sch

win

dig

keit

[%

] 125

100

75

50

25

010 20 30 40 50 60 70 80

1004

| Folie 11soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 12: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Alter: Lichtbedarf

4020 5030 60 70100

120

140

160

rela

tiv

er

Lic

htb

ed

ar f

r g

leic

he

N

ezt

ha

utb

ele

uc

htu

ng

sstä

r ke

Alter [ Jahre ]

[ % ]

1 8 3 3

Mit zunehmendem Alter steigt der Lichtbedarf. Die Augenmedien verlieren ihre Durchlässigkeit; die mittlere Pupillenweite bei gleicher Pupillenbeleuchtungsstärke sinkt.

n. Schierz, Ch. - Krueger, H., 1995

| Folie 12soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 13: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Alter: Sehschärfe

Sehen in der Ferne

Sehen in der Nähe mit Korrektur

Sehen in der Nähe ohne Korrektur

(nach Boyce, 1981)

| Folie 13soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 14: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Wissen, welche Benutzer meine Website verwenden (Benutzeranalyse)!

Unterstützungsfunktionen liefern (Schriftvergrösserung)

Gute Kontraste liefern

Alter: Ableitungen

| Folie 14soultank AG | Kunde - Projekt | 13. Oktober 2012

Page 15: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Farbenblinde z.B. Rot-Grün-Blindheit

Ca. 8% der männlichen Bevölkerung betroffen

Rot-Grün kann nicht sauber getrennt betrachtet werden

Wenn klare Trennung wichtig, dann beachten

Deuteranope Sehstörung

http://www.vischeck.com/

| Folie 15soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 16: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Ablauf (sehr vereinfacht)

Sehen -> Wahrnehmen -> Handeln

| Folie 16soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 17: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Eigentlich … … weiss frau/man noch relativ wenig darüber, wie das

menschliche Wahrnehmen und Verarbeiten funktioniert! Es gibt verschiedene Theorien … Schablonenvergleich oder

Merkmalsanalyse …

Doch versuchen verschiedene Disziplinen dem genauer auf die Schliche zu kommen Psychologie Biologie Neurobiologie Neuropsychologie …

Grundsätzlich gibt es aber die Gestaltgesetze, die die Wahrnehmung des Menschen sehr beeinflussen

| Folie 17soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 18: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Gestaltgesetz der Nähe

Man sieht eher vier Objekte als acht Linien

| Folie 18soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 19: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Gestaltgesetz der Nähe, Beispiel

| Folie 19soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 20: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Gestaltgesetze der Ähnlichkeit

Man nimmt eher die Reihen als die Spalten wahr bzw. die x und die o werden jeweils als Reihen aufgefasst

| Folie 20soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 21: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Gestaltgesetz der Ähnlichkeit, Beispiel

| Folie 21soultank AG | Kunde - Projekt | 13. Oktober 2012

Page 22: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Gestaltgesetze der Geschlossenheit

Man sieht zwei Kreise, vor denen der eine den anderen teilweise verdeckt, obwohl kein direkter Hinweis gegeben ist, dass der linke Teil der Figur ein geschlossener Kreis ist.

| Folie 22soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 23: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Gestaltgesetz der Geschlossenheit, Beispiel

| Folie 23soultank AG | Kunde - Projekt | 13. Oktober 2012

Page 24: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Weitere Gestaltgesetze

Gute Kurve/Gestalt

Tiefenwahrnehmung

Optische Täuschung

| Folie 24soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 25: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Aufmerksamkeit: Farben

[BILD: Wirth, Dr. Thomas. Missing Links – Über gutes Webdesign. 2. erweiterte Auflage (Carl Hanser Verlag München Wien) 2004. Seite 148.]

a) Farbige Reize werden eher beachtet als solche in Grauwerten.

b) Reine Farben werden eher beachtet als Mischfarben.

c) Farben mit hoher Sättigung bzw. Intensität werden eher beachtet als solche mit geringer Sättigung.

d) Warme Farben (Rot-Gelb) werden eher beachtet als kalte (Blau-Grün).

e) bunte Reize werden eher beachtet als einfarbige.

25| Folie 25soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 26: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Kurzzeitgedächtnis: Definition Chunking

Chunk = Informationseinheiten

Kurzzeitgedächtnis speichert 7+/-2 Chunks

Miller, G.A. (1956). The Magical Number Seven Plus or Minus Two: Some Limits on Our Capacity for Processing Information. Psychological Review, 63, 81-87

26| Folie 26soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 27: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Kurzzeitgedächtnis: Chunking im Interface-Design

Kontaktformular

Dienstleistungen

E-Mail

Unternehmensgeschichte

Produktneuheiten

Feedback-Fragebogen

Kunden / Referenzen

Alphabetisches Produktverzeichnis

Bestellung

Kontaktformular

E-Mail

Feedback-Fragebogen

Produktneuheiten

Alphabetisches Produktverzeichnis

Bestellung

Kunden / Referenzen

Dienstleistungen

Unternehmensgeschichte

Quelle: Kommdesign.de

| Folie 27soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 28: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Ablauf (sehr vereinfacht)

Sehen -> Wahrnehmen -> Handeln

| Folie 28soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 29: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Erfolg?

Handeln: Erfolg / Misserfolg bei Nutzung

Handeln (Nutzung)

Situation Aktion Resultat

Benutzer

System

Aufgabe

Umfeld/Kontext

| Folie 29soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 30: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Handeln: Nutzungsvariablen

Cognitive Load Mentale Belastung

User Control Freiheitsgrade und deren Nutzung durch Anwender

Selective Scanning Querlesen, Suchen nach Ankerpunkten

Elaboration Verknüpfung mit Vorwissen

| Folie 30soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 31: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Entscheidungstheorie

Alternativen Fiat Panda Ford Fiesta Opel Corsa Seat Leon

Attribute PS Preis Airbags Höchstgeschwindigk

eit

Alternativen Scrollen Hyperlinks folgen Browserfunktionen Suchanfrage stellen

Attribute URL Titel einer Seite Schriftgrösse Position des Hyperlinks

Allgemein Web

| Folie 31soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 32: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Entscheidungstheorie: Konsequenzen Jede Bedienaktion ist Folge eine Entscheidung…

… die meist eher unbewusst gefällt wird

Die Konsequenzen einer Bedienaktion sind oft gering Wenig Bereitschaft für Aufwand Nutzung von Heuristiken (Abkürzen, Infos auslassen, …)

Entscheidungsrelevante Informationen Schnell und einfach verfügbar Beispiel: (Nicht-)Nutzung von Handbüchern, Hilfesystemen

Dort wo es Sinn macht, investieren Nutzer mehr Aufwand Kompensation (Stärken gezielt einsetzen)

Nutzer surfen in der Regel mit dem geringstmöglichen Aufwand!

| Folie 32soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Page 33: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Schlussgedanke

| Folie 33soultank AG | Vortrag update! digital media, HTW Chur | 05. Juli 2012

Folgen sie dem ergonomischen Grundsatz:

Less is more!

Page 34: 05.07.2012 usability wie_der_mensch_informationen_wahrnimmt

Herzlichen Dank für Ihre AufmerksamkeitBei Fragen stehe ich gerne zur Verfügung, [email protected]