Usability von Unternehmens-Webseiten. Dipl.-Psych. Daniela Keßner Dipl.-Psych. Benjamin Uebel

Transkript

1 Usability von Unternehmens-Webseiten Dipl.-Psych. Daniela Keßner Dipl.-Psych. Benjamin Uebel

2 Usability 2

3 Kompetenzinitiative Usability (KiU) Ausgangslage in 2008 Großunternehmen: User Centered Design Prozess Kleine und mittlere Unternehmen: Usability kaum bekannt Idee unserer Initiative: Unterstützung von KMU in Berlin und den neuen Bundesländern Bei der Erschließung des Wettbewerbfaktors Usability 3

4 Kompetenzinitiative Usability (KiU) Preisträger des Innovationswettbewerbs Wirtschaft trifft Wissenschaft des Bundesministeriums des Innern gefördert von 2008 bis

5 Inhalt 1. Einführung 2. Homepage Gestaltung 3. Informations-Architektur 4. Nutzertests 5. Expertenreview 5

6 Was ist Usability? 6

7 Was ist Usability? 7

8 Was ist Usability? Usability macht Produkte leicht verständlich schnell erlernbar intuitiv und mühelos bedienbar aber Usability bringt auch Spaß und wird deshalb für Kaufentscheidungen immer wichtiger! 8

9 Usability genormt! Norm DIN EN ISO 9241, Teil 11: Gebrauchstauglichkeit ist das Ausmaß, in dem ein Produkt durch eine bestimmte Person in einem bestimmten Kontext genutzt werden kann, um bestimmte Ziele effektiv, effizient und mit Zufriedenheit erreichen. Effektivität: Effizienz: Wie wirksam ist das Produkt, wie gut, vollständig erreicht man sein Ziel? Verhältnis von Nutzen zum Aufwand: Wie viel kostet mich das? Zeit, Geld, Mühe Zufriedenheit: Abwesenheit von Ärger, Notwendigkeit Fehler zu korrigieren, Eingaben mehrmals machen 9

10 Usability-Probleme Quelle: Missverständnisse, Fehlbedienungen, Verzögerungen des Arbeitsablaufs, unnötige Belastungen, Unzufriedenheit oder sogar Sicherheitsrisiken 10

11 Risiken niedriger Usability 1. Nutzer erreicht nicht sein Ziel Frustration der Nutzer Weniger Kommunikation Geringere Kundenbindung 2. Niedrigere Umsätze 3. Schlechtes Image 11

12 Warum Usability? Sieben gute Gründe, Usability einen hohen Stellenwert zu verleihen. 12

13 1. Steigende Akzeptanz & bessere Kundenbindung 13

14 2. Gute Usability steigert Umsätze 14

15 3. Effizientere Ausschöpfung der eingesetzten Werbemittel 100 User 1 User CR = 1% 100 EUR / Neukunde * Usability steigert Konversionsraten und reduziert Kundenakquisitionskosten User CR = 5% 20 EUR / Neukunde * * bei CPC = 1 EUR

16 4. Entwicklungskosten geraten nicht außer Kontrolle Kosten eines Redesigns Analyse Konzeption Codierung Markt 16

17 5. Supportkosten verringern sich 17

18 6. Usability als wichtiger Wettbewerbsfaktor 18

19 7. Usability kann neue Märkte erschließen 19

20 Fazit Zufriedene Kunden Kundenbindung Höhere Umsätze Effizientes Marketing Kontrolle der Entwicklungskosten Sinkende Supportkosten Neue Märkte

21 Homepage-Gestaltung

22 Die Homepage Homepage Zentraler Einstieg in die Webseite Muss auf die Bedürfnisse zweier Nutzertypen optimiert sein!? 1. Nutzer, die wissen was sie wollen 2. Nutzer, die nicht wissen, was sie wollen

23 Homepage-Gestaltung für Erstbesucher? 1. Bildung eines ersten Eindrucks Emotional ansprechend? Vertrauenserweckend & seriös? 2. Beantworten folgender Fragen Was bietet mir die Webseite? Warum ist sie besser, als andere? Was kann ich hier tun?

24 Die menschliche Aufmerksamkeit ist begrenzt

25

26

27 Datenschutz-Link Werbung

28 Suchfunktion Kontakt-Link Hilfe-Link

29 Konventionen

30 Konventionen

31

32

33

34

35

36 Treibstoff für den Landwirt

37 Security-Bedarf für alle Fälle

38

39

40 Kommunikation des Angebots Angebot der Webseite sollte auf den ersten Blick erkennbar sein Schnelle Kommunikation durch aussagekräftige Slogans Logos / Namen Bilder Überschriften

41

42

43

44

45 Überschriften User scannen Texte am Bildschirm, statt sie zu lesen Orientierung entlang hervorstechender Informationen Detaillesen nur bei Interesse: Erst wenn etwas von Interesse gefunden wurde, wird zum herkömmlichen Lesen übergegangen Gestaltungsempfehlungen: 1. Scanning unterstützen Zwischenüberschriften Absätze Aufzählungen

46 Überschriften

47 Überschriften

48 Texte am Bildschirm lesen Gebrauchstaugliche Produkte verbessern durch ihre intuitive und einfach erlernbare Bedienung die Kundenbindung, das Unternehmensimage und die Absatzzahlen. Gebrauchstauglichkeit (engl. Usability) wird zunehmend als zentraler Wettbewerbsfaktor erkannt und bildet neben technischen Kriterien, wie der Funktionalität, Zuverlässigkeit, Änderbarkeit oder Effizienz, ein wichtiges Kriterium für den Erfolg eines Produktes. Internationale Studien zeigen, dass die Zufriedenheit der Benutzer eines technischen Produkts maßgeblich von dessen Gebrauchstauglichkeit ab hängt und deren Kaufentscheidungen maßgeblich beeinflusst. Im Gegensatz zum amerikanischen und skandinavischen Raum wird Usability in Deutschland als Wettbewerbsfaktor noch weitgehend vernachlässigt. Nutzerzentrierte Design- und Entwicklungsprozesse werden erst allmählicherst in großen Unternehmen, wie z.b. Siemens, SAP und Volkswagen eingeführt. So wird erst damit begonnen, eigene Abteilungen aufzubauen, spezielle Labore einzurichten und Methoden des Usability Engineering und Usability Testing zu integrieren, um die Usability der Produkte sicherzustellen und zu optimieren. Im Gegensatz dazu ist das Thema Gebrauchstauglichkeit bei kleinen und mittleren Unternehmen (KMU) Deutschlands kaum bekannt. Die Potentiale, die mit der Optimierung der Produkt-Usability verbunden sind, werden deshalb kaum genutzt.

49 Texte am Bildschirm lesen Warum eigentlich Usability?: Gebrauchstaugliche Produkte verbessern durch ihre Bedienung die Kundenbindung, das Unternehmensimage und die Absatzzahlen. intuitive und einfach erlernbare Der Wettbewerbsdruck steigt: Gebrauchstauglichkeit (engl. Usability) wird zunehmend als zentraler Wettbewerbsfaktor erkannt und bildet neben technischen Kriterien, wie der Funktionalität, Zuverlässigkeit, Änderbarkeit oder Effizienz, ein wichtiges Kriterium für den Erfolg eines Produktes. Usability im internationalen Vergleich: Internationale Studien zeigen, dass die Zufriedenheit der Benutzer eines technischen Produkts maßgeblich von dessen Gebrauchstauglichkeit abhängt und deren Kaufentscheidungen maßgeblich beeinflusst. Im Gegensatz zum amerikanischen und skandinavischen Raum wird Usability in Deutschland als Wettbewerbsfaktor noch weitgehend vernachlässigt. Wie machen s die Großen?: Nutzerzentrierte Design- und Entwicklungsprozesse werden erst allmählicherst in großen Unternehmen, wie z.b. Siemens, SAP und Volkswagen eingeführt. So wird erst damit begonnen, eigene Abteilungen aufzubauen, spezielle Labore einzurichten und Methoden des Usability Engineering und Usability Testing zu integrieren, um die Usability der Produkte sicherzustellen und zu optimieren. Usability in KMU: Im Gegensatz dazu ist das Thema Gebrauchstauglichkeit bei kleinen und mittleren Unternehmen (KMU) Deutschlands kaum bekannt. Die Potentiale, die mit der Optimierung der Produkt-Usability verbunden sind, werden deshalb kaum genutzt.

50

51

52

53

54

55

56

57 Homepage-Gestaltung für Erstbesucher? 1. Bildung eines ersten Eindrucks Emotional ansprechend? Vertrauenserweckend & seriös? 2. Beantworten folgender Fragen Was bietet mir die Webseite? Warum ist sie besser, als andere? Was kann ich hier tun?

58 Vorher

59 Nachher

60 Die Homepage Homepage Zentraler Einstieg in die Webseite Muss auf die Bedürfnisse zweier Nutzertypen optimiert sein!? 1. Nutzer, die wissen was sie wollen 2. Nutzer, die nicht wissen, was sie wollen

61 Informationsarchitektur Weisen Sie Nutzern den Weg

62 Inhalt Was ist Informationsarchitektur (IA)? Wie kommt man zu einer guten IA? Empfehlungen und Beispiele

63 Inhalt Was ist Informationsarchitektur (IA)? Wie kommt man zu einer guten IA? Empfehlungen und Beispiele

64 Ein Labyrinth von Informationen Wenn eine Webseite mehr Informationen enthält, als ein Besucher auf einen Blick erfassen kann, braucht er Unterstützung, sonst verliert er sich in den Seiten findet er die gewünschte Information nicht erkennt er nicht, um was es eigentlich geht verlässt er die Seite wieder

65

66

67 Was ist Informationsarchitektur? Die drei wesentlichen Bestandteile: - Organisation von Informationen ordnet die Inhalte in sinnfällige Gruppen reduziert Inhalte, fasst sie in Themenbereiche zusammen - die Bezeichnung von Informationen vergibt die richtigen Namen (Labeling) Drinnen ist, was draufsteht - die Navigation zu Informationen organisiert die Wege zu den Informationen stellt Werkzeuge zur Orientierung bereit

68 Organisation Supermarkt Lebensmittel sind verlässlich in bekannte Gruppen sortiert Wie wäre es ohne Ordnung? Oder mit einer ganz anderen?

69 Gute Organisation im Web orientiert sich am Verständnis der Nutzer, nicht an dem der Macher der Seite Es geht nicht um die perfekte, oder richtige Organisation von Informationen, sondern darum, wie Nutzer sie am einfachsten finden

70 Beispiel: Labeling Gartencenter Sie Suchen einen Maulbeerbaum... Nachtschattengewächse Solanaceae Ein Zoo in Deutschland Hauptnavigation Mitmachen Erleben Verstehen

71 Gutes Labeling im Web verwendet die Sprache der Benutzer verwendet klare Begriffe, die korrekte Erwartungen zum Inhalt wecken verwendet trennscharfe Begriffe, die Inhalte eindeutig einer Kategorie zuweisen

72 Beispiel: Navigation Die Gutenberg Bibel von 1454 Altes und Neues Testament in zwei Bänden auf Seiten Kein Titelblatt Kein Inhaltsverzeichnis Kein Sachregister Keine Seitenzahlen Wie fanden Gelehrte bestimmte Psalmen oder Bücher?

73 Gute Navigation im Web Zeigt dem Nutzer: Bei welcher Firma er gelandet ist (Logo etc.) Wo er sich aktuell befindet (Sie sind hier) Den Weg zu seinem Ziel (Nutzergerechte Menüs) wo er sonst noch hingehen kann (Beliebte Links, ) wie er zurückkommt (Zur Startseite, )

74 Informationsarchitektur Sorgt für Beschilderung im Labyrinth (Navigation) => Kurze und direkte Wege Sitemap Menüs und Submenüs Breadcrumb Trail Sorgt für verständliche Beschriftung der Schilder (Labeling) Begrifflichkeit der Nutzer Klare und trennscharfe Bezeichnung der Menüpunkte Einträge Seitenüberschriften Sorgt für überschaubare Menge von Zielen (Ordnung) Reduktion auf einige Menüpunkte Durch Zusammenfassung und Hierarchisierung

75 Inhalt Was ist Informationsarchitektur (IA)? Wie kommt man zu einer guten IA? Empfehlungen und Beispiele

76 Wie kommt man zu einer guten IA? Card-Sorting Methode zum Erfassen der Modelle und Begriffe von Nutzern Als Grundlage für benutzerfreundliche Navigations- und Menüstruktur Nutzergruppen-Analyse Methode zum Kennenlernen des Nutzerprofils Grundlage für die Frage nach gruppenspezifischen Zugängen Eigenes Wissen und Erfahrung Wenn Sie Ihre Nutzer sehr gut kennen Wenn das Thema neu ist Nutzer kein eigenes Modell oder Begriffe haben

77 Card-Sorting - Vorgehen 1. Kleinste Info-Einheiten der Webseite auf Karten schreiben (Seitenüberschriften) 2. Von repräsentativen Testpersonen die Karten aus deren Sicht sinnvoll gruppieren lassen a. Ohne Vorgaben zu Anzahl und Namen der Gruppen b. Mit Vorgabe der Anzahl von Gruppen 3. Anhand der Ergebnisse eine IA erstellen, die die größte Übereinstimmung aller Testpersonen abbildet

78 Card-Sorting - Vorgehen Anwendungsbereich: Konzeptionsphase: Hilft, eine Ordnung zu generieren Wie verstehen Nutzer meine Inhalte? In welcher Struktur bilden sie sie ab? Hilft, klare Bezeichnungen zu finden Wie benennen Nutzer die Informationsgruppen? Welche Sprache verwenden die Nutzer? Aggregierte Struktur in Menüs / der Navigation abbilden

79 Card-Sorting Alternativen: Eine vorhandene Struktur überprüfen A. Vorgabe der Namen der Gruppen Personen ordnen Inhalte nach ihrem Verständnis zu Überprüfen der Verständlichkeit verwendeter Bezeichnungen Wecken die Bezeichnungen die richtigen Erwartungen über den Inhalt? Deckt sich die Gruppierung der Nutzer mit der eigenen? B. Vorgabe der Gruppen Personen vergeben Bezeichnungen Nutzerorientierte Bezeichnungen finden Wenn Sie das Feld selbst thematisch ordnen wollen/müssen

80 Nutzergruppenanalyse Wer sind meine Nutzer? Und was wollen sie bei mir? Brainstorming im Unternehmen Online-Befragungen Interviews Fragestellung: Wer nutzt die Seite? Gibt es mehrere Nutzer-Gruppen? Welche Anliegen und Ziele verfolgen Nutzer? Welche Voraussetzungen bringen sie mit? Das Ergebnis kann weiter zur Menüstruktur beitragen: Nutzergruppenspezifischer Zugang zu den Inhalten

81 Eigenes Wissen und Erfahrung Die vermutlich gängigste Methode Kann durchaus ausreichen, Bei Fehleinschätzungen Gefahr von Bedienproblemen Beispiel: Frühe Uni-Homepages Selbstdarstellung auf Basis des Organigramms: Hauptnavigation: Fachbereiche Forschungsbereiche Zentrale Einrichtungen Betriebseinheiten Wissenschaftliche Einrichtungen Referate Dezernate

82 Eigenes Wissen und Erfahrung Wir empfehlen, die Usability Ihrer IA mit echten Nutzern zu überprüfen.

83 Inhalt Was ist Informationsarchitektur (IA)? Wie kommt man zu einer guten IA? Empfehlungen und Beispiele

84 FAQ s - Empfehlungen Wenn Info in mehrere Bereiche passt Der Nutzer will finden, nicht suchen Information in jedem Bereich verlinken Wenn eine Info nirgendwo recht hinpasst Möglichst keine Sonstige -Kategorie aufmachen Überall anbieten, wo sie vermutet werden könnte Wenn Info besonders wichtig ist Prominenten Zugang anbieten (Link auf der Startseite) Wenn Info sehr oft gefragt ist Prominenten Zugang anbieten (Link auf der Startseite)

85 FAQ s - Empfehlungen Wenn meine Produkte kryptische Namen haben? Für Business-User: Produktnamen anbieten Für Endkunden Zugänge nach relevanten Produktmerkmalen anbieten z.b. Fahrräder im Internet: Time Trial Performance Alloy Enduro Fully All Mountain Premium Light

86

87 FAQ s - Empfehlungen Wie soll ich meine Informationen ordnen thematisch oder nach Nutzergruppen? Das kommt darauf an: Wenn es sinnvoll ist: Bieten Sie zwei Navigationsmenüs an Oder auch drei Oder erst eines und dann das andere

88 Wie soll ich meine Informationen ordnen thematisch oder lieber nach Nutzergruppen? Im besten Fall nach beidem Bieten Sie zwei Navigationsmenüs an

89

90

91

92

93 Optimierung einer laufenden Webseite Dipl.-Psych. Benjamin Uebel

94 Hinweise auf Usability-Probleme Feedback von Kunden und durch Bekannte Web-Tracking-Ergebnisse Supportanfragen Man nutzt sein eigenes Produkt nicht gern & oft.

95 Warum entdeckt man viele Usability- Probleme nicht selbst?

96 Betriebsblindheit Je genauer man das eigene Produkt kennt, desto weniger kann man sich in naive Nutzer hineinversetzen Für Entwickler ist Vieles selbstverständlich, was für den Nutzer neu & unbekannt ist Man neigt dazu, die Usability des eigenen Produkts deutlich zu überschätzen.

97 Wie verringert man diese Betriebsblindheit?

98 Feedback von Außen 1. Nutzertests 2. Expertenfeedback

99 Dem User über die Schulter schauen..

100 durch Nutzertests Nutzertests beantworten viele Fragen: Wie nutzt der User die Webseite? Was interessiert die User? Welche Probleme treten auf? Was ist verständlich, was mißverständlich? Welche Funktionen werden genutzt? Welche fehlen? Wie kann ich die Webseite verbessern?

101 Wie läuft z.b. ein Nutzertest ab? 1. Einladen von Testnutzern 2. Freies Explorieren des Produkts 3. Durchführen vorher definierter Testaufgaben Wichtige Technik: Lautes Denken

102 Ergebnisse von Nutzertests 1. Usability-Probleme 2. Ideen zur Verbesserung des Produkts 3. Positive Auswirkungen auf das Entwicklungsteam & Betreiber

103 Positive Effekte auf Entwickler Besseres Verständnis des Nutzerverhaltens und der Nutzerbedürfnisse Verringerung der Betriebsblindheit Klärung interner Diskussionen

104 Selbst Testen vs. Hilfe von Usability-Experten Besser selbst testen, als gar nicht testen. (Steve Krug) Unterstützung durch Usability-Experten Fach & Methodenkompetenz Finden gebrauchstauglicher Lösungen Technische Laborausstattung Breites Erfahrungswissen bzgl. verschiedenster Produkte

105 Optimierung durch Expertenevaluation Mit kleinem Aufwand zur großen Wirkung Dipl. -Psych. Daniela Keßner

106 Die Ausgangssituation Bekannte oder vermutete Usability-Probleme

107 Expertenevaluation Die zweite Lösung

108 Was sind Expertenevaluationen? Usability-Experten bewerten System mindestens drei Experten freie Exploration oder/und aufgabengeleitete Exploration Diskussion und Verdichtung Gewichtung der Probleme => priorisierte Liste Ableitung von Optimierungsvorschlägen

109 Da stellen sich Fragen Warum Expertenevaluationen Warum 3 Experten Wie evaluieren sie Sind die Ergebnisse die gleichen

110 Warum Experten fragen?

111 Quelle: Jacob Nielsen, 1993 Warum 3 Experten?

112 Welche Grundlagen? DIN EN ISO 9241 Ergonomie der Mensch-System- Interaktionen Erfahrungswissen als Usability- Experten State-of-the-Art-Empfehlungen 10 Usability Heuristics 10 Best Intranets 10 Best Application UIs Top 10 Mistakes in Webdesign Design-Guidelines

113 Welche Ergebnisse? Liste mit Problemen / Verstößen gegen die gewählten Kriterien Erläuterungen der Probleme Optimierungsvorschläge Neues Konzept für ausgewähltes Problem

114 Die gleichen Ergebnisse? Experten sind keine Nutzer

115 Die gleichen Ergebnisse? Experten Nutzer Andere In Anlehnung an: Dr. Martin Schmettow, Uni Twente, NL Vortrag auf der Mensch & Computer 2010, 14. September

116 Einsatzbereiche Expertenreviews im ganzen Lebenszyklus: Konzepte Papierprototypen Fortgeschrittenen Prototypen Produkte im Live-Betrieb

117 Vor- und Nachteile bereits bei 3 Experten gute Ergebnisse zeit- und kostengünstiges Verfahren Usability-Experten sind keine Nutzer Nur eingeschränkt geeignet, wenn Domänen- Expertise verlangt (z.b. SW für Ärzte, Steuerberater). Dann nur formale Prüfungen möglich.

118 Rückschau Was können Sie selbst bei der Gestaltung Ihrer Homepage berücksichtigen? Was ist gute Informationsarchitektur und wie kommt man dazu? Welche Möglichkeiten für eine Optimierung bieten Nutzertests? Was hat man von Expertenreviews?

119 Das Leistungsangebot von KiU Usability-Beratung Durchführung von Usability-Projekten Anforderungsanalysen und Rapid Prototyping Unterstützung bei Neukonzeption von Produkten Verankerung von "User Centered Design" im Entwicklungsprozess 119

120 Einige unserer Projekte

121 und hier finden Sie uns! Herzlichen Dank für Ihre Aufmerksamkeit! 121