Embed Size (px)
Citation preview
In sieben Schritten zur erfolgreichen Tabletwebsite 14. November 2013 - World Usability Day Würzburg
• @nuisol
User Experience
User
Modus
Testing
Kontext
Tablets vs. Smartphones
Kindle Edition - 0,99 € - http://www.amazon.de/dp/B00991EC5U E-Book und Softcover - http://goo.gl/VRUxn
Quelle: Adobe.com, Juli 2013
http://www.heise.de/newsticker/meldung/Consumermarkt-Erstmals-mehr-Tablets-als-Notebooks-verkauft-1938179.html
TABLETS!replace
Smartphones and Laptops
Engaging the Tablet User: What They Expect From Web Sites
http://www.gomez.com/engaging-the-tablet-user/
Engaging the Tablet User: What They Expect From Web Sites
http://www.gomez.com/engaging-the-tablet-user/
UX
USEREXPERIENCE
Joy of use
Gla
ubw
ürdi
gkeit
Interaktion
V
ertr
auen Reaktion
H
arm
onie
Berechenbarkeit
Funktionalität
Intuitivtät
NU
TZW
ERT
/ LOOK
NUTZERLEBN
IS / FEEL
USABILITY
Simplify My LifeSimplify My Life
Simplify My Life
= +
Fragen was User wollen und brauchen 5 Ebenen der UX
UX WERTE TESTING WERTE HINZUFÜGEN
Projekt DNA
Projekt DNA
Projekt DNA
Plan
Definieren
DesignenRelease
Entwicklung
Definieren
DesignenRelease
Entwicklung
Definieren
DesignenRelease
Entwicklung
Veröffentlichung
Release
Veröffentlichung
Release
Veröffentlichung
Release
8
= +
Fragen was User wollen und brauchen 5 Ebenen der UX
UX WERTE TESTING WERTE HINZUFÜGEN
Projekt DNA
Projekt DNA
Projekt DNA
Kaizen - Das Prinzip stetiger Verbesserung!
Jap. Kai = Veränderung, Wandel; Zen = zum Besseren 改善;
!
„Veränderung zum Besseren“
USER
http://www.youtube.com/watch?v=aXV-yaFmQNk
Technology codes our minds, changes our OS. Apple products have done this extensively.
NEU!
NEU!
Hipstamatic
Summer
Trendnutzer Gelegenheitsnutzer, Best Ager
Digitaler Außenseiter Digitaler Profi Digitale Avantgarde
Gelegenheitsnutzer BerufsnutzerTeenager
Fortgeschrittenes Alter Kids
abc34567
Typ: Berufsnutzer
Des Users Kryptonit
Sinus Milieus
Welche Funktionen/Benutzungsart bereiten dem User eine schlechte UX?
10% Etablierte
14% Konsum Materialisten
11% Hedonisten
9% Experimentalisten 15% Bürgerliche Mitte
14% Traditionsverwurzelte
5% Konservative
10% Moderner Performer
NeuorientierungMulit-Optionalität
ExperimentierfreudeLeben in Paradoxien
ModernisierungIndividualisierung
SelbstverwirklichungGenuss
Traditionelle WertePflichterfüllung
Ordnung
Unt
ersc
hich
tM
ittel
schi
cht
Obe
rsch
icht
Sozi
ale
Lage
Grundorientierung
4% DDR-Nostalgische
5% Konservative
Que
lle: S
inus
200
9
Steckbrief
ALTER: 34
GESCHLECHT: männlich
NATIONALITÄT: deutsch
BESCHÄFTIGUNG:
DWS Investment GmbH
FACHKOMPETENZEN: Fachwissen in der Altersvorsorge - Spezialwissen Riester und Rürup - medizinische Risikoprüfung in der Lebensversicherung - komplette Bestandsbearbeitung in der Altersvor-
sorge - Grundkenntnisse in Investment-fonds
OS: Windows (Desktop), iOS (Tablet), Android (Mobile)
BROWSER: Desktop: IE/Firefox Tablet:-Safari
DEVICES: iPad, Notebook, PC, Full HD
SOCIAL MEDIA: Xing, Facebook
WERTE: Das leben ist kein Ponnyhof
BEDARF: Immer auf dem neusten Stand
VERTRAUT WEM: Familie und engen Freunden
MOTIVATIONEN: „Sky is the limit“ --> nichts ist unerreichbar
LIEBLINGSBANDS: unterschiedlich --> Hip Hop, RnB
TV SENDUNGEN: Sport1, Sky, Pro Sieben
SPORT: Fussball, Joggen, Fitness
DEMOGRAFISCHE EIGENSCHAFTEN: neuste Technik, Sport etc.
Des Users Roboter
Welche Funktionen erwartet der User und wie lässt es sich übertreffen?
Multiscreen Use-Context
Sonstiges
Situation: Mobil + Stationär
Umfeld: Privat, Arbeits-
platz, öffentlicher Raum,
Unterwegs
Modus:
Lean Back (zuhause) , Lean
Forward( Zuhause + Arbeit)
Coherence
Synchronisation
Screen Sharing
Device Shifting
Complementarity
Simultaneity
· Keine Tablett optimierte Page
· langsame Ladezeit
· Unstrukturierter Aufbau
· Tablett optimiert
· Strukturiert & einfach
· Weniger ist mehr
X
X X
People read newspapers, listen to the radio,
and watch TV,
but they go to the Web to
!
GET THINGS DONE.
G.M. O'Connell
„
Mobile Commerce in Deutschland – Die Rolle des Smartphones im Kaufprozess, Seite 24, ECC-Handel, 2012
Context
artinthepicture.com
Quelle: Google Studie 2012, http://techcrunch.com/2012/10/22/google-research-shows-tablets-are-for-games-and-email-mostly-used-on-couch-in-bed/
MODUS
Device shifting Coherence Complimentary
Screen sharing Simultaneity Synchro
Device shifting
Coherence
Diese Beispiel Segmente listen verwandete Produkte und Reviews dazu, auf. Diese können als eingeständige HTML Fragemente bei Bedarf hineingezogen werden.
Demo: http://codepen.io/bradfrost/full/JsAKf
Complimentary
Screen sharing
Simultaneity
Synchro
Mobil
Öffentlicher Raum
Arbeitsplatz
Privat
NutzungsmodusUmfeld
Situation
Hands-onModus
Unterwegs
Portrait Landscape
Nach vorne lehnen
Zurücklehnen
Stationär
Mobil
Öffentlicher Raum
Arbeitsplatz
Privat
NutzungsmodusUmfeld
Situation
Hands-onModus
Unterwegs
Portrait Landscape
Nach vorne lehnen
Zurücklehnen
Stationär
http://uxmovement.com/mobile/design-your-tablet-interfaces-for-horizontal-swiping/
TESTING
�92
Meine-Hochzeitsdeko.de: Tablet-Nutzer im Shop
m-pathy | Juliane Hartmann | 16.10.2013
Clickmap: Warenkorb mit 4 Artikeln
�93
Besuche: 9,7 % Clicks: 6,1 % abspielen
m-pathy | Juliane Hartmann | 16.10.2013
Video: Hochzeitsshop
�94
�95
Registrierungsformular im Responsive Design
m-pathy | Juliane Hartmann | 16.10.2013
Registrierungsformular: Desktop, Tablet, Phone
�96
Desktop, Tablet Phone
m-pathy | Juliane Hartmann | 16.10.2013
Clickmap: nur Tablet
�97
Besuche: 11,8 % Clicks: 18,6 % abspielen
ein Teil aller Besuche (siehe Clickcounter) versucht mit on-site Klicks Layer, die eigentlich als Ausfüllhilfe dienen und dynamisch auftauchen, zu schließen (siehe Screenshot vom Video anbei)
m-pathy | Juliane Hartmann | 16.10.2013
Video: Tablet-Nutzer bricht ab, weil er die Policenummer nicht zur Hand hat
�98
m-pathy | Juliane Hartmann | 16.10.2013
Darstellungsprobleme bei Tablet-Nutzern mit bestimmten Browser und OS
�99
= +
Fragen was User wollen und brauchen 5 Ebenen der UX
UX WERTE TESTING WERTE HINZUFÜGEN
Projekt DNA
Projekt DNA
Projekt DNA
Immer wenn Du glaubst erleuchtet zu sein, beginnst Du wieder am Anfang.
NUISOL entwickelt digitale Lösungen für Marketing und Kommunikation. Der neuste Stand der Technologie ist
dabei Maßstab. !
Das Wissen über Entwicklungen und Trends macht NUISOL so praktisch nutzbar und bietet Orientierung in der rasanten
digitalen Evolution. !
NUISOL. Agentur für digitale Aha-Erlebnisse.
Technical Writing, Talks, Workshops, Trainings
UX Design
Webdevelopment
Mobile
Tablet
E-Commerce
Digital Publishing
Live Streaming (HLS)
Social Media
