Mobile Mensch-Computer-Interaktion

Transkript

1 Mobile Mensch-Computer-Interaktion

2 Mobile HCI Überblick & Fokus Interaktions- & User Experience Design Herausforderungen Usability Engineering Prototyping & Testing Zukunft von mobiler HCI

3 Mobile HCI In the mid-1950s, if you were the husband of the Queen [of England] you could have a mobile telephone connection to the public network. But if you were a mere marquis, you could go whistle. (Agar, J.: Learning from the mobile phone. Journal of the Royal Society of Arts. January, Bildquelle:

4 Mobile HCI?

5 Mobile HCI Was heißt mobil? Mobil bedeutet mehr als nur Smartphones oder Tablets: Wearables, Navigationsgeräte, Pager, PDAs, Smartwatches, Implantate Neue Interaktionsformen: Touch, Sprache, Stifteingabe, 3D-Bewegungen,... Grenzen zwischen Funktionalität und Lifestyle verschwimmen zusehends Quelle: [MID06]

6 Besonderheiten von mobiler HCI? Nicht viel, Grundprinzipien bleiben gleich Aber: andere Herausforderungen! In Bezug auf technische Rahmenbedingungen (z.b. kleinere Bildschirme) In Bezug auf Designkompromisse (siehe rechts) Quelle: [DMMT13], XKCD:

7 Heute: Fokus auf Smartphones / Tablets VU Human Computer Interaction und Psychologie Svenja Schröder

8 4 große Herausforderungen von mobiler HCI 1. Eingabemöglichkeiten 2. Ausgabemöglichkeiten 3. Unbekannter Kontext 4. Interaktion mit realer Welt Definieren Forschungsfeld Mobile HCI Quelle: [ER14] & Foto:

9 7 Phasen von mobiler HCI 1. Portabilität Hardware wird tragbar, erste Laptops 2. Miniaturisierung Geräte werden kleiner, z.b. Handhelds 3. Konnektivität Geräte online und verbunden 4. Konvergenz All-in-one Geräte (PDA, Kamera, Musik, Spiele,...) 5. Divergenz Spezialisierte Geräte nur für einen Zweck, z.b. ipod 6. Apps (fast?) wichtiger als Hardware 7. Digitale Ökosysteme Konzert von ubiquitären Geräten Quelle: [ER14] &

10 Konvergenz vs. Divergenz: Spezialisierung oder Schweizer Taschenmesser? Einfache, aktivitätszentrierte Geräte oder all-in-one Schweizer Taschenmesser? Umfrage: Wie viele Geräte tragen Sie mit sich herum? What s in your bag?

11 Innovationsstrategien für mobile Interfaces Wie kann ich neue Interaktionsformen / Services / Gebrauchsformen entdecken / erfinden / einführen? Technologiegetrieben: Welche neue Erfahrung wird mit dieser Technologie möglich gemacht? Geschichtsgetrieben: Welche mobilen Anwendungen waren in der Vergangenheit erfolgreich, welche nicht? Welche Anwendungen waren auf meinem Desktop-Computer erfolgreich? Kann ich sie in die mobile Umgebung transferieren?

12 Erinnern Sie sich...? Usability als Verkaufsfaktor! Erfolgsgeschichte

13 Erfolgsgeschichte SMS Hohe Nützlichkeit (usefulness) Hohe Gebrauchstauglichkeit (usability) Hohe Alltags-Usability: leicht und unauffällig Hohes Nutzungserlebnis (user experience) Unmittelbar & emotional (Kontakt zu Familie, FreundInnen, KollegInnen) Niedrigere Kosten als Anrufe Unaufdringlich im Alltag Unmittelbare Aussagekraft Sozial Privater als Anrufe Quelle: [MID06]

14 Misserfolgsgeschichte WAP Start 1999: Surf the mobile net Bereits nach einem halben Jahr als Fehlschlag gewertet Jakob Nielsen: Selbst einfache Aufgaben (Nachrichten lesen, TV- Programm) kaum zu bewältigen Backend-Probleme Langsam, teuer Frontend-Probleme Sehr technische Sprache Oft nur 5-8 Zeilen auf Bildschirm Schlecht aufbereiteter Inhalt Schlechtes Interaktionsdesign Walled Gardens Quelle: [MID06], Bild:

15 Interaktions- und User Experience Design für mobile HCI

16 Gutes mobiles Interaktionsdesign? Gibt es nicht! Was erwarten Sie auf so einem kleinen Bildschirm? Beschränkungen als Ausrede Drei Hauptgründe für schlechtes Interaktionsdesign: Wahrgenommene Kosten für besseres Design Übertriebene Betonung von Technologienutzung über Zweckmäßigkeit Fehlendes User-Testing

17 Erinnern Sie sich...? Folgen von schlechtem Interaktionsdesign Auch hier: Emotional: Hohes Frustrationspotential Ökonomisch: Zeitverschwendung Ethisch: Sicherheitskritische Situationen

18 Wie kann gute Usability für mobile Geräte gelingen? Funktionalität kommt vor Design! Users would walk over glass to send a text message (Scott Jenson) We surveyed people who had suffered through the painful experience of using WAP, and they definitely didn t like it. (Jakob Nielsen in WAP Usability ) Gute Usability von Backend wie Frontend: Dahinter liegende Technik funktioniert, z.b. Datenübertragung oder Serverdienste (Backend) User Interface benutzbar (Frontend) Quelle:

19 Von mobiler Usability hin zu mobiler User Experience Ab 2002 in Österreich UMTS-Standard verfügbar Bis 2007: Mobiltelefone sehr erfolgreich, Smartphone-Verkauf eher schleppend Symbian, Palm, Windows Mobile, BlackBerry Ab 2007: Fokus auf mobiler User Experience My mobile phone is... [MID06] Bezug auf: Funktionalität Benutzungskontext Emotionen 2007

20 Shneiderman 8 Goldene Regeln 1. Konsistenz Beispiele: ios & Android Styleguides 2. Berücksichtige unterschiedliche Erfahrungen Beispiel: Mapping von Menü-Icons über Nummerntasten auf Handys als unterschiedliche Interaktionsformen je nach Erfahrungsgrad 3. Rückmeldungen auf Aktionen des Benutzers Auf Smartphone vielfältig möglich: akustisch, visuell, taktil Beispiel: Vibration bei Tastendruck auf virtueller Tastatur Quelle: [MID06]

21 Shneiderman 8 Goldene Regeln (2) 4. Abgeschlossene Operationen Beispiel: SMS-Workflow 5. Fehler verhindern Beispiel: Fehlerhafter Input durch dicken Daumen führt zu Autokorrektur 6. Einfache Rücksetzmöglichkeiten ( Undo ) Gefahrloses Explorieren auf ios

22 Shneiderman 8 Goldene Regeln (3) 7. Benutzerbestimmte Eingaben Sehr wichtig in Bezug auf begrenzt verfügbare Ressourcen! 8. Geringe Belastung des Kurzzeitgedächtnisses Kapazität Einheiten Beispiel: Lange Navigationsmenüs auf kleinen Bildschirmen

23 Goldene Regeln auf mobilen Geräten? (1/2) Gestaltung mobiler Geräte herausfordernd in Bezug auf folgende Ansprüche: Kleines Display Mangelnder Fokus durch NutzerInnen (mobiler Kontext) Wahrnehmung auf Basis bestehender Erfahrungen

24 Goldene Regeln auf mobilen Geräten? (2/2) Lösung: neue, angepasste Interaktionsformen Feedback nicht visuell, sondern akustisch (Warnsignal) oder haptisch (Vibration) Sichtbarkeit als relevanter Ausschnitt aus großem Ganzen (Peephole) Andere mobile Utensilien als Metaphern (Notizblock) Direkte Manipulation noch direkter machen Z. B. Drehen des Smartphone-Displays kippt das Bild

25 Designprinzipien für Embedded Interfaces* (1/2) Produkt nicht für einen Desktop-Computer halten Wollen Sie Ihre Kamera mit dem Windows Desktop bedienen? Hardware- und Software-Design aus einem Guss Besonders bei spezialisierten mobilen Geräten Beispiel: Desktop-Telefon! Den Kontext das Design steuern lassen In welchem Kontext wird das Gerät verwendet? Quelle: [AF14] * Nicht nur Smartphones / Tablets!

26 Designprinzipien für Embedded Interfaces* (2/2) Verschiedene Modi nur sparsam verwenden, wenn überhaupt Anwendungsbereiche (scope) begrenzen Navigation mit Displaygröße balancieren Eingabemöglichkeiten vereinfachen Nur unbedingt notwendigen Input verlangen Quelle: [AF14] * Nicht nur Smartphones / Tablets!

27 Herausforderungen

28 Wurstfingerproblem ( fat finger problem ) Eingabe mit Finger auf kleinem Touch-Bildschirm hat eine hohe Fehlerrate Breite Auflagefläche des Daumens + Okklusion des Bildschirminhaltes Alternativen: Stifteingabe (Problem: Stift sehr leicht zu verlieren) Buttons? Eingabe auf Rückseite des Gerätes?! Mögliche Lösung: Lokaler Zoom (ios / Android) Bildquelle:

29 Tippen auf Mobilgeräten Tippen auf virtuellen Tastaturen Herausforderung Blick auf Tastatur notwendig, Lage kann schwer erlernt werden, Fat Finger Problem Warum hat sich die virtuelle Tastatur durchgesetzt? Mehr Anzeigefläche für Displays Viele Apps und Webseiten nur für Inhaltskonsum Fehlertoleranz bei SMS, s,... Allerdings nicht bei Formularen! Assistenz bei Formularen sehr wichtig Quelle: [MU13]

30 Text auf Mobilgeräten Mobile Inhalte 2x schwieriger zu verstehen, da Lesen durch ein Schlüsselloch ( Peephole ) Warum? Kleinerer Bildschirm erfordert höhere Merkleistung: Zusammenhänge schlechter begreifbar Weniger Kontext = weniger Verständnis Blättern und Scrollen notwendig Scrollen braucht Zeit! man kann sich weniger merken Aufmerksamkeit wandert von Inhalt zum Scrollen Textpassage muss wiedergefunden werden Quelle: [MU13]

31 Wie sollte Text auf mobilen Geräten gestaltet sein? Optimale Ausnutzung der Anzeigefläche Redundante Informationen weglassen Text gut lesbar (Formatierung) und übersichtlich (Zwischenüberschriften) Sekundäre Inhalte auf sekundäre Seiten Scheinbares Paradoxon: Vertreib mir kurzweilig die Zeit, aber langweile mich nicht mit überflüssigen Inhalten! Quelle: [MU13]

32 Usability Engineering für mobile HCI

33 Prototyping für mobile Geräte Jeff Hawkins: Erfinder des Palm Pilot und des Handspring Treo (jetzt Neurowissenschaftler) Vor der Entwicklung des Palm Pilot trug er eine Woche lang einen Holzblock in der Hosentasche Er synchronisierte den Holzblock mit seinem Computer Er telefonierte mit dem Holzblock am Ohr Er speicherte Notizen auf dem Holzblock Am Ende entschied er sich, dass der Palm Pilot ein Erfolg werden würde Quelle: Bildquelle: "Palmpilot5000 eu" by Channel R at en.wikipedia Bildquelle:

34 Prototyping für mobile Geräte

35 Mobile NutzerInnen-Tests Even when a device is easy to operate and plainly communicates the effect of interacting with it, the test comes when it is deployed in the complex, messy world of real situations. When a user calls on its service in everyday use, it might still disappoint dramatically. [MID06] NutzerInnen-Tests sind auch im mobilen Bereich sehr wichtig! Besonderheiten: Kein stationärer Rechner, sondern mobiles Gerät! Wie Testdaten mobil erfassen? Mobiler Kontext! Testen im Feld? Nachstellen im Labor?

36 Mobile NutzerInnen-Tests:... mehr in der dazugehörigen Einheit! " Quelle: tobii.com

37 Zukunft von mobiler HCI

38 Zukunft von mobiler HCI Zwei interessante Beispiele für neue Interaktionsformen Neue Eingabeformen: [Harrison, C., Tan, D. Morris, D Skinput: Appropriating the Body as an Input Surface. (In Proceedings of SIGCHI 2010)] Neue Ausgabeformen: [Lopes, P. and Baudisch, P. Mobile Force-Feedback based on Electrical Muscle Stimulation. (In Proceedings of SIGCHI 2013)]

39 Zukunft von mobiler HCI: Neue Risiken?

40 Quellen [MID06]: Mobile Interaction Design Matt Jones and Gary Marsden (2006) [AF14]: About Face Alan Cooper, Robert Reimann, David Cronin and Christopher Noessel, 4. Auflage (2014) [MU13]: Mobile Usability Für iphone, ipad, Android, Kindle Jakob Nielsen und Raluca Budiu (2013) [DMMT13]: Don t Make Me Think Revisited Steve Krug (2013) Danksagung an Prof. Dr. Rukzio für die Bereitstellung seiner Vorlesungsfolien zu Mobile Mensch-Computer Interaktion [ER14]