uxce14 uke xperience
DESCRIPTION
Carsten Lambrecht, senior Account Manager @ dkd.de starts the UkeX with an introduction to strategic thinking and why Responsive Web Design is not a mobile strategy. Four examples show how business models are changing from B2B (Business2Business) to B2C (Business2Consumer). We call this trend „B2B2B2C“. One example describes the „Value Chain“ in which Nike delivers shoes to the consumer (e.g. wholesale or retail). Beside this B2B-model there is a way in which the consumer can order his unique pair of shoes directly B2C. This leads to more complex mobile strategies in which a responsive web-site might be part, but not the whole strategy. The UkeX describes mobile communication (as part of the mobile strategy) with different approaches of playing a song on the Ukulele. First we hear the harmonies of a song which is hard to recognize. The second example is the melody of a song which is easier to recognize. These two examples stand for the concepts „graceful degradation“ and „progressive enhancement“. The second example reduces the song to the basic content, the melody. In the meaning of progressive enhancement this basic content can be enhanced if more or bigger instruments are available. The further UkeX takes us on a customer journey from getting the consumers attention to the buying process. On this journey there are several touchpoints where the consumer can be influenced. These touchpoints can be simple newsletters or complex checkout-processes on web pages. This journey can lead to the right ideas for a mobile strategy.TRANSCRIPT
Uke�XperienceHow�the�Uke�Experience�helps�me�getting�people�into�the�first�idea�of�UX�and�Mobile�Strategies
Carsten LambrechtSenior Account Managerdkd Internet Service GmbH
Carsten�Lambrecht
Senior Account Manager at dkd.de
born 1975
marketing since 1996
mobile projects since 2008
ukulele addicted
Quelle: http://commons.wikimedia.org/wiki/File:Commodore64.jpg
Quelle: http://www.webdesignerdepot.com/2009/05/the-evolution-of-cell-phone-design-between-1983-2009/
Quelle: http://pdadb.net/index.php?m=specs&id=2&c=hewlett-packard_jornada_720
Motivation
why...?
www.vgf-ffm.de
Strategy
Mobile
Mobile�Strategy?
„if�you�don't�have�a�mobile�strategy,�you�don't�have�a�future�strategy“
Eric�Schmidt,�google
Meta Tag<meta name="viewport" content="width=device-width, initial-scale=1.0">
HTML StructureMobile !rst - Progressive enhancement
Media Queries/* for 700px or less */@media screen and (max-width: 700px) { #content { width: 700px; color: red; }}
Server-Side requirementsDevice DetectionPre-Generate Multiple Image Versions
RWDBuzzword�Bingo
Progressive Enhancement
Responsive Web Design
AWDAdaptive Web Design
Break-Points
Adaptive Images
Second Screen
Media querriesPerformance is King
DistributionContext is King (Kong)
Graceful�Degradation
Progressive�Enhancement
Mobile First
Mobile Last
C o n t e n t � i s � K i n g
(mobile)�Vision/Strategie
a
b
mobile�Strategy
mobile�Strategies�melting�existing�Value�Chains
value-chain�taxi-ride
Passenger Taxi Call Center Taxi Driver
Customer�Journey�&�Touchpoints
vor
während
nach
Inte
ress
e
Abwägung
Kauf
Nut
zung
„wiederkauf“
Auf
mer
ksam
keit
!Infos - Argumente
Sicher & einfach
Serv
ice/
Zufr
iede
nhei
t
Loyalität
a nach b
Bahn Taxi in der nähe?Auto TelefonnummerRad
Landingpage
Falsche Nummer
Wo genau bin ich
Anruf
teuer
Umweg
Visitenkarte
Bericht
Bewertung
new�value-vhain�taxi-ride
Passenger Taxi Call Center Taxi Driver
value-chains�are�melting
B2B2B2C
Strategy�✓Mobile?
The�first�Ukulele�Experience
everything is better with music
UkeX�No.�1�-�songs�on�a�ukulele
Graceful�Degradation
Progressive�Enhancement
Mobile First
Mobile Last
C o n t e n t � i s � K i n g
optimized for
big screens
Meta Tag<meta name="viewport" content="width=device-width, initial-scale=1.0">
HTML StructureMobile !rst - Progressive enhancement
Media Queries/* for 700px or less */@media screen and (max-width: 700px) { #content { width: 700px; color: red; }}
Server-Side requirementsDevice DetectionPre-Generate Multiple Image Versions
RWDBuzzword�Bingo�-�Back�again
Progressive Enhancement
Responsive Web Design
AWDAdaptive Web Design
Break-Points
Adaptive Images
Second Screen
Media querriesPerformance is King
DistributionContext is King (Kong)
Graceful�Degradation
Progressive�Enhancement
Mobile First
Mobile Last
C o n t e n t � i s � K i n gnative APP vs Web APPs
Sencha Touch
Strategy�✓Mobile?�✓
online�time
Of!ce Of!ce
☽☼Of!ce Of!ce
online�time�today
Of!ce Of!ce
Of!ce Of!ce
☽☼
Yeah! new touchpoints
Touchpoints
https://www.youtube.com/watch?v=55kOphD64r8
The�second�Ukulele�Experience
everything is better with music
Customer�Journey...to�a�waiting�queue..?
everything is better with ukuleles
UkeX�No.�2i�met�a�Uke�on�my�Customer�journey
vor
während
nach
Inte
ress
e
Abwägung
Kauf
Nut
zung
„wiederkauf“
Auf
mer
ksam
keit
!Infos - Argumente
BerichtBilder Filme
Reisebüro
Web
Anzeigen
UkeX�No.�2i�met�a�Uke�on�my�Customer�journey
vor
während
nach
Inte
ress
e
Abwägung
Kauf
Nut
zung
„wiederkauf“
Auf
mer
ksam
keit
!Infos - Argumente
BerichtBilder Filme
Reisebüro
Web
Anzeigen
UkeX�No.�2i�met�a�Uke�on�my�Customer�journey
vor
während
nach
Inte
ress
e
Abwägung
Kauf
Nut
zung
„wiederkauf“
Auf
mer
ksam
keit
!Infos - Argumente
Sicher & einfach
BerichtBilder Filme
Reisebüro Reisebüro
Web
Warenkorb
Bezahlsystem
Bestätigung
Parkplatz
Anzeigen
UkeX�No.�2i�met�a�Uke�on�my�Customer�journey
vor
während
nach
Inte
ress
e
Abwägung
Kauf
Nut
zung
„wiederkauf“
Auf
mer
ksam
keit
!Infos - Argumente
Sicher & einfach
BerichtBilder Filme
Reisebüro Reisebüro
Web
Warenkorb
Bezahlsystem
Bestätigung
Parkplatz
Anzeigen
UkeX�No.�2i�met�a�Uke�on�my�Customer�journey
vor
während
nach
Inte
ress
e
Abwägung
Kauf
Nut
zung
„wiederkauf“
Auf
mer
ksam
keit
!Infos - Argumente
Sicher & einfach
Serv
ice/
Zufr
iede
nhei
t
Loyalität
BerichtBilder Filme
Reisebüro Reisebüro
Web
Warenkorb
Bezahlsystem
Bestätigung
Parkplatz
Anzeigen
UnterlagenInformationsangebote
Reisegutschein
Reisegutschein
Bericht
Bewertung
UkeX�No.�2i�met�a�Uke�on�my�Customer�journey
Mobile�Strategy�disconnecting�the�mobile
http://vimeo.com/90042943
???
Thank�You
@casilas @dkd_de
references
by�@casilas
istockphoto.com:000024961826
istockphoto.com:000000103166
istockphoto.com:000017374915
mytaxi.com
istockphoto.com:000019758577
http://74fdc.wordpress.com/2012/06/29/additive-fabrication-growing-footwear-to-reduce-costs-and-pollution/
istockphoto.com:000016773057
istockphoto.com:000008772590 IMG�by�Søren�
Schaffstein�dkd.de
Videos
https://www.youtube.com/watch?v=55kOphD64r8
by�@casilasistockphoto.com:000017746481
http://vimeo.com/90042943
by�@casilas