2. Inhaltsverzeichnis
Inhalt der Fallstudie
Eckdaten 03
Ablauf des Projekts / unsere Leistungen 08
Ausgewählter Studienergebnisse 13
Fazit 30
Referenzen 32
Kontakt eResult GmbH 35
Seite 2 Fallstudie Usability-Test Fachhochschule Münster
3. Nächstes Kapitel
Eckdaten
des Usability-Tests für die FH Münster
Seite 3 Fallstudie Usability-Test Fachhochschule Münster
4. Eckdaten
Vorstellung des Kunden
Fachhochschule Münster:
●Was 1971 als Zusammenschluss von staatlichen und
privaten Bau- und Ingenieurschulen entstanden ist,
hat sich längst zu einer modernen, leistungsstarken
und kundenorientierten Hochschule entwickelt. Mit
rund 10 000 Studierenden zählt sie mittlerweile zu den
größten Fachhochschulen des Landes.
●Die 12 Fachbereiche und 65 Studiengänge verteilen sich auf die vier Bereiche
Ingenieurwesen, Soziales, Gestaltung und Wirtschaft. Unter dem Dach dieser
Kernbereiche bietet die Fachhochschule Münster eine enorme Breite an
fachspezifischen Arbeitsgebieten. Darüber hinaus wird zusammen mit Hochschulen
und Forschungseinrichtungen sowie mit Partnern aus aller Welt geforscht und
entwickelt.
Seite 4 Fallstudie Usability-Test Fachhochschule Münster
5. Eckdaten
Zielsetzung des Tests:
•Optimierung der Bedienung (Usability) und Auffindbarkeit von Informationen für Studierende
und Studieninteressierte auf fh-muenster.de auf Basis gesicherter Erkentnisse
•Besseres und tieferes Verständnis von den Anforderungen und dem Nutzungsverhalten beider
Zielgruppen
•Identifikation und Analyse von Abbruchgründen auf der Website
Zentrale Fragestellungen, die allesamt beantwortet wurden:
•Wie wird das Angebot der FH Münster von den beiden Zielgruppen bewertet?
•Wie kommen die Nutzer mit dem Angebot zurecht (Bedienbarkeit)?
•Können sich die Nutzer gut auf den Seiten der FH Münster orientieren?
•Funktionieren die vorhandenen Navigationselemente? Welche werden wie genutzt?
•Werden die einzelnen Rubriken verstanden und unterstützen diese beim Auffinden von
Informationen?
•Wo gibt es Aufmerksamkeitslücken auf zentralen Seiten des Informationsangebotes?
•Werden die bereitgestellten Informationen auf den Seiten der Rubrik „Studium“ von den
Nutzern verstanden? Fühlen sich die Nutzer ausreichend informiert?
Seite 5 Fallstudie Usability-Test Fachhochschule Münster
6. Eckdaten
360°-Multimethoden-Ansatz
Testraum:
● Verwendete Methoden: Testperson mit
Interviewer /
– Verhaltensbeobachtung Projektmanager
– Fokussierte Interviews
Bild der
– Protokolle lauten Denkens Testperson,
Ton und
– Blickverlaufsmessung Bildschirminhalt
des Test-PC
● Erhebungsort:
– Mobiles Usability-Labor
– Münster Beobachtungs-
raum:
Videoübertragung
● Stichprobengröße: Test-PC und
Aufnahme der
– 10 Testpersonen Testperson.
● Erhebungszeit:
– 75 Minuten je Testperson
Beispiel eines Testaufbaus
Seite 6 Fallstudie Usability-Test Fachhochschule Münster
7. Eckdaten
Realistische Kontaktsituationen
● (freie) Erkundung
– Fokus: Erkennen und Verständlichkeit
von Inhalten & Funktionen,
Links und Buttons,
Erwartungskonformität,
Selbstbeschreibungsfähigkeit,
Auffindbarkeit, etc.
● Szenariobasierte Nutzung
(Vorgabe von Aufgabenstellungen)
– halbstrukturiertes Interview
Fokus: Handlungs-/
Interaktionsprozesse
Seite 7 Fallstudie Usability-Test Fachhochschule Münster
8. Nächstes Kapitel
Ablauf des Projekts
Unsere Leistungen: so arbeiten wir.
Seite 8 Fallstudie Usability-Test Fachhochschule Münster
9. Ablauf des Projekts
Zielorientierte Abstimmung von Anfang an
• Kick-Off mit dem Kunden: Gemeinsam mit den Verantwortlichen der
Fachhochschule Münster haben wir im Rahmen des Projektauftaktes die
Probleme und Fragestellungen ermittelt, die mit Hilfe des Usability-Tests
geklärt werden sollten. Hierfür unterbreiteten wir Vorschläge für
Fragestellungen, die auf der Basis einer expertenbasierten Voranalyse
des Internet-Auftrittes erarbeitet wurden. Außerdem definierten wir die
gewünschte Zielgruppe, die uns als Grundlage für die Rekrutierung der
Testpersonen diente.
• Erstellung des individuellen Studienkonzeptes: Im Anschluss an
den Kick-Off entwickelten wir ein Studienkonzept zur Durchführung des
Usability-Tests in enger Abstimmung den Verantwortlichen der FH
Münster abgestimmt wurde. Hierzu wurden u. a. Aufgabenstellungen
formuliert, die im Laufe des Nutzertests von den Probanden bearbeitet
werden sollten.
Seite 9 Fallstudie Usability-Test Fachhochschule Münster
10. Ablauf des Projekts
Effiziente Auswertung mit hochwertigen Empfehlungen
• Erhebung & Problemsammlung: Während der Versuchsleiter die
Testpersonen im Testraum durch den Usability-Test führte, wurden im
Beobachtungsraum die identifizierten
Probleme auch in Form von Post-Its
(Klebezetteln) festgehalten und den
jeweiligen Seitenbereichen zugeordnet.
Dadurch entstand bereits während
der Tests eine erste Kategorisierung
der Probleme.
• Empfehlungsworkshop: Nach dem Usability-Test fand ein interner
Workshop statt. Hier wurden die im Test ermittelten Probleme gewichtet
und im Konsens konkrete Empfehlungen zur Lösung der Probleme
abgeleitet; auf Basis der Erkenntnisse aus dem Test aber auch aufgrund
der langjährigen Projekt- und Branchenerfahrung der Consultants.
Seite 10 Fallstudie Usability-Test Fachhochschule Münster
11. Ablauf des Projekts
Anschaulicher Berichtsband & konstruktiver Workshop
• Ergebnisband: Auf der Grundlage der Ergebnisse des Workshops
verfassten wir einen Ergebnisband, der die Probleme aufzeigt und
konkrete Empfehlungen für die Behebung der Probleme bzw. zur
Optimierung der Webseite darstellt (Umfang: 120 Seiten inkl. 2seitigen
Management Summar). Anschaulich aufbereitet und mit Screenshots
und Videos untermalt, sind die Ergebnisse auch im Nachhinein jederzeit
nachvollziehbar. Unsere visualisierte Handlungsempfehlungen
(Wireframes) halfen bei einer schnellen Umsetzung der Erkenntnisse.
• Ergebnisworkshop vor Ort: In einem halbtägigen Workshop wurden
die Ergebnisse und unsere Empfehlungen mit dem Kunden diskutiert
und reflektiert; unterstützt durch ausgewählte, aussagekräftige
Videosequenzen (Highlight-Videos).
• Projektdauer insgesamt: 3,5 Wochen
Seite 11 Fallstudie Usability-Test Fachhochschule Münster
12. Ablauf des Projekts
Aufbereitung im Ergebnisband
Aufzeigen der identifizierten Probleme Unterbreitung von Lösungsvorschlägen
verbale Empfehlungen Empfehlungen visualisiert
● Durch Usability- und Online-
Detailierte Problembeschreibung Marketing-Experten im Konsens
erarbeitet und nach Ihrer Schwere/
● Beleg durch Videosequenzen
dem nötigen Handlungsbedarf
aus Interviews,
gewichtet (A, B, C)
Blickdaten (Eyetracking) und
Protokolle Lauten Denkens
Seite 12 Fallstudie Usability-Test Fachhochschule Münster
13. Nächstes Kapitel
Ausgewählte Ergebnisse zur Navigation
auf fh-muenster.de
zur Veranschaulichung unserer Berichte im Rahmen von
Usability-Tests
Seite 13 Fallstudie Usability-Test Fachhochschule Münster
14. Ausgewählte Ergebnisse
Blickverlaufsmessung beim Einstieg
● Fragestellung:
– Wie verteilt sich die Aufmerksamkeit über die Navigationselemente? Kann
sich der Nutzer orientieren?
● Zur Beantwortung der Fragestellung wurde den TPen folgende
Aufgabe gestellt:
„Sie möchten sich darüber informieren, welche Befreiungen und
Ermäßigungen es für Sie als Studierende(r) an der FH Münster gibt. Sie
nutzen dazu die Suchmaschine Google und landen von dort aus auf
einer bestimmten Seite.
Wir zeigen Ihnen nun diese Seite; bitte verschaffen Sie sich zunächst
einen Überblick über mögliche Ermäßigungen.“
Dabei wurde der Blickverlauf gemessen.
Seite 14 Fallstudie Usability-Test Fachhochschule Münster
15. Ausgewählte Ergebnisse
Aufmerksamkeitsverteilung in der Orientierungsphase
(0-5 Sekunden) – Einstieg über Google
Anmerkung:
Je kräftiger der
Seitenbereich gefärbt ist,
desto intensiver wurde
dieser betrachtet.
Aufgabe: Informieren
Auszug
über Ermäßigungen
Seite 15 Fallstudie Usability-Test Fachhochschule Münster
16. Ausgewählte Ergebnisse
Aufmerksamkeitsverteilung über die gesamte
Betrachtungsdauer – Einstieg über Google
Anmerkung:
Je kräftiger der
Seitenbereich gefärbt ist,
desto intensiver wurde
dieser betrachtet.
Aufgabe: Informieren
über Ermäßigungen Auszug
Seite 16 Fallstudie Usability-Test Fachhochschule Münster
17. Ausgewählte Ergebnisse
Kontaktwahrscheinlichkeit & Time to Contact (ausgewählte
Elemente) – Einstieg über Google
80 % 1. Wert = Kontaktwahr-
17,9 s scheinlichkeit: Von wie
80 %
40 % vielen TPen (Prozent)
62,3 s 40 %
69,3 s wurde das farbig markierte
30,3 s
Element wahrgenommen?
2. Wert = Time to Contact:
Wie lange hat es gedauert,
60 %
bis das Element
47,8 s
wahrgenommen wurde?
80 %
28,1 s
Aufgabe: Informieren über
Ermäßigungen
Seite 17 Fallstudie Usability-Test Fachhochschule Münster
...
18. Ausgewählte Ergebnisse
Interpretation der Blickdaten
● Bei der Blickverteilung zur Aufgabenbearbeitung „Einstieg über Google“
fällt auf, dass nicht alle Navigationselemente von jedem Probanden
betrachtet wurden.
● Die meiste Aufmerksamkeit erhält die linke Navigation. In diesem
Bereich orientieren sich die TPen am intensivsten, wo sie sich auf den
Seiten der FH Münster befinden.
● Die Blickverteilung auf dem Content-Bereich der Seite ist sehr gut. Die
Broschüre dient innerhalb der ersten Sekunden als Eyecatcher und
lenkt die Aufmerksamkeit auf den Link „Studienbeitragsbroschüre“. Der
gut strukturierte Text (Absätze, Überschriften, Fettsetzung) unterstützt
im weiteren Zeitverlauf die Probanden beim Lesen der Texte.
● Trotzt vielen Inhalte auf der gesamten Seite, erhalten auch die
Kontakte und aktuellen Termine in der Marginalspalte genügend
Aufmerksamkeit. So gibt es kaum Aufmerksamkeitslücken auf der
Seite.
Seite 18 Fallstudie Usability-Test Fachhochschule Münster
19. Ausgewählte Ergebnisse
Erste Orientierung und Kontakt
Orientierung:
Alle TPen konnten sich gut
orientieren. Nicht immer wurde
auf alle Ebenen der Navigation
eingegangen. Sowohl
Blickdaten als auch
Beobachtung zeigen, dass die
angebotenen
Navigationselemente
ausreichend sind, um sich im
Bereich Studium zu orientieren.
Kontakt in Marginalspalte immer vorhanden:
Die Marginalspalte wurde von den Probanden besonders hervorgehoben. Für einen Nutzer der Seite werden
hier, immer erwartungskonform, Kontaktinformationen zur jeweiligen Seite angeboten, das wurde von den
TPen sehr gelobt. TP: „Das ist toll. Man hat immer einen Ansprechpartner, egal wo man ist auf der Seite.“
Seite 19 Fallstudie Usability-Test Fachhochschule Münster
20. Ausgewählte Ergebnisse
Orientierung: Unterstützende Farbgestaltung
Farbgestaltung unterstützt die
Orientierung:
Das Design und Layout der Seite wurde von den
TPen als angenehm und passend für die
Fachhochschule bewertet.
Die Farbgestaltung unterstützt zudem die
Orientierung auf der Seite. Wichtige
Navigationselemente und Links sind farblich
hinterlegt.
Seite 20 Fallstudie Usability-Test Fachhochschule Münster
21. Ausgewählte Ergebnisse
Linke Navigation
Unruhe durch variable Höhe:
Aufgrund der dynamischen Höhe der farblichen
Hinterlegung der linken Navigation wirkten
einige Seiten unruhig.
Seite 21 Fallstudie Usability-Test Fachhochschule Münster
22. Ausgewählte Ergebnisse
Empfehlungen zur linken Navigation
Farbliche Hinterlegung für vollständige Höhe: Die linke Navigation B
sollte als Block in der vollständigen Höhe farblich hinterlegt sein. So
dient sie als Ruhepol und wird vom Nutzer als stetiges
Navigationselement für den linken Seitenbereich verstanden.
Weißraum als Trennung hinzufügen: Um die visuelle „Schwere“ des B
linken Navigations-Blocks durch die vollständige Seitenhöhe ein wenig
zu relativieren, könnte oberhalb und unterhalb ein wenig Weißraum
eingefügt werden. Das hat den zusätzlichen Effekt, dass der horizontale
Balken (Sprachwechsel, Pfadanzeige) deutlicher hervorgehoben und als
eigenständiges Element wahrgenommen wird.
Seite 22 Fallstudie Usability-Test Fachhochschule Münster
24. Ausgewählte Ergebnisse
Linke Navigation – Darstellung der Ebenen
Undeutliche
Abgrenzung:
Die Differenzierung
zwischen der 2., 3. und
4. Ebene ist aufgrund der
sparsamen
Hervorhebung nicht
immer deutlich gegeben.
Ausprobieren
und erinnern:
Die aktuelle Darstellung
lässt nicht erkennen, ob
innerhalb einer Rubrik
weitere Unterrubriken
vorhanden sind. So muss
sich der Nutzer durch die
einzelnen Rubriken
klicken und diese
erkunden.
Seite 24 Fallstudie Usability-Test Fachhochschule Münster
25. Ausgewählte Ergebnisse
Empfehlungen zu Linke Navigation – Darstellung der
Ebenen
Dritte Ebene farblich hinterlegen: Bereits die aktive dritte Ebene sollte A
farblich als Block hinterlegt sein. So muss sich der Nutzer nicht lange in der
Navigation orientieren. Zudem ist die Zusammengehörigkeit der einzelnen
Unterrubriken sofort erkennbar.
Vierte Ebene einrücken: Die vierte Ebene muss ebenfalls eingerückt A
werden. So kann sich der Nutzer an visuellen Führungslinien schneller
orientieren und erkennt sofort, welche Unterrubriken der aktiven Ebene
oberhalb zuzuordnen sind.
+/- Symbole einführen: Zur Kennzeichnung der Menüpunkte, die A
Unterrubriken enthalten, könnten dem Nutzer bekannte Symbole einer
Baumstruktur angeboten werden („+“ bedeutet Unterkategorien
vorhanden). Bei einer derart komplexen Struktur wird dadurch die
Orientierung vereinfacht.
Fettsetzung und Highlighting: Die aktiven Ebenen sollten konsistent fett A
gesetzt werden. Die aktive Seite sollte zusätzlich farblich hinterlegt werden,
so erkennt der Nutzer noch leichter, wo er sich befindet.
Seite 25 Fallstudie Usability-Test Fachhochschule Münster
26. Ausgewählte Ergebnisse
Zugang zum Sprachwechsel
Sprachwechsel nicht erwartungskonform:
Die Positionierung des Sprachwechsels entspricht nicht den
allgemeinen Erwartungen der Internetnutzer. Oberhalb der
Navigation wird sie daher kaum wahrgenommen.
Seite 26 Fallstudie Usability-Test Fachhochschule Münster
27. Ausgewählte Ergebnisse
Empfehlungen zum Sprachwechsel (1/2)
Sprachwechsel nach rechts umpositionieren: Der angebotene A
Sprachwechsel muss im rechten oberen Seitenbereich positioniert werden.
So erwarten es die deutschen Internetnutzer 2010.
In unserer Längsschnittstudie Imagery IV (08/2010) geben 1200
Internetnutzer an, dass sie dieses Element rechts oben erwarten.
11 - 20 %
21 - 30 %
31 - 40 %
41 - 50 %
über 50 %
Seite 27 Fallstudie Usability-Test Fachhochschule Münster
28. Ausgewählte Ergebnisse
Empfehlungen zum Sprachwechsel (2/2)
Hinterlegung mit Breadcrumb beginnen: Die farbliche Hinterlegung B
könnte, aufgrund der Umpositionierung des Sprachwechsels im linken
Seitenbereich, entfernt werden und erst mit dem Surfpfad beginnen. Das
hat zur Folge, dass der horizontale Balken mehr Aufmerksamkeit bekommt
und nicht nur als Designelement wahrgenommen wird.
Symbol in der Breadcrumb anbieten: Ein Symbol, z. B. das der FH C
Münster, vor der Startseite im Surfpfad positioniert, erhöht nochmals die
Aufmerksamkeit auf das Navigationselement und kann die Orientierung auf
der Seite verbessern.
Seite 28 Fallstudie Usability-Test Fachhochschule Münster
29. Ausgewählte Ergebnisse
Unsere Empfehlungen - visualisiert
Navigation 1. Ebene
Suche
Startseite > Studium > Studierende > Studienbeiträge > Befreiungen & Ermäßigungen English
Studium 1. Überschrift
+
Studieninteressierte & Studienbewerber
+
Internationale Studienbewerber
-
Studierende
+
Beratungsangebote
-
Studienbeiträge
Befreiungen & Ermäßigungen
Studienbeitragsbroschüre
Studienbeitragsdarlehen
Kappungsgrenze
Content
Verwendung der Studienbeiträge
Sozial- und Studierendenschaftbeitrag
FAQ
+
Studienfinanzierung
+
Leben und Studieren
+
Service & Formulare
Seite 29 Fallstudie Usability-Test Fachhochschule Münster
30. Nächstes Kapitel
Fazit
Was hat der Tests der FH Münster gebracht?
Seite 30 Fallstudie Usability-Test Fachhochschule Münster
31. Fazit der Studie
Zentrale Ergebnisse
● Umfang des PPT-Ergebnisberichtes: 160 Folien
● Die Studie ergab 61 identifizierte Probleme inkl. konkreten
Handlungsempfehlungen, besonders in den Bereichen
– Gestaltung der Navigation und Suchfunktion
– Aufbereitung des Contents und Positionierung von zentralen Elemente
– Wording
● Alle 25 als „sehr wichtig (A)“ eingestuften Probleme, wurden zeitnah behoben.
Mithilfe der Highlight-Videos und der Beobachtungsmöglichkeit der Tests konnten
alle Beteiligten von der Wichtigkeit der Umsetzung überzeugt werden.
● Die durchschnittliche Bounce Rate auf den zentralen Seiten konnte um 20%
reduziert werden. Die durchschnittliche Verweildauer stieg um 50%.
● Das zuständige Amt für Studien- und Prüfungsangelegenheiten konnte zudem
einen positiver Rückgang von Fragen/Beschwerden per Telefon und Email zum
Internetauftritt feststellen
Seite 31 Fallstudie Usability-Test Fachhochschule Münster
32. Nächstes Kapitel
Referenzen
Seite 32 Fallstudie Usability-Test Fachhochschule Münster
33. Referenzen
Ein erfolgreiches Projekt!
„Die Fachhochschule Münster ist bestrebt, ihre Zielgruppen mit den
notwendigen Informationen im Internet zu versorgen und diese
benutzerfreundlich und leicht auffindbar zur Verfügung zu stellen. Mit
der Firma eResult haben wir einen kompetenten und professionellen
Partner für eine Usability‐Studie gefunden, in der das Nutzerverhalten
und die Bedürfnisse unserer Zielgruppen "Studieninteressierte" und
"Studierende" ermittelt wurden. Die Ergebnisse und
Optimierungsvorschläge von eResult haben unseren Internetauftritt
nutzerfreundlicher und wertvoller gemacht.“
Karsten Schäpermeier
(Fachhochschule Münster, Leiter der Online ‐Redaktion)
Seite 33 Fallstudie Usability-Test Fachhochschule Münster
34. Referenzen
Ausgewählte Kunden
mit denen wir Usability-Tests durchgeführt haben!
Seite 34
35. Nächstes Kapitel
Kontakt
Ansprechpartner eResult GmbH
Seite 35 Fallstudie Usability-Test Fachhochschule Münster
Im wahrsten Sinne des Wortes: Kunterbunte Kunden Für sehr unterschiedliche Branchen tätig Vorteil: wir können hinsichtlich der nutzerfreundlichen Gestaltung aus dem vollen Schöpfen (über den Tellerand blicken) Konfiguratoren bzw. Datenerfassungsprogramme gibt es nahezu in jeder Branche