Eye Tracking Erkenntnisse für Kursdesign von e-Learning Angeboten

1. Da schau her!
Augenfreundliche Gestaltung
von e-Learning Kursen
Dipl.-Ing. Mag. Gergely Rakoczi
Teaching Support Center
Technische Universität Wien
gergely.rakoczi@tuwien.ac.at

2. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
http://static2.thrivesmart.com/uploaded_images/business_images/0003/4105/Eyes_slide_show.jpg
Überblick
>> Schwerpunkte meines Vortrags:
1. Eye Tracking Theorie … nur kurz, versprochen 
2. Gestaltung von E-Learning Kursen
3. Gestaltung von E-Learning Inhalten
4. Optimierung von Navigationsprozessen
5. Aufmerksamkeitsverteilung bei Online Prüfungen

3. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
Nur kurz … mein Background
>> im E-Learning Team der TU Wien
>> Dissertation am IGW, TU Wien
Inst. für Gestaltung und Wirkungsforschung
Human-Computer-Interaction Group
>> Mediendesign
>> Usability, User Interface Design

4. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
May 21st 2010 4

5. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
May 21st 2010 5

6. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
Eye Tracking
>> 70 % der Umweltreize visueller Natur
http://en.wikipedia.org/wiki/File:Eye_tracking_thru_glass.JPG
>> Forschungsgebiet ist mehr als
100 Jahre alt
> systematische Beobachtungen
seit 1878 (Javal)
> erste Erkenntnis: visuelle
Prozesse nicht kontinuierlich,
sondern Abrupt staccato-artig
>> limitierter scharfer Sehbereich
(ca. 2 Grad)
FolieProf.Kaufmann,TUWien

7. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
Eye Tracking
>> Unmöglich zu übersehen!
> willkürlich vs. unbewusste Augenbewegung
> Pop-Out Effekt bewusst einsetzen
> viele subtile Ansätze (später mehr )
>> Augenbewegungen sind sehr schnell …
> Durchschnittl. Fixationsdauer 200-300 ms
> hohe Varianz unter Testpersonen
> Ungeduld: 8-Sekunden auf Webseite …

8. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
Aufzeichnungsverfahren
http://www.dizziness-and-balance.com/practice/images/equipment/eye-coil.jpg
Kontaktlinsen-basiert
http://www.metrovision.fr/EO01.jpg
Elektrookulografisch
Duchowski, Eye Tracking Methodology, 2003
Reflexionsbasiert
Aufzeichnungsgeräte

9. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
Eye Tracking Analysetools
>> Blickpfade / Gazeplots
>> Heatmap
>> Clusteranalyse
>> BeeSwarm
>> AOI, Stat. Analyse

10. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
Gestaltung von E-Learning Kursen

11. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
Visuelle Erwartungshaltung
>> Platzierung der grafischen Elemente
> gezielte Erwartungen
> nur „hidden“ standards (logout rechts)
> Einflussfaktoren (Campussoftware,
zuvor besuchte Webseite …)
Nielsen&Pernice,2011

12. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
“Unten vs. oben”
>> Leseintensität auf unterer Bildschirmhälfte nimmt stets ab
>> Nielsen’s “F-shape” gültig für E-Learning Kurse/Inhalte
http://www.imediaconnection.com/images/content/eyetracking1-formatted.jpg

13. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
Umgang mit Unübersichtlichkeit
>> Visuelle Überlastung vermeiden
> Anfragen/Feedback: „überladen“, „unübersichtlich“
> hohe Anzahl an kaum genutzten Blocks
> Reduktion auf 2-Spalten-Layout
> Vorteil: Fokus auf Inhalt

14. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
Gestaltung von E-Learning Inhalten

15. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
Reihenfolge der Erstwahrnehmung
>> Fixationsverhalten beim Seiteneinstieg (kumuliert!)
1. Text (Umfangsabschätzung)
2. Überschriften, informative Abbildungen
3. Inhalt (Lesen), Abbildungen mit niedrigem Informationsgehalt
4. Navigationselemente (linke dann rechte Kursspalte)
> Faustregel: Dominanz der Content (!)

16. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
Gestaltungsmethoden (!) nicht vergessen
>> Gestaltungsmethoden wirken
> Richtlinien der Webgestaltung lenken visuell
> oft keine Beachtung geschenkt
>> Nicht nur fett markieren oder rot hebt etwas hervor:
> Umrandung
> Nummerierung
> Aufzählung
> Einrückung
> farbliche Betonung
> Leerräume (!)
> auffällige Positionierung

17. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
Optimales Lesen
>> Leseforschung bietet viel spannendes …
> 70 bis 100 Zeichen pro Zeile optimal
> limitierte Lesespannbreite
xxx | xxxxxxxxxxxxxx
3-4 13-14 Zeichen
>> Sprachauswahl ändert Textlänge (z.B.: Beschriftungen) …
> Wahrnehmung von Seitendarstellungen
>> ABER: fixiert ǂ wahrgenommen (i.S. „perceived“)
| … Fixationsmitte

18. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
Wir sind soziale Wesen!
>> Im visuellen Fokus liegen …
> Menschen, Menschen, Menschen …. (und ihre Gesichter)
> magisch im visuellen Mittelpunkt
> Hinweis: (gute) Avatare verwenden!
> Tipp: mit Inhaltskernpunkten verknüpfen z.B.: „Sprechblasen!“

19. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
Bewegung wirkt Wunder!
>> Gekonnt einsetzen:
> Bewegung beste Lenkung für visuelles Verhalten
> selbst kleinste Bewegungen werden auf statischem
Bildschirm sofort bemerkt
> …, aber Achtung:
> Zu vermeiden: (häufig) blinkende, (stark)
rotierende, auffällig wiederkehrende … stören,
unterbrechen Lernprozess
> Herausforderung / Gratwanderung: Akzeptanz!
> Tipp: in marginalen Ausmaßen, an wichtigen
Kerninhalten anwenden!

20. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
Optimierung von Navigationsprozessen

21. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
Laaaaaaaaanges Scrollen
>> Kurse können sehr lange werden
>> „aus der Natur der Lernumgebung“
>> Lösung „schnell“: Highlighting
> Themenabschnitt hervorheben
> visuelle Steuerung für Lehrende

22. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
Laaaaaaaaanges Scrollen
>> Kursschnellzugriff selbst bauen
> aus Arbeitsmaterial / „Textfeld“
>> Themenabschnitte referenzieren
> oder auf „Ungenützte Aktivitäten“ verweisen

23. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
Begrifflichkeiten
>> Inkonsistente Verwendung von Begriffen …
>> Bsp: „Arbeitsmaterial“ in TUWEL
> lange bzw. zirkuläre Suchprozesse („Verzweiflung“)
> Unterschiedliche Begriffe: Arbeitsmaterial, Dokument, Datei,
Folien, Unterlagen, Skript, File, einfach „pdf“ …

24. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
Freund oder Feind?
>> beim Teststart und Abgabe: “Abbrechen” fett formatiert
>> hat Vor- und Nachteile
+ Reflexion, Bewusstseinsschaffung für Testbeginn und -Ende
- lange Fixationen
- jedesmal kognitive Hürde
- es waren nicht alle Klicks “Korrekt” (also, so wie gewollt) (!)

25. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
Aufmerksamkeitsverteilung bei
Online Prüfungen

26. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
Unterschiede nach Fragentyp
Suchaufgabe (MC)
Wahr/Falsch Aufgabe
Zuordnungsaufgabe

27. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
Leitfaden
http://www.rakoczi.at/uploads/media/22_Tipps_deu.pdf

28. 27. Februar 2014 Gergely Rakoczi @ MoodleMoot.de
Vielen Dank für Ihre Aufmerksamkeit!
Fragen?
http://static2.thrivesmart.com/uploaded_images/business_images/0003/4105/Eyes_slide_show.jpg
Ende