mobile 2.0: design and develop for the iphone and beyond (web 2.0 expo)

353
Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners. Mobile 2.0: Design and Develop for the iPhone and Beyond by Brian Fling Web 2.0 Expo, San Francisco, April 22, 2008

Upload: brian-fling

Post on 28-Jan-2015

112 views

Category:

Technology


3 download

DESCRIPTION

 

TRANSCRIPT

Page 1: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Mobile 2.0: Design and Develop for the iPhone and Beyondby Brian FlingWeb 2.0 Expo, San Francisco, April 22, 2008

Page 2: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

or

Page 3: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

How the iPhone Will Forever Change the Mobile Spaceby Brian FlingWeb 2.0 Expo, San Francisco, April 22, 2008

Page 4: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

or

Page 5: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Why I gave up on crappy Mobile User Experiences and fell in love with the iPhoneby Brian FlingWeb 2.0 Expo, San Francisco, April 22, 2008

Page 6: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

but

Page 7: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

these designs are

98%impractical

Page 8: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

because of...

Page 9: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Handsets!

Page 10: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Screens Sizes!

320 pixels

320 p

ixels

240 pixels

320 p

ixels

320 pixels

240 p

ixels

176 pixels

220 p

ixels

128 pixels

160 p

ixels

Page 11: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Content Adaptation!

SSR Reformat Stylesheets Mobile Specific

Page 12: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Mobile 2.0: Design and Develop for the iPhone and Beyondby Brian FlingWeb 2.0 Expo, San Francisco, April 22, 2008

Page 13: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Who is Brian?• Mobile Designer since 2000.

Page 14: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Who is Brian?• Mobile Designer since 2000.• Worked for the first MVNO in North America.

Page 15: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Who is Brian?• Mobile Designer since 2000.• Worked for the first MVNO in North America.• Has worked directly with all Tier 1 carriers in North

America and most of Tier 2.

Page 16: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Who is Brian?• Mobile Designer since 2000.• Worked for the first MVNO in North America.• Has worked directly with all Tier 1 carriers in North

America and most of Tier 2.• Helped brands like Rolling Stone, Napster & ESPN with

mobile web strategy & design.

Page 17: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Who is Brian?• Mobile Designer since 2000.• Worked for the first MVNO in North America.• Has worked directly with all Tier 1 carriers in North

America and most of Tier 2.• Helped brands like Rolling Stone, Napster & ESPN with

mobile web strategy & design.• Runs mobiledesign.org, one of the largest communities of

mobile designers.

Page 18: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Who is Brian?• Mobile Designer since 2000.• Worked for the first MVNO in North America.• Has worked directly with all Tier 1 carriers in North

America and most of Tier 2.• Helped brands like Rolling Stone, Napster & ESPN with

mobile web strategy & design.• Runs mobiledesign.org, one of the largest communities of

mobile designers.• Co-author of the dotMobi Mobile Web Developers Guide.

Page 19: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Who is Brian?• Mobile Designer since 2000.• Worked for the first MVNO in North America.• Has worked directly with all Tier 1 carriers in North

America and most of Tier 2.• Helped brands like Rolling Stone, Napster & ESPN with

mobile web strategy & design.• Runs mobiledesign.org, one of the largest communities of

mobile designers.• Co-author of the dotMobi Mobile Web Developers Guide.• Co-creator of Leaflets for the iPhone.

Page 20: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Who am I talking to?• How many are web designers or developers?

Page 21: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Who am I talking to?• How many are web designers or developers?• How many are new to mobile or the mobile web?

Page 22: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Who am I talking to?• How many are web designers or developers?• How many are new to mobile or the mobile web?• How many have created a mobile website or

mobile web application?

Page 23: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Who am I talking to?• How many are web designers or developers?• How many are new to mobile or the mobile web?• How many have created a mobile website or

mobile web application?• How many have created a mobile application

(J2ME, BREW, Flash Lite, or other)?

Page 24: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Who am I talking to?• How many are web designers or developers?• How many are new to mobile or the mobile web?• How many have created a mobile website or

mobile web application?• How many have created a mobile application

(J2ME, BREW, Flash Lite, or other)?• How many own an iPhone?

Page 25: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Who am I talking to?• How many are web designers or developers?• How many are new to mobile or the mobile web?• How many have created a mobile website or

mobile web application?• How many have created a mobile application

(J2ME, BREW, Flash Lite, or other)?• How many own an iPhone?• How many own an iPod Touch?

Page 26: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Who am I talking to?• How many are web designers or developers?• How many are new to mobile or the mobile web?• How many have created a mobile website or

mobile web application?• How many have created a mobile application

(J2ME, BREW, Flash Lite, or other)?• How many own an iPhone?• How many own an iPod Touch?• How many are just trying to figure out how to

make a buck in mobile?

Page 27: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

What is Web 2.0?

Page 28: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Page 29: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Page 30: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Page 31: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Page 32: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Page 33: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Page 34: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Web 2.0 is many things

Page 35: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Though mostly jargon.

Page 36: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

The Jargon Bucket

Page 37: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Page 38: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Jargon is dangerous when used as the solution.

Page 39: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2007 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Page 40: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

All this technology is great, but how does this address the

needs of real people?

Page 41: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

My Dad

Page 42: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

“Find a need and fill it.”

Page 43: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Balancing Goals

Busin

ess G

oals

Page 44: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Balancing Goals

User Goals

Busin

ess G

oals

Page 45: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Balancing Goals

User Goals

Busin

ess G

oals Technical Goals

Page 46: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Balancing Goals

User Goals

Busin

ess G

oals Technical Goals

SweetSpot

Page 47: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Start with a goal and REVERSE ENGINEER IT.

Page 48: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

But mostly Web 2.0 is a way to describe an evolution.

Page 49: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Web 1.0Proprietary

Walled GardensFirst to market

Brand-centered

Web 2.0StandardsWeb ServicesWeb as a PlatformUser-centered

Page 50: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Phrases & Jargon

Page 51: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Jargon Alert

MobilePortable personal communication devices able to connect voice calls or data requests wirelessly.Not to be confused with “cellular” or “cell.”

Page 52: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Jargon Alert

Mobile WebThe collective term for websites designed for viewing on a mobile device. Websites are published and accessed via the Internet just like a regular desktop website.

Page 53: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Mobile 1.0

Page 54: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Jargon Alert

Mobile 1.0The first two generations of browsers and hardware used to view the web on mobile devices. Design and development for these devices was highly di!cult due to the constraints of the technology.

Page 55: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

But the mobile ecosystem is today is far cry from the web

as we know it.

Page 56: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Operators

Networks

Handsets

Platforms

Operating Systems

Application Frameworks

Applications

Services

The mobile ecosystem has many layers. Each with their own complexities and obstacles.

Layers of Mobile

Page 57: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Operators

Networks

Handsets

Platforms

Operating Systems

Application Frameworks

Applications

Services

Layers of Mobile

Operators

A mobile network operator (MNO) also known as...• a wireless service provider• a wireless carrier• a mobile phone operator• a cellular company...is a telephone company that provides services for mobile phone subscribers.

Page 58: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Jargon Alert

Mobile Service ProviderA broad term to describe the mobile network provider that provides subscribers wireless access to voice and data services. Also known as a mobile network operator, or MNO in the telecommunications industry, though usually referred to as carriers in North America and operators elsewhere in the world.

Page 59: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Top Network Operators

Rank Company Primary Markets Network Subscribers*

1 China Mobile China (including Hong Kong) GSM, GPRS, EDGE 337.9 mil

2 VodafoneEurope, Australia, New Zealand,

Africa

GSM, GPRS, EDGE, UMTS, HSDPA 206 mil

3 Telefonica Europe, Latin AmericaGSM, GPRS, EDGE,

UMTS, HSDPA 154.8 mil

4 China Unicom China GSM, GPRS, CDMA 153.1 mil

5 America Movil Mexico, Latin AmericaGSM, GPRS, EDGE,

UMTS, CDMA 137.2 mil

6 T-Mobile Europe, USAGSM, GPRS, EDGE,

UMTS, HSDPA 111.8 mil

7 MTS RussiaGSM, GPRS, EDGE,

UMTS 74.67 mil

8 Orange Europe, Netherlands, AfricaGSM, GPRS, EDGE,

UMTS, HSDPA 73.2 mil

9 Telenor Netherlands, Eastern EuropeGSM, GPRS, EDGE,

UMTS 68 mil

10 AT&T USAGSM, GPRS, EDGE,

UMTS, HSDPA 63.7 mil

* Proportionate subscribers in millions as of June 2007. Sources: Companies Annual Reports

Page 60: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Jargon Alert

ARPUAverage Revenue Per UserA term used to describe the financial value of a program, application or service.

Page 61: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Operators

Networks

Handsets

Platforms

Operating Systems

Application Frameworks

Applications

Services

Layers of Mobile

Networks

Mobile networks communicate through electromagnetic radio waves with a cell site base station, the antennas of which are usually mounted on a tower, pole or building.They are often referred to by their generation and/or standard.

Page 62: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Jargon Alert

G as in 2G, 2.5G and 3G.

The generations of mobile networks.O!cially there are only 1G, 2G & 3G, but several midpoints have been defined as 2.5G, 2.75G, etc.

Page 63: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

GSM Mobile Networks

2G Second generation of mobile phone standards and technology Speeds

GSM Global System for Mobile communications 12.2 kbits/s

GPRS General Packet Radio Service max 60 kbits/s

EDGE Enhanced Data rates for GSM Evolution 59.2 kbits/s

HSCSD High-Speed Circuit-Switched Data 57.6 kbits/s

3G Third generation of mobile phone standards and technology Speeds

W-CDMA Wideband Code Division Multiple Access 14.4 Mbits/s

UMTS Universal Mobile Telecommunications System 3.6 Mbits/s

UMTS-TDD Time Division Duplexing 16 Mbits/s

TD-CDMA Time Divided Code Division Multiple Access 16 Mbits/s

HSPA High-Speed Packet Access 14.4 Mbits/s

HSDPA High-Speed Downlink Packet Access 14.4 Mbits/s

HSUPA High-Speed Uplink Packet Access 5.76 Mbit/s

Page 64: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Other Network Technologies• CDMA & EVDO• iDEN & WiDEN• WiMAX

Worldwide Interoperability for Microwave Access, is a telecommunications technology aimed at providing wireless data over long distances in a variety of ways, from point-to-point links to full mobile cellular type access. WiMAX allows a user, for example, to browse the Internet on a laptop computer without physically connecting the laptop to a router or switch port via an ethernet port.

Page 65: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Operators

Networks

Handsets

Platforms

Operating Systems

Application Frameworks

Applications

Services

Layers of Mobile

Handsets

A mobile handset or “mobile phone” is a long-range, portable electronic device used for mobile communication.

Page 66: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Many Flavors of Handsets

Page 67: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Comparing Mobile Devices

Feature PhonesPhone, Web, SMS

Smart PhonesApplications

Other

Page 68: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Operators

Networks

Handsets

Platforms

Operating Systems

Application Frameworks

Applications

Services

Layers of Mobile

Platforms

The core mobile development platform in which all software is written.

Page 69: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Mobile Platforms

Licensed

Java ME

Java ME (previously known as Java 2 Platform, Micro Edition or J2ME) is a specification of a subset of the Java platform aimed at providing a certified collection of Java APIs for the development of software for small, resource-constrained devices such as cell phones, PDAs and set-top boxes.

BREWBREW is an application development platform created by Qualcomm for mobile phones. It is air-interface independent, i.e. it can support GSM/GPRS, UMTS, and CDMA

Windows MobileWindows Mobile is a compact operating system combined with a suite of basic applications for mobile devices based on the Microsoft Win32 API

Proprietary

Palm C/C++ based

RIM’s BlackBerry Java-based

Danger’s Hiptop Java-based

Apple’s iPhone Objective-C

Page 70: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Operators

Networks

Handsets

Platforms

Operating Systems

Application Frameworks

Applications

Services

Layers of Mobile

Operating Systems

Operating systems are common in Smart Phones, but rare in Feature phones.

Page 71: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Mobile Operating Systems

Symbian

Symbian OS is a proprietary operating system, designed for mobile

devices, with associated libraries, user interface frameworks and

reference implementations of common tools.

Windows Mobile 6Windows Mobile is a compact operating system combined with a suite of basic applications for mobile devices based on the Microsoft Win32 API

Palm OSUsed by Palm’s TREO line of mobile phones, though gradually being replaced by Windows Mobile.

LinuxIncreasingly used in mobile phones. Motorola announced the next RAZR will use Linux as its Operating System.

OS X Used by Apple’s iPhone.

Page 72: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Operators

Networks

Handsets

Platforms

Operating Systems

Application Frameworks

Applications

Services

Layers of Mobile

Application Frameworks

A software framework that is used to implement the standard structure of an application for a specific operating system.

Page 73: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Application Frameworks

JavaApplications written in the Java ME framework can often be deployed

across the majority of Java-based devices.

BREWApplications written in the BREW framework can often be deployed across the majority of BREW-based devices.

Flash LiteApplications written using the Flash Lite 2.0 and Action Script 2.0 frameworks can run using the Flash Lite Player.

Windows Mobile 6Applications written using the Win32 API can be deployed across the majority of Windows Mobile-based devices.

WebWeb Applications can be deployed across the majority of devices that support the WAP 2.0 specifications and run using a mobile web browser.

Page 74: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Operators

Networks

Handsets

Platforms

Operating Systems

Application Frameworks

Applications

Services

Layers of Mobile

Applications

Mobile applications often are designed to serve a particular function or purpose.Example applications may include Games, Web Browser, Camera or Media Player.

Page 75: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Operators

Networks

Handsets

Platforms

Operating Systems

Application Frameworks

Applications

Services

Layers of Mobile

ServicesNetwork-based services are often available at the Application, Framework, or OS level to enhance the relevance of information.Example services may include The Internet, Messaging or Location.

Page 76: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Page 77: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Why Mobile?

Page 78: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

...just how big is the Mobile Web?

Page 79: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Population of the EarthSource: Wikipedia

Page 80: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Population of the EarthSource: Wikipedia

20 Million

Page 81: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Population of the EarthSource: Wikipedia

United Kingdom (50m)

20 Million

Page 82: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Population of the EarthSource: Wikipedia

United Kingdom (50m)

United States of America (303m)

20 Million

Page 83: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Population of the EarthSource: Wikipedia

United Kingdom (50m)

United States of America (303m)

European Union (495m)

20 Million

Page 84: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Population of the EarthSource: Wikipedia

United Kingdom (50m)

United States of America (303m)

European Union (495m)

China (1.3 billion)

20 Million

Page 85: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Mobile Web of Today

Page 86: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Mobile Web of Today

Mobile Users (2.9b)

Page 87: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Mobile Web of Today

Mobile Users (2.9b)

Mobile Web Access (1.3b)

Page 88: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Mobile Web of TodaySources: GSM Association, T-Mobile, Credit Suisse, Pyramid Research

Mobile Users (2.9b)

Mobile Web Access (1.3b)

Desktop Web Access (1.1b)

Page 89: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Mobile Web of Tomorrow

Mobile Web Subscribersby 2010

Page 90: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Mobile Web of Tomorrow

Mobile Web Subscribersby 2010

Source: Informa Telecoms & Media 2006

Page 91: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Mobile will REVOLUTIONIZE the way we gather and interact

with information in the NEXT TWO YEARS.

Page 92: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Mobile has the potential to reach anybody through

ANY MEDIUM.

Page 93: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

MassMedia7th

Page 94: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Tomi Ahonen3G Strategy Consultant

Page 95: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Mass Media

1. Printing Press

7 th

Page 96: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Mass Media

1. Printing Press2.Recordings

7 th

Page 97: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Mass Media

1. Printing Press2.Recordings3. Cinema

7 th

Page 98: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Mass Media

1. Printing Press2.Recordings3. Cinema4.Radio

7 th

Page 99: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Mass Media

1. Printing Press2.Recordings3. Cinema4.Radio5. Television

7 th

Page 100: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Mass Media

1. Printing Press2.Recordings3. Cinema4.Radio5. Television6.The Internet

7 th

Page 101: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Mass Media

1. Printing Press2.Recordings3. Cinema4.Radio5. Television6.The Internet7.Mobile

7 th

Page 102: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

5 unique benefits1. First truly personal mass media

e.g. We don’t share our phones with our spouses.

Page 103: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

5 unique benefits1. First truly personal mass media

e.g. We don’t share our phones with our spouses.

2. First always-on mass mediaInformation is always available 24/7, even when idle.

Page 104: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

5 unique benefits1. First truly personal mass media

e.g. We don’t share our phones with our spouses.

2. First always-on mass mediaInformation is always available 24/7, even when idle.

3. First always-carried mass media7 out of 10 people sleep with their phone within reach.

Page 105: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

5 unique benefits1. First truly personal mass media

e.g. We don’t share our phones with our spouses.

2. First always-on mass mediaInformation is always available 24/7, even when idle.

3. First always-carried mass media7 out of 10 people sleep with their phone within reach.

4. Only mass media with a built in payment channelUniversal click to buy. Twice as many people have phones than credit cards.

Page 106: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

5 unique benefits1. First truly personal mass media

e.g. We don’t share our phones with our spouses.

2. First always-on mass mediaInformation is always available 24/7, even when idle.

3. First always-carried mass media7 out of 10 people sleep with their phone within reach.

4. Only mass media with a built in payment channelUniversal click to buy. Twice as many people have phones than credit cards.

5. O!ers point of thoughtAbility to create or consume content whenever the mood strikes.

Page 107: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Mobile is the only mass media that can do EVERYTHING the

previous six can do.

Page 108: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Events

TV

Billboard

Radio

Live

Website

Auditory

KinestheticVisu

al

Word of Mouth

Print Ad

Mobile Device

IVR

SMS

IVR

SMS

WAP

SMS

QR Code

SMS

QR Code

SMS

SMSMMS

SMS

WAP

SMS

SMS

Bluetooth

Notify

WAP

WAP

MMS

Email

Send to Friend

WAP Site

Notify

Buy

WAP SiteWAP Site

Send to Friend

Join

Buy

NotifyNotify

Send to Friend

Post WAP Site

MMS

Send to Friend

Notify

Send to Friend

Join

Discuss

Send to Friend

Notify

Download

DownloadNotify

Vote

Join

Vote

Notify

Buy

Send to Friend

Notify

Page 109: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Jargon Alert

LBSLocation-based ServicesThe ability for a mobile device to provide information that is relevant to it’s physical location via a Global Positioning System (GPS).

Page 110: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Triangulation

Page 111: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Prepare for a trulyCONTEXTUAL WEB.

Page 112: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

The 3 C’s of the Mobile Web• Cost

If you don't develop your mobile website responsibly, the user could get stuck with a big bill in order to view your content.

Page 113: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

The 3 C’s of the Mobile Web• Cost

If you don't develop your mobile website responsibly, the user could get stuck with a big bill in order to view your content.

• ContentIssues like navigation, image sizes, page weight and scripts all need to be considered when thinking about your website on mobile devices.

Page 114: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

The 3 C’s of the Mobile Web• Cost

If you don't develop your mobile website responsibly, the user could get stuck with a big bill in order to view your content.

• ContentIssues like navigation, image sizes, page weight and scripts all need to be considered when thinking about your website on mobile devices.

• ContextWhat does your website add to the users mobility? How do you add value to the their physical context? What is the context in which they will use your site? On a bus or train?

Page 115: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Jargon Alert

ContextThe circumstances that form the setting for an event, statement, or idea, and in terms of which it can be fully understood and assessed.Considered together with the surroundings or circumstances.

Page 116: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Designing for Context• Address the inherent benefits of the media.

Page 117: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Designing for Context• Address the inherent benefits of the media.• Look at your content in multiple facets of

distribution.

Page 118: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Designing for Context• Address the inherent benefits of the media.• Look at your content in multiple facets of

distribution.• Create solutions based on goals.

Page 119: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Designing for Context• Address the inherent benefits of the media.• Look at your content in multiple facets of

distribution.• Create solutions based on goals.• Balance the constraints of the technology.

Page 120: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Designing for Context• Address the inherent benefits of the media.• Look at your content in multiple facets of

distribution.• Create solutions based on goals.• Balance the constraints of the technology.• Remember physical context.

Page 121: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Designing for Context• Address the inherent benefits of the media.• Look at your content in multiple facets of

distribution.• Create solutions based on goals.• Balance the constraints of the technology.• Remember physical context.• Adapt content for multiple contexts.

Page 122: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Adapt forMULTIPLE CONTEXTS

Page 123: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Jargon Alert

AdaptationThe process of dynamically optimizing content to the restrictions of the requesting device. The adaptation model relies on the mobile device’s user agent profile to tell the server to deliver markup or images based on the browser, screen size and device capabilities.

Page 124: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Handsets!

Page 125: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

98%impractical

Page 126: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Jargon Alert

AdaptationThe process of dynamically optimizing content to the restrictions of the requesting device. The adaptation model relies on the mobile device’s user agent profile to tell the server to deliver markup or images based on the browser, screen size and device capabilities.

Page 127: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Jargon Alert

AdaptationThe process of dynamically optimizing content to the restrictions of the requesting device. The adaptation model relies on the mobile device’s user agent profile to tell the server to deliver markup or images based on the browser, screen size and device capabilities.

Page 128: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Adapt forMULTIPLE CONTEXTS

Page 129: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Adapt to di!erent MEDIUMS.

Page 130: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Mass Media

1. Printing Press2.Recordings3. Cinema4.Radio5. Television6.The Internet7.Mobile

7 th

Page 131: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Jargon Alert

One WebThe principle of making the same information and services to users regardless of the device used.This is a very misunderstood, misused and commonly debated concept.

Page 132: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Mobile is the only mass media that can do EVERYTHING the

previous six can do.

Page 133: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Jargon Alert

One WebThe principle of making the same information and services to users regardless of the device used.This is a very misunderstood, misused and commonly debated concept.

Page 134: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Jargon Alert

One WebThe principle of making the same information and services to users regardless of the device used.This is a very misunderstood, misused and commonly debated concept.

Page 135: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

the mythical“Future-Phone”

Page 136: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Change occurs because there is a gap between what is and what should be.

— Craig McCaw

Page 137: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

We are at the precipice of the next generation of

THE WEB.

Page 138: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Page 139: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

The iPhone is the shape of things to come.

Page 140: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Mobile Evolution

1980

Basic Phones

Feature Phones

Smart Phones

iPhone

1990 2000 2010

Page 141: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Mobile Evolution

1980

Basic Phones

Feature Phones

Smart Phones

iPhone

1990 2000 2010

Page 142: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Mobile Evolution

1980

Basic Phones

Feature Phones

Smart Phones

iPhone

1990 2000 2010

Page 143: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Mobile Evolution

1980

Basic Phones

Feature Phones

Smart Phones

iPhone

1990 2000 2010

Page 144: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Mobile Evolution

1980

Basic Phones

Feature Phones

Smart Phones

iPhone

1990 2000 2010

Page 145: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Mobile Evolution

1980

Basic Phones

Feature Phones

Smart Phones

iPhone

1990 2000 2010

Page 146: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Mobile 2.0

Page 147: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Jargon Alert

Mobile 2.0The convergence of mobile services and web services. The promise of Mobile 2.0 is to add portability, ubiquitous connectivity and location-based services to enhance information and services found on the web.

Page 148: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Web 1.0Proprietary

Walled GardensFirst to market

Brand-centered

Web 2.0StandardsWeb ServicesWeb as a PlatformUser-centered

Page 149: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Page 150: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

10 Things I Learned at Mobile 2.0

• #1 Mobile 2.0 = The web

Page 151: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

10 Things I Learned at Mobile 2.0

• #1 Mobile 2.0 = The web• The mobile web browser is the next killer app

Page 152: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

10 Things I Learned at Mobile 2.0

• #1 Mobile 2.0 = The web• The mobile web browser is the next killer app• Mobile Web Applications are the future

Page 153: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

10 Things I Learned at Mobile 2.0

• #1 Mobile 2.0 = The web• The mobile web browser is the next killer app• Mobile Web Applications are the future• AJAX is the next frontier

Page 154: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

10 Things I Learned at Mobile 2.0

• #1 Mobile 2.0 = The web• The mobile web browser is the next killer app• Mobile Web Applications are the future• AJAX is the next frontier• Rich Interactions kill battery life

Page 155: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

10 Things I Learned at Mobile 2.0

• #1 Mobile 2.0 = The web• The mobile web browser is the next killer app• Mobile Web Applications are the future• AJAX is the next frontier• Rich Interactions kill battery life• The Mobile User Experience Sucks

Page 156: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

10 Things I Learned at Mobile 2.0

• #1 Mobile 2.0 = The web• The mobile web browser is the next killer app• Mobile Web Applications are the future• AJAX is the next frontier• Rich Interactions kill battery life• The Mobile User Experience Sucks• Mobile Widgets are the next big thing

Page 157: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

10 Things I Learned at Mobile 2.0

• #1 Mobile 2.0 = The web• The mobile web browser is the next killer app• Mobile Web Applications are the future• AJAX is the next frontier• Rich Interactions kill battery life• The Mobile User Experience Sucks• Mobile Widgets are the next big thing• The Carrier is the new “C” word

Page 158: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

10 Things I Learned at Mobile 2.0

• #1 Mobile 2.0 = The web• The mobile web browser is the next killer app• Mobile Web Applications are the future• AJAX is the next frontier• Rich Interactions kill battery life• The Mobile User Experience Sucks• Mobile Widgets are the next big thing• The Carrier is the new “C” word• We are creators not consumers

Page 159: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Mobile 1.0Proprietary

Walled GardensFirst to market

Brand-centered

Mobile 2.0StandardsWeb ServicesWeb as a PlatformUser-centered

Page 160: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

We are at the precipice of the next generation of

THE WEB.

Page 161: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Two companies in particular are making that happen...

Page 162: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Page 163: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Page 164: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

but lets not forget...

Page 165: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Page 166: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

The iPhone

Page 167: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

A Confession

Page 168: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Page 169: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Page 170: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Page 171: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Page 172: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Page 173: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

The iPhone

Page 174: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

From many perspectives the iPhone is not revolutionary.

Page 175: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

But it is creating a revolution none-the-less.

Page 176: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

The iPhone is the shape of things to come.

Page 177: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

iPhone Strengths1. Smart phone for the

masses

Page 178: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

iPhone Strengths1. Smart phone for the

masses2. Flat-rate data plan

Page 179: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

iPhone Strengths1. Smart phone for the

masses2. Flat-rate data plan3. Device sold and

supported outside the carrier

Page 180: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

iPhone Strengths1. Smart phone for the

masses2. Flat-rate data plan3. Device sold and

supported outside the carrier

4. No subsidization

Page 181: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

iPhone Strengths1. Smart phone for the

masses2. Flat-rate data plan3. Device sold and

supported outside the carrier

4. No subsidization5. Updatable software

Page 182: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

iPhone Strengths1. Smart phone for the

masses2. Flat-rate data plan3. Device sold and

supported outside the carrier

4. No subsidization5. Updatable software

(4 updates in 9 months)

Page 183: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

iPhone Strengths1. Smart phone for the

masses2. Flat-rate data plan3. Device sold and

supported outside the carrier

4. No subsidization5. Updatable software

(4 updates in 9 months)

6. Location awareness

Page 184: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

iPhone Strengths1. Smart phone for the

masses2. Flat-rate data plan3. Device sold and

supported outside the carrier

4. No subsidization5. Updatable software

(4 updates in 9 months)

6. Location awareness7. Resetting bandwidth

expectations

Page 185: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

iPhone Strengths1. Smart phone for the

masses2. Flat-rate data plan3. Device sold and

supported outside the carrier

4. No subsidization5. Updatable software

(4 updates in 9 months)

6. Location awareness7. Resetting bandwidth

expectations8. Portable device

convergence

Page 186: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

iPhone Strengths1. Smart phone for the

masses2. Flat-rate data plan3. Device sold and

supported outside the carrier

4. No subsidization5. Updatable software

(4 updates in 9 months)

6. Location awareness7. Resetting bandwidth

expectations8. Portable device

convergence 9. Web & mobile

standards

Page 187: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

iPhone Strengths1. Smart phone for the

masses2. Flat-rate data plan3. Device sold and

supported outside the carrier

4. No subsidization5. Updatable software

(4 updates in 9 months)

6. Location awareness7. Resetting bandwidth

expectations8. Portable device

convergence 9. Web & mobile

standards10.Impact on developer

communities

Page 188: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

iPhone sales reached 4M in the first 90 days, means around 2.5M in the last quarter, reaching almost 20% of the market share. Probably the Fastest ramp-up of any consumer electronics device known to mankind.

— Chetan Sharma

Page 189: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Apple estimates 10 million iPhones sold by the end of

2008.

Page 190: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

70%complete

Page 191: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

1457 Mobile Web Apps!

Page 192: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

131 new mobile web apps in the last 14 days!

Page 193: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Over 600 new mobile web apps in the last 60 days!

Page 194: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Page 195: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Page 196: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Page 197: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Page 198: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Page 199: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

The iPhone is shifting perceptions of what mobile

technology can do.

Page 200: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

And people are eating it up!

Page 201: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

In fact...

Page 202: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

I believe that the iPhone will be so influential I’m putting

my livelihood to the test.

Page 203: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Page 204: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Page 205: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

When we talk about iPhone, we’re really talking about

WEBKIT.

Page 206: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Nokia N95

Page 207: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Android

Page 208: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Look Familiar?

Page 209: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

iPod Touch

Page 210: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

The iPod touch is an

“entirely new type of

iPod,” one that Apple

sees moving the iPod

beyond its roots as a

mere media player,

becoming “the first

mainstream Wi-Fi mobile

platform.

—Peter Oppenheimer, Apple CFO

Page 211: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Over 22 million iPods sold in Q1 of 2008. Over 140 million iPods sold in less

than six years.

Page 212: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Web App oriPhone App?

Page 213: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

iPhone Software Roadmap

Page 214: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

iPhone Software Roadmap

iPhone Software Development Kit

Get the tools you need to

build your own iPhone

applications.

Page 215: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

iPhone Software Roadmap

iPhone Software Development Kit

Get the tools you need to

build your own iPhone

applications.

Downloaded 100,000 times in 4 days

Page 216: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

iPhone Software Roadmap

iPhone Software Development Kit

Get the tools you need to

build your own iPhone

applications.

iPhone Enterprise Beta Program

Test pre-release iPhone

software with enterprise

features in your workplace.

Downloaded 100,000 times in 4 days

Page 217: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

iPhone Dev Center

Page 218: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Types of iPhone Applications

Productivity Utility Immersive

Page 219: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Types of iPhone Applications

Productivity Utility Immersive

Page 220: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Types of iPhone Applications

Productivity Utility Immersive

Page 221: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Types of iPhone Applications

Productivity Utility Immersive

Page 222: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

But are mobile applications a good idea?

Page 223: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Web App iPhone App

Page 224: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Web App iPhone AppUses Web Standards

Page 225: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Web App iPhone AppUses Web StandardsEasy to deploy and update

Page 226: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Web App iPhone AppUses Web StandardsEasy to deploy and updateSupport all Mobile 2.0 devices

Page 227: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Web App iPhone AppUses Web StandardsEasy to deploy and updateSupport all Mobile 2.0 devicesCan have a Web App in two weeks or less.

Page 228: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Web App iPhone AppUses Web StandardsEasy to deploy and updateSupport all Mobile 2.0 devicesCan have a Web App in two weeks or less.Web Apps can be added to the Desktop

Page 229: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Web App iPhone AppUses Web StandardsEasy to deploy and updateSupport all Mobile 2.0 devicesCan have a Web App in two weeks or less.Web Apps can be added to the DesktopMust have an Internet connection

Page 230: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Web App iPhone AppUses Web StandardsEasy to deploy and updateSupport all Mobile 2.0 devicesCan have a Web App in two weeks or less.Web Apps can be added to the DesktopMust have an Internet connection

Takes advantage of iPhone features:

Page 231: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Web App iPhone AppUses Web StandardsEasy to deploy and updateSupport all Mobile 2.0 devicesCan have a Web App in two weeks or less.Web Apps can be added to the DesktopMust have an Internet connection

Takes advantage of iPhone features:e.g. Camera, Photos, Address Book, Accelerometer, etc

Page 232: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Web App iPhone AppUses Web StandardsEasy to deploy and updateSupport all Mobile 2.0 devicesCan have a Web App in two weeks or less.Web Apps can be added to the DesktopMust have an Internet connection

Takes advantage of iPhone features:e.g. Camera, Photos, Address Book, Accelerometer, etc

Loads Wicked Fast

Page 233: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Web App iPhone AppUses Web StandardsEasy to deploy and updateSupport all Mobile 2.0 devicesCan have a Web App in two weeks or less.Web Apps can be added to the DesktopMust have an Internet connection

Takes advantage of iPhone features:e.g. Camera, Photos, Address Book, Accelerometer, etc

Loads Wicked FastNeed to know Objective-C

Page 234: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Web App iPhone AppUses Web StandardsEasy to deploy and updateSupport all Mobile 2.0 devicesCan have a Web App in two weeks or less.Web Apps can be added to the DesktopMust have an Internet connection

Takes advantage of iPhone features:e.g. Camera, Photos, Address Book, Accelerometer, etc

Loads Wicked FastNeed to know Objective-CWorks only with iPhone and iPod Touch

Page 235: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Web App iPhone AppUses Web StandardsEasy to deploy and updateSupport all Mobile 2.0 devicesCan have a Web App in two weeks or less.Web Apps can be added to the DesktopMust have an Internet connection

Takes advantage of iPhone features:e.g. Camera, Photos, Address Book, Accelerometer, etc

Loads Wicked FastNeed to know Objective-CWorks only with iPhone and iPod TouchMust deploy over Apple’s iPhone store (or deck)

Page 236: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Jargon Alert

DeckRefers to the web presence maintained by a carrier. When you access the web from a mobile device, the first page you see is often referred to as the carrier deck. But is commonly used to refer to all mobile web sites.Origins: Hypercard development

Page 237: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Top-Deck = Increased ViewsLower Deck = Oblivion

Page 238: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Jargon Alert

Deck PlacementThe term used to describe where a third-party vendor WAP site, or application will appear on the Carrier Deck. Default order on content on most Carrier Decks is determined by sales. New items often have temporary “Top-Deck Placement”

Page 239: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Building a great mobile user experience is hard.

Go easy on yourself bystarting simple.

Page 240: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Build Web Apps first.iPhone Apps second.

Page 241: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Build Web Apps first.iPhone Apps second.

(if at all)

Page 242: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

WebKitWeb Apps

Page 243: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Mobile WebKit Features• Supports all standard flavors of

XHTML

Page 244: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Mobile WebKit Features• Supports all standard flavors of

XHTML• Supports CSS 1, 2 and a good deal

of CSS 3

Page 245: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Mobile WebKit Features• Supports all standard flavors of

XHTML• Supports CSS 1, 2 and a good deal

of CSS 3• Javascript (including Ajax)

Page 246: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Mobile WebKit Features• Supports all standard flavors of

XHTML• Supports CSS 1, 2 and a good deal

of CSS 3• Javascript (including Ajax)• This means complex layouts,

styling and interaction...

Page 247: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Plus WebKit can display full websites. As in, the real web.

Page 248: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

WTF?

Page 249: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Jargon Alert

One WebThe principle of making the same information and services to users regardless of the device used.This is a very misunderstood, misused and commonly debated concept.

Page 250: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

The Speed Reality

Page 251: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

EDGE

EDGE

200 kbps

Max Speed Actual Average

Page 252: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

EDGE

EDGE

200 kbps

125 kbps

Max Speed Actual Average

Page 253: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Wi-Fi via Broadband

WiFi

54 mbps

Max Speed Actual Average

Page 254: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Wi-Fi via Broadband

WiFi

54 mbps

4 mbps

Max Speed Actual Average

Page 255: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

EDGE vs. Wi-Fi

Actual Average

WiFi

EDGE

4.00 mbps

Page 256: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

EDGE vs. Wi-Fi

Actual Average

WiFi

EDGE

4.00 mbps

0.13 mbps

Page 257: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

32x slower!

EDGE vs. Wi-Fi

Actual Average

WiFi

EDGE

4.00 mbps

0.13 mbps

Page 258: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

A 300kb file on EDGE vs. Wi-Fi

Page 259: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

While the iPhone has Wi-Fi, we cannot rely on it.

Page 260: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

It isn’t about...

Page 261: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Jargon Alert

One WebThe principle of making the same information and services to users regardless of the device used.This is a very misunderstood, misused and commonly debated concept.

Page 262: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

It’s about...

Page 263: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Using the tools, know-how and resources to be able to

cost e!ectively build for the mobile context.

Page 264: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

The iPhone

Page 265: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Mobile websites have never been so easy to create and look good in the process.

Page 266: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

iPhone apps that grow on you.

Page 267: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Why Create Leaflets?

We wanted to showcase

(Blog Post Why we made Leaflets)

Page 268: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Why Create Leaflets?

We wanted to showcase

...the merger of Web 2.0 and Mobile 2.0

(Blog Post Why we made Leaflets)

Page 269: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Why Create Leaflets?

We wanted to showcase

...the merger of Web 2.0 and Mobile 2.0

...the use of web standards in mobile

(Blog Post Why we made Leaflets)

Page 270: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Why Create Leaflets?

We wanted to showcase

...the merger of Web 2.0 and Mobile 2.0

...the use of web standards in mobile

...designing for the mobile context

(Blog Post Why we made Leaflets)

Page 271: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Why Create Leaflets?

We wanted to showcase

...the merger of Web 2.0 and Mobile 2.0

...the use of web standards in mobile

...designing for the mobile context

...mobile web best practices

(Blog Post Why we made Leaflets)

Page 272: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Why Create Leaflets?

We wanted to showcase

...the merger of Web 2.0 and Mobile 2.0

...the use of web standards in mobile

...designing for the mobile context

...mobile web best practices

...designing for the iPhone

(Blog Post Why we made Leaflets)

Page 273: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Why Create Leaflets?

We wanted to showcase

...the merger of Web 2.0 and Mobile 2.0

...the use of web standards in mobile

...designing for the mobile context

...mobile web best practices

...designing for the iPhone

...rapid and iterative development

(Blog Post Why we made Leaflets)

Page 274: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Quick Demo

Page 275: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

The Home Screen

Page 276: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Feeds

Page 277: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Feeds

Page 278: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Newsvine

Page 279: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

App List

Page 280: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Upcoming

Page 281: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Flickr

Page 282: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

del.icio.us

Page 283: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Tour de France

Page 284: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

New York Times

Page 285: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

SimpleXHTML & CSS

Page 286: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

SimpleXHTML & CSS

(and Web Standard too!)

Page 287: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Home Icon XHTML

<div id="apps">

<ul>

<li id="navSearch"><a href="search/">Search</a></li>

<li id="navRSS"><a href="feeds/">Feeds</a></li>

<li id="navNewsvine"><a href="newsvine">Newsvine</a></li>

<li id="navLinks"><a href="applist/">App List</a></li>

<li id="navEvents"><a href="upcoming/">Upcoming</a></li>

<li id="navFlickr"><a href="flickr/">Flickr</a></li>

<li id="navDelicious"><a href="delicious/">del.icio.us</a></li>

<li id="navBaseball"><a href="scores/">Baseball</a></li>

<li id="navNYT"><a href="nyt/">NY Times</a></li>

<?php if ($_user): ?>

<li id="navSettings"><a href="user/settings.php">Settings</a></li>

<?php endif; ?>

</ul>

<div id="loading_status"><img id="loader" src="/media/images/loader.gif" border="0"

alt="" /><span id="ltext">Loading icons...</span></div>

</div>

Page 288: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Home Icon CSS

#apps li {

float: left;

width: 56px;

height: 56px;

border: 1px hidden #666;

-webkit-border-radius: 10px;

text-align: center;

background: #666 url(/media/images/button_glare.png) no-repeat;

-webkit-box-shadow: 0px 1px 3px black;

margin: 7px 10px 20px;

}

#apps li a {

text-decoration: none;

color: #999;

display: block;

padding-top: 60px;

font-weight: bold;

font-size: 0.8em;

}

li#navNewsvine {

background: url(/media/images/button_glare.png) no-repeat, url(/media/images/

home_newsvine_low.png) no-repeat;

background-color: #005422;

}

Page 289: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Controls CSS

Page 290: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Newsvine Leaflet CSS

Page 291: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

CSS 3 Baby!

Page 292: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Using CSS3

Page 293: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Using CSS3

+ 3 Kilobytes

Page 294: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Using CSS3

+ 320 bytes

+ 3 Kilobytes

Page 295: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Using CSS3

+ 320 bytes

+ 3 Kilobytes

-webkit-border-radius: 10px;+

Page 296: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Using CSS3

+ 320 bytes

+ 3 Kilobytes

-webkit-border-radius: 10px;+

Page 297: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Using CSS3

+ 320 bytes

+ 3 Kilobytes

-webkit-border-radius: 10px;+

Page 298: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Conditional CSS

Page 299: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Using Media Queries• Calling an iPhone stylesheet:

Page 300: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Using Media Queries• Calling an iPhone stylesheet:

<link media="only screen and (max-device-width: 480px)" href="iphone.css" type= "text/css" rel="stylesheet">

Page 301: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Using Media Queries• Calling an iPhone stylesheet:

<link media="only screen and (max-device-width: 480px)" href="iphone.css" type= "text/css" rel="stylesheet">

• To specify a stylesheet for everything else:

Page 302: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Using Media Queries• Calling an iPhone stylesheet:

<link media="only screen and (max-device-width: 480px)" href="iphone.css" type= "text/css" rel="stylesheet">

• To specify a stylesheet for everything else:<link media="screen and (min-device-width: 481px)" href="other.css" type="text/css" rel="stylesheet">

Page 303: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Using Media Queries• Calling an iPhone stylesheet:

<link media="only screen and (max-device-width: 480px)" href="iphone.css" type= "text/css" rel="stylesheet">

• To specify a stylesheet for everything else:<link media="screen and (min-device-width: 481px)" href="other.css" type="text/css" rel="stylesheet">

• Do not use:

Page 304: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Using Media Queries• Calling an iPhone stylesheet:

<link media="only screen and (max-device-width: 480px)" href="iphone.css" type= "text/css" rel="stylesheet">

• To specify a stylesheet for everything else:<link media="screen and (min-device-width: 481px)" href="other.css" type="text/css" rel="stylesheet">

• Do not use:<link media="handheld" href="mobile.css" type="text/css" rel="stylesheet">

Page 305: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Simple Device Detection

Page 306: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Device Detection• Use a simple Javascript redirect WebKit

browsers:<script type="text/javascript" charset="utf-8">

if (navigator.userAgent.match(/AppleWebKit/i) && navigator.userAgent.match(/Mobile/i)) { window.location.replace('/path/to/site/'); }</script>

• Or you can use other methods of Device Detection:

Server RedirectsWURFL (http://wurfl.sourceforge.net/)

PHP (http://www.andymoore.info/php-to-detect-mobile-phones/)

URLs (e.g. m.domain.co.uk, domain.co.uk/m, domain.mobi)

Page 307: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Technical Limitations

Page 308: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Limitations Imposed• 10MB download limit

Page 309: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Limitations Imposed• 10MB download limit• JavaScript execution time limit of 5

seconds for each top-level item

Page 310: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Limitations Imposed• 10MB download limit• JavaScript execution time limit of 5

seconds for each top-level item• No Flash

Page 311: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Limitations Imposed• 10MB download limit• JavaScript execution time limit of 5

seconds for each top-level item• No Flash• No Java

Page 312: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Limitations Imposed• 10MB download limit• JavaScript execution time limit of 5

seconds for each top-level item• No Flash• No Java• No mouse-over, hover, tooltip mouse

events

Page 313: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Limitations Imposed• 10MB download limit• JavaScript execution time limit of 5

seconds for each top-level item• No Flash• No Java• No mouse-over, hover, tooltip mouse

events• No file downloads or uploads!

Page 314: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Design Shortcuts

Page 315: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Kits for iPhone Design• iUI by Joe Hewitt

Page 316: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Kits for iPhone Design• iUI by Joe Hewitt• Google Web Toolkit (GWT)

Page 317: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Kits for iPhone Design• iUI by Joe Hewitt• Google Web Toolkit (GWT)• Yahoo! User Interface Library

(YUI)

Page 318: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Kits for iPhone Design• iUI by Joe Hewitt• Google Web Toolkit (GWT)• Yahoo! User Interface Library

(YUI)• Many icon and interface design

kits released

Page 319: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

We Suggest Finding Your Own Design Path

Page 320: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Compression is Your Friend

Page 321: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Save Space• Use ob_start("ob_gzhandler") for PHP content

Page 322: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Save Space• Use ob_start("ob_gzhandler") for PHP content• Remove whitespace from HTML and CSS

Page 323: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Save Space• Use ob_start("ob_gzhandler") for PHP content• Remove whitespace from HTML and CSS• Refactor JavaScript code to be more e"cient and

then remove unnecessary brackets and semi-colons

Page 324: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Save Space• Use ob_start("ob_gzhandler") for PHP content• Remove whitespace from HTML and CSS• Refactor JavaScript code to be more e"cient and

then remove unnecessary brackets and semi-colons

• Compress images or use CSS where possible

Page 325: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Save Space• Use ob_start("ob_gzhandler") for PHP content• Remove whitespace from HTML and CSS• Refactor JavaScript code to be more e"cient and

then remove unnecessary brackets and semi-colons

• Compress images or use CSS where possible• Cache data on the server for fastest possible

loading times

Page 326: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Conclusions

Page 327: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

A Successful Experiment• Leaflets entire application was built between

WWDC and the iPhone launch (3 weeks)

Page 328: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

A Successful Experiment• Leaflets entire application was built between

WWDC and the iPhone launch (3 weeks)• TechCrunch called it a “Must-Have iPhone App”

Page 329: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

A Successful Experiment• Leaflets entire application was built between

WWDC and the iPhone launch (3 weeks)• TechCrunch called it a “Must-Have iPhone App”• 105,000 hits the first week to website

Page 330: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

A Successful Experiment• Leaflets entire application was built between

WWDC and the iPhone launch (3 weeks)• TechCrunch called it a “Must-Have iPhone App”• 105,000 hits the first week to website• 12,000 unique app users the first week

Page 331: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

A Successful Experiment• Leaflets entire application was built between

WWDC and the iPhone launch (3 weeks)• TechCrunch called it a “Must-Have iPhone App”• 105,000 hits the first week to website• 12,000 unique app users the first week• 7,000 recurring app users per week

Page 332: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

A Successful Experiment• Leaflets entire application was built between

WWDC and the iPhone launch (3 weeks)• TechCrunch called it a “Must-Have iPhone App”• 105,000 hits the first week to website• 12,000 unique app users the first week• 7,000 recurring app users per week• Average 22 pages view per visit

Page 333: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

A Successful Experiment• Leaflets entire application was built between

WWDC and the iPhone launch (3 weeks)• TechCrunch called it a “Must-Have iPhone App”• 105,000 hits the first week to website• 12,000 unique app users the first week• 7,000 recurring app users per week• Average 22 pages view per visit• Virtually no drop o! in tra"c since first month!

Page 334: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Leaflets Takeaways• While we designed it for the iPhone, Leaflets

could work on any “Mobile 2.0” device or browser.

Page 335: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Leaflets Takeaways• While we designed it for the iPhone, Leaflets

could work on any “Mobile 2.0” device or browser.

• Standards. Standards. Standards.

Page 336: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Leaflets Takeaways• While we designed it for the iPhone, Leaflets

could work on any “Mobile 2.0” device or browser.

• Standards. Standards. Standards.• Design for context.

Page 337: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Leaflets Takeaways• While we designed it for the iPhone, Leaflets

could work on any “Mobile 2.0” device or browser.

• Standards. Standards. Standards.• Design for context.• Optimize for the bandwidth.

Page 338: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Leaflets Takeaways• While we designed it for the iPhone, Leaflets

could work on any “Mobile 2.0” device or browser.

• Standards. Standards. Standards.• Design for context.• Optimize for the bandwidth.• Test. And then test some more.

Page 339: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Leaflets Takeaways• While we designed it for the iPhone, Leaflets

could work on any “Mobile 2.0” device or browser.

• Standards. Standards. Standards.• Design for context.• Optimize for the bandwidth.• Test. And then test some more.• Javascript is crucial to the user experience.

Page 340: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Leaflets Takeaways• While we designed it for the iPhone, Leaflets

could work on any “Mobile 2.0” device or browser.

• Standards. Standards. Standards.• Design for context.• Optimize for the bandwidth.• Test. And then test some more.• Javascript is crucial to the user experience.• CSS3 is ideal for mobile development.

Page 341: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

When we talk about iPhone, we’re really talking about

WEBKIT.

Page 342: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Some Resources

Page 343: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

iPhone for Web Developers

http://developer.apple.com/iphone/

Page 344: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Mobile Design

http://mobiledesign.org

Page 345: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Designing the Mobile User Experience

http://www.littlespringsdesign.com

Page 346: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Global Authoring Practices

http://www.passani.it/gap/

Page 347: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

XHTML Mobile Profile Tutorial

http://www.developershome.com/wap/xhtmlmp/

Page 348: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

Mobile Web Design Book

http://mobilewebbook.com

Page 349: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

.mobi Mobile Ready Report

http://mr.dev.mobi

Page 350: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyri

ght

© 2

00

8 B

rian F

ling. A

ll t

radem

ark

s a

nd c

opyri

ghts

rem

ain

the p

ropert

y o

f th

eir

respecti

ve o

wners

.

.mobi Developers Guide

http://dev.mobi

Mobile Web Developers GuidePart I: Creating Simple Mobile Sites

BRIAN FLINGwith Ronan Cremin, Jo Rabin and D. Keith Robinson

Page 351: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

This presentation will be available at:

http://flingmedia.com/presentations/

Page 352: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

Web Design World—ChicagoMay 5-7

Monotype Event—LondonJune 10

Handsets World—BerlinJune 11

Mobile Web 2.0 Summit—LondonJune 12

Web Design World—SeattleJuly 21-23

More to come...

2008Workshops

Page 353: Mobile 2.0: Design and Develop for the iPhone and Beyond (Web 2.0 Expo)

Copyright © 2008 Brian Fling. All trademarks and copyrights remain the property of their respective owners.

The EndBrian [email protected]

tel. +1 206 201-1875mob. +1 206 351-6060

website: flingmedia.comblog: flinglog.com