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.

1. Uke Xperience
How the Uke Experience helps me getting people
into the first idea of UX and Mobile Strategies
Carsten Lambrecht
Senior Account Manager
dkd Internet Service GmbH

2. 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

3. Motivation
why...?

5. www.vgf-ffm.de

6. Strategy
Mobile
Mobile Strategy?

7. „if you don't
have a mobile
strategy, you
don't have a
future strategy“
Eric Schmidt, google

8. Meta Tag
<meta name="viewport" content="width=device-width, initial-scale=1.0">
HTML Structure
Mobile first - Progressive enhancement
Media Queries
* for 700px or less */
@media screen and (max-width: 700px) {
#content {
width: 700px;
color: red;
}
Server-Side requirements
Device Detection
Pre-Generate Multiple Image Versions
RWD
Buzzword Bingo
Progressive Enhancement
Responsive Web Design
AWDAdaptive Web Design
Break-Points
Adaptive Images
Second Screen
Media querries
Performance 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

9. (mobile) Vision/Strategie
a
b
mobile Strategy

10. mobile Strategies
melting existing Value Chains

11. value-chain taxi-ride
Passenger Taxi Call Center Taxi Driver

12. Customer Journey & Touchpoints
vor
während
nach
Interesse
Abwägung
Kauf
Nutzung
„wiederkauf“
Aufm
erksam
keit!
Infos - Argumente
Sicher&
einfach
Service/Zufriedenheit
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

13. new value-vhain taxi-ride
Passenger Taxi Call Center Taxi Driver

14. value-chains are melting
B2B2B2C

15. Strategy ✓
Mobile?

16. The first
Ukulele Experience
everything is better
with music

21. 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

22. Meta Tag
<meta name="viewport" content="width=device-width, initial-scale=1.0">
HTML Structure
Mobile first - Progressive enhancement
Media Queries
* for 700px or less */
@media screen and (max-width: 700px) {
#content {
width: 700px;
color: red;
}
Server-Side requirements
Device Detection
Pre-Generate Multiple Image Versions
RWD
Buzzword Bingo - Back again
Progressive Enhancement
Responsive Web Design
AWDAdaptive Web Design
Break-Points
Adaptive Images
Second Screen
Media querries
Performance 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
native APP vs Web APPs
Sencha Touch

23. Strategy ✓
Mobile? ✓

24. online time
Office Office
☽☼
Office Office

25. online time today
Office Office
Office Office
☽☼
Yeah! new touchpoints

26. Touchpoints
https://www.youtube.com/watch?v=55kOphD64r8

27. The second
Ukulele Experience
everything is better
with music

28. Customer Journey
...to a waiting queue..?
everything is better
with ukuleles

29. UkeX No. 2
i met a Uke on my Customer journey

30. vor
während
nach
Interesse
Abwägung
Kauf
Nutzung
„wiederkauf“
Aufm
erksam
keit!
Infos - Argumente
Bericht
Bilder Filme
Reisebüro
Web
Anzeigen
UkeX No. 2
i met a Uke on my Customer journey

31. vor
während
nach
Interesse
Abwägung
Kauf
Nutzung
„wiederkauf“
Aufm
erksam
keit!
Infos - Argumente
Bericht
Bilder Filme
Reisebüro
Web
Anzeigen
UkeX No. 2
i met a Uke on my Customer journey

32. vor
während
nach
Interesse
Abwägung
Kauf
Nutzung
„wiederkauf“
Aufm
erksam
keit!
Infos - Argumente
Sicher&
einfach
Bericht
Bilder Filme
Reisebüro Reisebüro
Web
Warenkorb
Bezahlsystem
Bestätigung
Parkplatz
Anzeigen
UkeX No. 2
i met a Uke on my Customer journey

33. vor
während
nach
Interesse
Abwägung
Kauf
Nutzung
„wiederkauf“
Aufm
erksam
keit!
Infos - Argumente
Sicher&
einfach
Bericht
Bilder Filme
Reisebüro Reisebüro
Web
Warenkorb
Bezahlsystem
Bestätigung
Parkplatz
Anzeigen
UkeX No. 2
i met a Uke on my Customer journey

34. vor
während
nach
Interesse
Abwägung
Kauf
Nutzung
„wiederkauf“
Aufm
erksam
keit!
Infos - Argumente
Sicher&
einfach
Service/Zufriedenheit
Loyalität
Bericht
Bilder Filme
Reisebüro Reisebüro
Web
Warenkorb
Bezahlsystem
Bestätigung
Parkplatz
Anzeigen
Unterlagen
Informationsangebote
Reisegutschein
Reisegutschein
Bericht
Bewertung
UkeX No. 2
i met a Uke on my Customer journey

35. Mobile Strategy disconnecting the mobile
http://vimeo.com/90042943

36. ??
?
Thank You
@casilas @dkd_de

37. 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 @casilas
istockphoto.com:
000017746481
http://vimeo.com/90042943
by @casilas