user xperience entsteht nicht durch zufall
TRANSCRIPT
![Page 1: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/1.jpg)
User Experience Gute Produkte entstehen nicht durch Zufall
CAS Mobile Business
Daniel Muther
12.09.2014
![Page 2: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/2.jpg)
Ablauf des heutigen Nachmittags
1
2
3
Warum User Experience wichtig ist Grundlagen User Centered Design, Methodisches Vorgehen Design für Mobile
![Page 3: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/3.jpg)
1 1
Warum User Experience wichtig ist
![Page 4: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/4.jpg)
Gute Produkte entstehen nicht durch Zufall
Wie es heute abläuft
Qu
ell
en
: s
co
ttad
am
s@
ao
l.c
om
![Page 5: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/5.jpg)
Was heisst „Easy to use“ oder „gute Usability“?
Frage in die Runde:
Welche App ist besser bezüglich Usability?
Teletext App Blick Fussball
Qu
ell
en
: A
pp
le i
Tu
nes
Sto
re
![Page 6: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/6.jpg)
Die Antwort ist abhängig von verschiedenen Faktoren
Die Frage kann so nicht beantwortet werden
Harry Meier, Fussball-Fan:
„Im Stadion möchte ich schnell
auf einen Blick die Resultate
aller Spiele sehen, ohne gross
abgelenkt zu werden “
Pat Schneider, Student:
„Wenn unterwegs bin, informiere
ich mich gerne über das
Gesamt-Geschehen im
Schweizer Fussball “
Benutzern – Wer sind die Benutzer des Systems?
Den Aufgaben – Welche Aufgaben sollen damit erfüllt werden?
Dem Umfeld – In welcher Umgebung wird das System benutzt?
Aufgabe:
Resultatsübersicht der
laufenden
Fussballspiele anzeigen
![Page 7: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/7.jpg)
Das Gesamtbild über den Benutzer hilft uns gute
Systeme zu bauen
nach Shackel, 1991
Benutzer Aufgabe
System
Umfeld
„Ziele sind die Gründe warum wir Aufgaben ausführen“ Cooper, 1999
Ziele der Benutzer
Deshalb müssen wir wissen für wen, für was und worauf wir etwas
entwickeln, bevor wir entwickeln.
![Page 8: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/8.jpg)
Terminologie: Usability ist ein wichtiges Qualitätskriterium
Akzeptanz
Nützlichkeit
Kosten
Performance
Verfügbarkeit
etc.
Nutzen
Usability
Effektivität
Effizienz
Fehlertoleranz
Erlernbarkeit
Motivation
Qu
ell
en
: N
iels
en
so
wie
Qu
es
en
bery
![Page 9: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/9.jpg)
Nicht alle Teilaspekte sind immer gleich zu gewichten
Effektivität
Effizienz
Motivation Fehler
Toleranz
Erlernbar-
keit
Gewichtung der Aspekte Informations-Sucher (Nutzung x mal pro Tag)
Online-Shopper (Nutzung 1x pro Quartal)
Wer ist also unsere Hauptbenutzergruppe? Für wen wird das System optimiert?
Qu
ell
en
: N
iels
en
so
wie
Qu
es
en
bery
![Page 10: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/10.jpg)
1 2
Grundlagen User Centered Design,
Methodisches Vorgehen
![Page 11: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/11.jpg)
ISO 9241-210: Prozess zur Gestaltung gebrauchstauglicher Systeme
Und wie erreicht man das?
UCD planen
Analysieren
Nutzungsanforderungen
spezifizieren
Design
Testen und überarbeiten
System erfüllt
Anforderungen
Iteration, soweit
Evaluierungsergebnisse Bedarf
hierfür aufzeigen
Eine Definition:
Generelle Philosophie oder «Mindset» bei der Entwicklung technischer Systeme, bei
welcher die Benutzer im Zentrum stehen – nicht die Technik
Gegenteil wäre: Technologie-zentriertes Vorgehen
![Page 12: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/12.jpg)
User Centered Design Kreislauf Schritt für Schritt
![Page 13: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/13.jpg)
User Centered Design Kreislauf Schritt für Schritt
Interviews und Beobachtungen
![Page 14: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/14.jpg)
Interviews mit potentiellen Benutzern
![Page 15: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/15.jpg)
Beobachten der Benutzer in ihrer natürlichen Umgebung
You can learn a lot from just sitting and watching. (From Kitchen Stories, 2003)
![Page 16: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/16.jpg)
User Centered Design Kreislauf Schritt für Schritt
Interviews und Beobachtungen
Personas
![Page 17: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/17.jpg)
Visualisieren der Benutzer mit Personas
![Page 18: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/18.jpg)
18
Alle haben eine andere Vorstellung von den Benutzern...
Die Benutzer brauchen X...
Ohne Personas sind die Diskussionen einiges mühsamer…
![Page 19: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/19.jpg)
User Centered Design Kreislauf Schritt für Schritt
Interviews und Beobachtungen
Taskanalysen
Brainstorming und
Ideation
Personas
![Page 20: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/20.jpg)
Taskanalysen z.b mit einer Customer Journey Map
![Page 21: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/21.jpg)
Brainstorming und Ideengenerierung
![Page 22: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/22.jpg)
User Centered Design Kreislauf Schritt für Schritt
Interviews und Beobachtungen
Papierprototypen
Taskanalysen
Brainstorming und
Ideation
Klickbarer Prototyp
Personas
![Page 23: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/23.jpg)
Papierprototypen erstellen
![Page 24: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/24.jpg)
Erstes Testing, vielleicht mit Kollegen
![Page 25: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/25.jpg)
Klickbarer Prototyp erstellen
Axure Pop App
![Page 26: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/26.jpg)
User Centered Design Kreislauf Schritt für Schritt
Interviews und Beobachtungen
Papierprototypen
Taskanalysen
Usability-Testing
Brainstorming und
Ideation
Klickbarer Prototyp
Personas
Expert-Reviews
![Page 27: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/27.jpg)
Expert Reviews
![Page 28: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/28.jpg)
Usability Testing
![Page 29: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/29.jpg)
User Centered Design Kreislauf Schritt für Schritt
Interviews und Beobachtungen
Papierprototypen
Taskanalysen
Usability-Testing
Brainstorming und
Ideation
Klickbarer Prototyp
Personas
Expert-Reviews
![Page 30: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/30.jpg)
![Page 31: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/31.jpg)
1 3
Design für Mobile Usability
![Page 32: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/32.jpg)
Zuerst einige Fakten…
Timeline der Verbreitung von Massenmedien
1500 1890 1900 1910 1950 1990 2000 20??
Print Ton-
aufnahmen Kino Radio Fernsehen Internet Mobile
Geräte
Zukunft?
![Page 33: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/33.jpg)
Was haben wir aus dieser Entwicklung gelernt?
Jedes Medium ist anders!
Radio ist nicht
TV!
Print ist nicht
Desktop Web!
Desktop Web ist
nicht Mobile!
![Page 34: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/34.jpg)
Was haben wir aus dieser Entwicklung gelernt?
Wir sollten zukunftsorientiert denken!
Gestern Heute Morgen
Was kennen wir vom
Desktop Web?
Wie adaptieren und
optimieren wir das auf
das Mobile Web?
Wie stellen wir sicher für
die Zukunft gerüstet zu
sein?
![Page 35: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/35.jpg)
Vermutlich reicht es nicht, einfach das Hamburger-Icon auf
die Apple Watch zu übertragen
Wir sollten zukunftsorientiert denken!
![Page 36: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/36.jpg)
Kontext Desktop Web
Was macht Desktop Web aus?
Qu
ell
en
: J
oac
him
ott
.de
un
d A
pp
le i
nc
.
Grosser Bildschirm
Stromanschluss
Permanentes Netzwerk
Tastatur
Maus
Stuhl
Tisch
![Page 37: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/37.jpg)
Kontext Mobile
Was macht ein Mobile Device aus?
Qu
ell
en
: L
uk
ew
.co
m u
nd
Go
og
le.c
om
Kleiner Bildschirm
Batterie
Inkonsistentes Netzwerk
Finger
Sensoren
![Page 38: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/38.jpg)
Kontext Mobile
Was macht ein Mobile Device aus?
Qu
ell
en
: S
teve
Rh
od
es
Ein Auge
Ein Daumen
Partielle Aufmerksamkeit erfordert gezieltes Design
![Page 39: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/39.jpg)
Dateneingaben auf Mobile ist mühsam… aber der grösste
Hebel für die Mobile Usability
Es gibt viele Möglichkeiten Daten in einem Mobile Device einzugeben.
Qu
ell
en
: h
ttp
://g
oo
.gl/a
XY
dIj
![Page 40: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/40.jpg)
A D
... „Reduce to
the max“
B C
• Bei Formularen
nur die
Mussfelder
• Informationen
kurz und klar
• Keine
Sekundär-
Aktionen
Mobile Usability: die wichtigsten Faktoren
Die vier wichtigsten Design-Principles für Mobile Usability
![Page 41: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/41.jpg)
A: Reduce to the max
Für mobile Interaktionen nur das wirklich notwendige verwenden
Qu
ell
en
: h
ttp
://b
uilt.
bym
ob
y.c
om
/mo
bile
_c
hec
ko
ut
un
d B
rin
g.c
h
Nur die Mussfelder
Keine Sekundär Aktionen
wie «Abbrechen»
Informationen kurz und
klar
![Page 42: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/42.jpg)
Selbstbestimmung
und Kontrolle über
die Daten sind für die
Benutzer die
wichtigsten Faktoren
für die Nutzung des
Services.
A
... „Reduce to
the max“ „Touch first “
B
• Bei Formularen
nur die
Mussfelder
• Informationen
kurz und klar
• Keine
Sekundär-
Aktionen
• Touch-
optimierte
Controls
einsetzen
• User auf der
Tastatur
behalten
• Smarte
Defaults,
Maskierungen
Mobile Usability: die wichtigsten Faktoren
Die vier wichtigsten Design-Principles für Mobile Usability
![Page 43: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/43.jpg)
B: Touch first
Die Eingabe von Daten muss mit den Fingern einfach möglich sein
Qu
ell
en
: :
htt
p:/
/bit
.ly/y
J3
N2d
![Page 44: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/44.jpg)
B: Touch first
Die Eingabe von Daten muss mit den Fingern einfach möglich sein
Qu
ell
en
: Ta
pw
ort
hy:
De
sig
nin
g G
rea
t IP
ho
ne A
pp
s B
y J
osh
Cla
rk u
nd
htt
p:/
/m.k
ay.
co
m/e
n/k
ays
tore
80-90% der Leute sind
Rechtshänder
Eingaben ermöglichen
ohne häufig das Tastatur
Layout zu wechseln oder
die Tastatur zu verlassen
![Page 45: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/45.jpg)
Selbstbestimmung
und Kontrolle über
die Daten sind für die
Benutzer die
wichtigsten Faktoren
für die Nutzung des
Services.
A
... „Reduce to
the max“ „Touch first “
„Content before
Chrome“
B C
• Bei Formularen
nur die
Mussfelder
• Informationen
kurz und klar
• Keine
Sekundär-
Aktionen
• Touch-
optimierte
Controls
einsetzen
• User auf der
Tastatur
behalten
• Smarte
Defaults,
Maskierungen
• Titelleiste,
Statusleiste,
Scrollleiste
und
Navigations-
elemente auf
das Minimum
reduzieren
Mobile Usability: die wichtigsten Faktoren
Die vier wichtigsten Design-Principles für Mobile Usability
![Page 46: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/46.jpg)
C: Content before Chrome
Der beschränkte Platz gilt es möglichst gut zu nutzen
Qu
ell
en
m.y
ou
tub
e.c
om
, E
sp
n.c
om
un
d I
ns
tag
ram
Minimale Navigation
Maximaler Content
![Page 47: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/47.jpg)
Lasst uns das versuchen: optimieren wir einen mobilen
Checkout von Boingo Wireless Hotspot Provider
Benutzerziel und Kontext
Geek So schnell wie
möglich online sein
iPhone 5s
Mitten auf
der Strasse
![Page 48: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/48.jpg)
Lasst uns das versuchen: optimieren wir einen mobilen
Checkout von Boingo Wireless Hotspot Provider
Gewichtung der Usability Aspekte
Effektivität
Effizienz
Motivation Fehler
Toleranz
Erlernbar-
keit
![Page 49: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/49.jpg)
Ausgangslage
![Page 50: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/50.jpg)
Titel: User Ziel
Kurze, prägnante
Information
Minimale Anzahl
benötigter Informationen
E-Mailadresse
Eingabefeld
Inline Hilfetext
Primäre Aktion
Optimierte AGB’s
keine Checkbox
Sekundäre Aktion
Unnötige, störende
Elemente
![Page 51: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/51.jpg)
Schritt 1:
Feld «Vorname» und
«Nachname» zusammenführen
Design Principle: Touch first
Ziel: auf der Tastatur bleiben
Design Principle:
Reduce to the max
![Page 52: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/52.jpg)
Design Principle:
Reduce to the max
Schritt 2:
Felder Monat und Jahr
zusammenführen
Design Principle: Touch first
Ziel: Mobile optimierte
Controls verwenden
Type = month
![Page 53: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/53.jpg)
Ziel: auf der Tastatur
bleiben
Mobile-optimierte
Eingabe
Schritt 1:
Feld «Vorname» und
«Nachname» zusammenführen
Schritt 2:
Felder Monat und Jahr
zusammenführen
Schritt 3:
Eingabe maskieren
Design Principle: Touch first
E-Mail Eingabefeld maskieren;
erwartetes Format
Schritt 4:
Sekundär Aktion entfernen
Design Principle:
Reduce to the max,
Conversion Optimierung
![Page 55: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/55.jpg)
Reduktion der Anzahl
Eingabefelder
Ziel: Auf der Tatstatur
bleiben
Schritt 5:
Eingabefeld für Kreditkarten
Nummer optimieren
![Page 58: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/58.jpg)
![Page 59: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/59.jpg)
Selbstbestimmung
und Kontrolle über
die Daten sind für die
Benutzer die
wichtigsten Faktoren
für die Nutzung des
Services.
A D
... „Reduce to
the max“ „Touch first “
„Content before
Chrome“
„Use Device
Capabilities
B C
• Bei Formularen
nur die
Mussfelder
• Informationen
kurz und klar
• Keine
Sekundär-
Aktionen
• Touch-
optimierte
Controls
einsetzen
• User auf der
Tastatur
behalten
• Smarte
Defaults,
Maskierungen
• Titelleiste,
Statusleiste,
Scrollleiste
und
Navigations-
elemente auf
das Minimum
reduzieren
• Nutzung der
Funktionen
welche das
Gerät bietet:
Standort-
bestimmung,
Kamera,
Gyroskop, etc.
Mobile Usability: die wichtigsten Faktoren
Die vier wichtigsten Design-Principles für Mobile Usability
![Page 60: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/60.jpg)
Selbstbestimmung
und Kontrolle über
die Daten sind für die
Benutzer die
wichtigsten Faktoren
für die Nutzung des
Services.
A D
... „Reduce to
the max“ „Touch first “
„Content before
Chrome“
„Use Device
Capabilities
B C
• Bei Formularen
nur die
Mussfelder
• Informationen
kurz und klar
• Keine
Sekundär-
Aktionen
• Touch-
optimierte
Controls
einsetzen
• User auf der
Tastatur
behalten
• Smarte
Defaults,
Maskierungen
• Titelleiste,
Statusleiste,
Scrollleiste
und
Navigations-
elemente auf
das Minimum
reduzieren
• Nutzung der
Funktionen
welche das
Gerät bietet:
Standort-
bestimmung,
Kamera,
Gyroskop, etc.
Mobile Usability: die wichtigsten Faktoren
![Page 61: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/61.jpg)
D: Use Device Capabilities
Mobile Geräte haben eine Reihe an wertvollen Funktionen, welche sich für die Dateneingabe nutzen lassen
Qu
ell
en
: a
pp
lein
sid
er.
co
m u
nd
qu
es
tvis
ual.
co
m
Gruppenarbeit:
Was ist das erstaunlichste,
coolste, beste was euer
Smartphone kann? Feature, App,
Website, etc…
• 3-4er Gruppen
• 10 min Diskussion
• Pro Gruppe 4 Killerfunktionen
vorstellen
• Video: Questvisual
![Page 62: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/62.jpg)
Funktionen von mobilen Geräten
• Standorterkennung
• Multi-Touch-Sensoren
• Positionierung des Gerät und Bewegung: Beschleunigungsmesser
• Gyroskop: 360 Grad Bewegung
• Ausrichtung: Richtung von einem digitalen Kompass
• Video-& Bild: Aufnahme / Eingang von einer Kamera (Native App)
• Dual-Kameras: Vorder-und Rückseite
• Audio: Eingang von einem Mikrofon, Lautsprecher-Ausgang
• Ambient Light: hell / dunkel Umgebungswahrnehmung
• Nähe: Gerät Nähe zu physischen Objekten
• NFC: Near Field Communications durch RFID-Lesegeräte
• Geräteanschlüsse : über Bluetooth mehreren Geräte koppeln
• Barometer : messen des Luftdrucks
D: Use Device Capabilities
Mobile Geräte haben eine Reihe an wertvollen Funktionen, welche sich für die Dateneingabe nutzen lassen
![Page 63: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/63.jpg)
• Standorterkennung
D: Use Device Capabilities
Mobile Geräte haben eine Reihe an wertvollen Funktionen, welche sich für die Dateneingabe nutzen lassen
![Page 64: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/64.jpg)
• Multi-Touch-Sensoren
D: Use Device Capabilities
Mobile Geräte haben eine Reihe an wertvollen Funktionen, welche sich für die Dateneingabe nutzen lassen
Qu
ell
en
: h
ttp
://s
tati
c.l
uke
w.c
om
/To
uch
Ge
stu
reTe
mp
late
.pd
f
![Page 65: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/65.jpg)
• Positionierung des Gerät und Bewegung: Beschleunigungsmesser
D: Use Device Capabilities
Mobile Geräte haben eine Reihe an wertvollen Funktionen, welche sich für die Dateneingabe nutzen lassen
Bump:
• 2 Geräte miteinander
synchronisieren
• Beschleunigungsmesser Daten
• Position des Gerätes
• IP Adress-Austausch
• Möglichkeit Daten
auszutauschen
Qu
ell
en
: b
u.m
p
![Page 66: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/66.jpg)
• Gyroskop: 360 Grad Bewegung
D: Use Device Capabilities
Mobile Geräte haben eine Reihe an wertvollen Funktionen, welche sich für die Dateneingabe nutzen lassen
Qu
ell
en
: o
cc
ipit
al.
co
m/3
60
un
d h
ttp
://y
ou
tu.b
e/v
37
17
E_
AQ
fI
![Page 67: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/67.jpg)
• Ausrichtung: Richtung von einem digitalen Kompass
D: Use Device Capabilities
Mobile Geräte haben eine Reihe an wertvollen Funktionen, welche sich für die Dateneingabe nutzen lassen
![Page 68: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/68.jpg)
• Video-& Bild: Aufnahme / Eingang von einer Kamera (Native App)
D: Use Device Capabilities
Mobile Geräte haben eine Reihe an wertvollen Funktionen, welche sich für die Dateneingabe nutzen lassen
![Page 69: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/69.jpg)
• Dual-Kameras: Vorder-und Rückseite
D: Use Device Capabilities
Mobile Geräte haben eine Reihe an wertvollen Funktionen, welche sich für die Dateneingabe nutzen lassen
#selfie
![Page 70: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/70.jpg)
• Audio: Eingang von einem Mikrofon, Lautsprecher-Ausgang
D: Use Device Capabilities
Mobile Geräte haben eine Reihe an wertvollen Funktionen, welche sich für die Dateneingabe nutzen lassen
![Page 71: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/71.jpg)
• Ambient Light: hell / dunkel Umgebungswahrnehmung
D: Use Device Capabilities
Mobile Geräte haben eine Reihe an wertvollen Funktionen, welche sich für die Dateneingabe nutzen lassen
![Page 72: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/72.jpg)
• Nähe: Gerät Nähe zu physischen Objekten
D: Use Device Capabilities
Mobile Geräte haben eine Reihe an wertvollen Funktionen, welche sich für die Dateneingabe nutzen lassen
Ein/Aus Sensor:
• Bemerkt wenn z.b das Telefon
ans Ohr gehalten wird und
schaltet den Bildschirm an
oder aus.
![Page 73: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/73.jpg)
• NFC: Near Field Communications durch RFID-Lesegeräte
D: Use Device Capabilities
Mobile Geräte haben eine Reihe an wertvollen Funktionen, welche sich für die Dateneingabe nutzen lassen
![Page 74: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/74.jpg)
• Geräteanschlüsse : über Bluetooth mehrere Geräte verbinden
D: Use Device Capabilities
Mobile Geräte haben eine Reihe an wertvollen Funktionen, welche sich für die Dateneingabe nutzen lassen
![Page 75: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/75.jpg)
• Barometer : messen des Luftdrucks
D: Use Device Capabilities
Mobile Geräte haben eine Reihe an wertvollen Funktionen, welche sich für die Dateneingabe nutzen lassen
![Page 76: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/76.jpg)
Zusammenfassung
Design für Mobile Usability unterscheidet sich vom Design für Web Usability
Kontext und Fokus: Kenne deine User, deren Bedürfnisse und
Ziele
Prototyping: Fail early, fail often, fail cheap, iterate
Web ist nicht Mobile!
Dateneingaben auf mobilen Geräten sind mühsam, optimiere so
weit wie möglich
Nutze die Features der Smartphones sinnvoll
Messe vor Verbesserung und danach und sprecht darüber
![Page 77: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/77.jpg)
1 4
Diskussion Best practices und Mobile
Expriences
![Page 78: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/78.jpg)
Gruppenarbeit Mobile Experiences
Herausforderungen und Erfolgsfaktoren
Mögliche Themen
•Responsive Design oder Native
App?
•Wearables, the next big Thing?
•Mobile first?
•Sind Tablets mobile Geräte?
• …
Bearbeitung
•Thema auswählen, Gruppen à 3-4
Personen bilden
•Diskussion über Herausforderungen
und Erfolgsfaktoren
•Erkenntnisse auf einen Flipchart
festhalten
•Präsentation im Plenum, inkl. Fragen
und Diskussion
![Page 79: User xperience entsteht nicht durch Zufall](https://reader034.vdocuments.mx/reader034/viewer/2022052621/557c8950d8b42ab0788b4f28/html5/thumbnails/79.jpg)
Thank you!
Think mobile and…
... be prepared for the next big thing