native hybrid web

vs vs

@fling

the format

ask questions.get answers.

my sad love story of the mobile web

native hybrid web

vs vs

bradfrostweb.com

bradfrostweb.com

“[Brian] made me feel the same way I feel when my grandpa talks to me about surviving the Great Depression.

—Brad Frost

That Guy

3:1QA : Dev

For every hour spent on development, three had to

be spent in QA.

mobile ux

web

mobile ux

web

2010

2010

“If the web was my religion, I feel as

though I’ve lost my faith.

mobiledesign.org

“[Brian] states making a native application can be the best thing for a product, but confirms on the other hand that the mobile web is the only long term commercially viable content platform for mobile devices

—Thibault Imbert

MADE WITH LOVE IN SEATTLE BY

while my friends were rolling in cash from native apps,

while my friends were rolling in cash from native apps,

I couldn’t pay my rent building web apps.

“I want desperately to be a web developer again, but if I have to wait until 2020 for browsers to do what Cocoa can do in 2010, I won’t wait.

—Joe Hewitt29 April 2010

pinch/zoom

pinchzoom.com

Price Apps!

iflowreader.com

iflowreader.com

“We bet everything on Apple and iOS and then Apple killed us by changing the rules in the middle of the game.

suck my ass

I bet everything on the web and I lost.

That Guy

Why?

MADE WITH LOVE IN SEATTLE BYMADE WITH LOVE IN SEATTLE BY

computing

network

internet

devices

web

20102000199019801970 2020

mobilitypc’smainframe

MADE WITH LOVE IN SEATTLE BY

computing

network

internet

devices

web

20102000199019801970 2020

ubiquitymobilitypc’smainframe

MADE WITH LOVE IN SEATTLE BY

computing

network

internet

devices

web

20102000199019801970

3G

2020

2.5G2G1G

ubiquitymobilitypc’smainframe

MADE WITH LOVE IN SEATTLE BY

computing

network

internet

devices

web

20102000199019801970

3G

2020

4G2.5G2G1G

ubiquitymobilitypc’smainframe

MADE WITH LOVE IN SEATTLE BY

computing

network

internet

devices

web

20102000199019801970

IPv4

3G

2020

4G2.5G2G1G

ubiquitymobilitypc’smainframe

MADE WITH LOVE IN SEATTLE BY

computing

network

internet

devices

web

20102000199019801970

IPv4

3G

IPv6

2020

4G2.5G2G1G

ubiquitymobilitypc’smainframe

MADE WITH LOVE IN SEATTLE BY

computing

network

internet

devices

web

20102000199019801970

featurebrick

IPv4

3G

IPv6

2020

candybar

4G2.5G2G1G

ubiquitymobilitypc’smainframe

MADE WITH LOVE IN SEATTLE BY

computing

network

internet

devices

web

20102000199019801970

featurebrick

IPv4

touch

3G

IPv6

2020

candybar

4G2.5G2G1G

ubiquitymobilitypc’smainframe

MADE WITH LOVE IN SEATTLE BY

computing

network

internet

devices

web dot-com

20102000199019801970

web 2.0

featurebrick

IPv4

touch

3G

IPv6

2020

candybar

4G2.5G2G1G

ubiquitymobilitypc’smainframe

academia

MADE WITH LOVE IN SEATTLE BY

computing

network

internet

devices

web dot-com

20102000199019801970

web 2.0

featurebrick

IPv4

touch

3G

IPv6

2020

candybar

4G2.5G2G1G

ubiquitymobilitypc’smainframe

nextacademia

MADE WITH LOVE IN SEATTLE BY

computing

network

internet

devices

web dot-com

20102000199019801970

web 2.0

featurebrick

IPv4

touch

3G

IPv6

2020

candybar

4G2.5G2G1G

ubiquitymobilitypc’smainframe

nextacademia

MADE WITH LOVE IN SEATTLE BY

computing

network

internet

devices

web dot-com

20102000199019801970

web 2.0

featurebrick

IPv4

touch

3G

IPv6

2020

candybar

4G2.5G2G1G

ubiquitymobilitypc’smainframe

nextacademia

MADE WITH LOVE IN SEATTLE BY

touch

IPv6

4G

ubiquity

next

everything has led to this moment

the future of mobile will not be the web...

the future of mobile will not be the web...

...or apps

it’s everything everywhere

That Guy

native hybrid web

vs vs

native appAn application that is specifically written for a device platform.

“ They are expensive to create—a simple app could cost you $32,639 and take two months to create.

$32,639 for a simple app2 months to create

2 weeks per feature

4 features

$8,160 per feature

“A complex app could have a price tag of more than $163,200 and take six months to develop.

$163,200 for a complex app6 months to create

2 weeks per feature

12 features

$13,600 per feature

“ This price multiplies if you decide you want to make it available on more than one operating system.

PLATFORM RESOURCES

iPhone 100%

iPad 150%

Android 175%

Honeycomb 200%

Blackberry 300%

Cost of NativeSimple App Complex App

iPhone $32,639 $163,200

iPad $48,959 $244,800

Android $57,118 $285,600

Honeycomb $65,278 $326,400

Blackberry $97,917 $489,600

Total $301,911 $1,509,600

hybrid appAn application using primarily web technologies inside a native container.

hybrid app...to be in the App Store.

Price Apps!

The PhoneGap Box Score

1.2 Platforms

53 ReviewsStars

PLATFORM RESOURCES

Hybrid iPhone 113%

Hybrid iPad 141%

Hybrid Android 225%

Hybrid Honeycomb 225%

Hybrid Blackberry 338%

wtf?

2.85:1QA : Dev

For every hour spent on development, three has to

be spent in QA.

Simple AppNative Hybrid Mobile Web

iPhone $32,639 $36,719 $24,479

iPad $48,959 $45,899 $30,599

Android $57,118 $73,438 $48,959

Honeycomb $65,278 $73,438 $48,959

Blackberry $97,917 $110,157 $73,438

Total $301,911 $339,650 $226,433

Complex AppNative Hybrid Mobile Web

iPhone $163,200 $183,600 $122,400

iPad $244,800 $229,500 $153,000

Android $285,600 $367,200 $244,800

Honeycomb $326,400 $367,200 $244,800

Blackberry $489,600 $550,800 $367,200

Total $1,509,600 $1,698,300 $1,132,200

web appAn application that runs within a web browser.

p/z universalbuild a website that provided the best possible experience to the context.

iPad

magazineiPhone

web appDesktop

website

Content in Context

MADE WITH LOVE IN SEATTLE BY

1x HTML5 Markup1x Hexadecimal CSS Framework1x Typography Framework3x Javascript Frameworks12x Media-Query-based Layouts

a hexadecimal what?

the hex-grid

Typically when using a grid web designers are typically only using vertical units.

the hex-grid

but in mobile design, we must use horizontal units as well. this means that any unit size must work vertically as well as horizontally.

iPad

magazineiPhone

web appDesktop

website

‣ pagination was a nightmare.

‣ had to create an entirely new css framework to deal with all the screen sizes.

‣ every page had to be designed individually.

‣ content had to be type fitted, similar to print layout workflow.

‣ had to disable pinch to zoom.

‣ large image needs for iPad were brutal.

‣ had to add device detection to reduce JS page load per context.

‣ typical navigation had to be scrapped.

‣ design sacrifices had to be made to make it work.

‣ page flow was less than ideal.

2.85:1QA : Dev

sni!er.pinchzoom.com

Simple AppNative Hybrid Mobile Web

iPhone $32,639 $36,719 $24,479

iPad $48,959 $45,899 $30,599

Android $57,118 $73,438 $48,959

Honeycomb $65,278 $73,438 $48,959

Blackberry $97,917 $110,157 $73,438

Total $301,911 $339,650 $226,433

Complex AppNative Hybrid Mobile Web

iPhone $163,200 $183,600 $122,400

iPad $244,800 $229,500 $153,000

Android $285,600 $367,200 $244,800

Honeycomb $326,400 $367,200 $244,800

Blackberry $489,600 $550,800 $367,200

Total $1,509,600 $1,698,300 $1,132,200

That Guy

ask questions.get answers.

native? hybrid? web?

+ +