The document discusses the differences between native, hybrid, and mobile web applications, highlighting their development costs and complexities. It emphasizes the challenges of creating applications for various platforms and the long-standing debate over the viability of the mobile web compared to native apps. Ultimately, it suggests that the future of mobile development may transcend both traditional web and app frameworks.

1. vs vs
native hybrid web

2. @fling

3. the format

4. ask questions.
get answers.

5. my sad love story
of the mobile web

6. vs vs
native hybrid web

7. bradfrostweb.com

8. “[Brian] made me feel the same
way I feel when my grandpa talks
to me about surviving the Great
Depression.
—Brad Frost
bradfrostweb.com

9. That Guy

13. 3:1
QA : Dev

14. For every hour spent on
development, three had to
be spent in QA.

15. web
mobile ux

16. web
mobile ux

18. 2010

19. “If the web was my
religion, I feel as
though I’ve lost my
faith.
2010

20. mobiledesign.org

22. “[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

23. MADE WITH LOVE IN SEATTLE BY

24. while my friends were rolling
in cash from native apps,

25. while my friends were rolling
in cash from native apps,
I couldn’t pay my rent
building web apps.

27. “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 Hewitt
29 April 2010

28. pinch / zoom
pinchzoom.com

29. ! Price Apps

30. iflowreader.com

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

32. suck my ass

33. I bet everything on
the web and I lost.

34. That Guy

35. Why?

37. MADE WITH LOVE IN SEATTLE BY

38. 1970 1980 1990 2000 2010 2020
computing mainframe pc’s mobility
network
internet
devices
web
MADE WITH LOVE IN SEATTLE BY

39. 1970 1980 1990 2000 2010 2020
computing mainframe pc’s mobility ubiquity
network
internet
devices
web
MADE WITH LOVE IN SEATTLE BY

40. 1970 1980 1990 2000 2010 2020
computing mainframe pc’s mobility ubiquity
network 1G 2G 2.5G 3G
internet
devices
web
MADE WITH LOVE IN SEATTLE BY

41. 1970 1980 1990 2000 2010 2020
computing mainframe pc’s mobility ubiquity
network 1G 2G 2.5G 3G 4G
internet
devices
web
MADE WITH LOVE IN SEATTLE BY

42. 1970 1980 1990 2000 2010 2020
computing mainframe pc’s mobility ubiquity
network 1G 2G 2.5G 3G 4G
internet IPv4
devices
web
MADE WITH LOVE IN SEATTLE BY

43. 1970 1980 1990 2000 2010 2020
computing mainframe pc’s mobility ubiquity
network 1G 2G 2.5G 3G 4G
internet IPv4 IPv6
devices
web
MADE WITH LOVE IN SEATTLE BY

44. 1970 1980 1990 2000 2010 2020
computing mainframe pc’s mobility ubiquity
network 1G 2G 2.5G 3G 4G
internet IPv4 IPv6
devices brick candybar feature
web
MADE WITH LOVE IN SEATTLE BY

45. 1970 1980 1990 2000 2010 2020
computing mainframe pc’s mobility ubiquity
network 1G 2G 2.5G 3G 4G
internet IPv4 IPv6
devices brick candybar feature touch
web
MADE WITH LOVE IN SEATTLE BY

46. 1970 1980 1990 2000 2010 2020
computing mainframe pc’s mobility ubiquity
network 1G 2G 2.5G 3G 4G
internet IPv4 IPv6
devices brick candybar feature touch
web academia dot-com web 2.0
MADE WITH LOVE IN SEATTLE BY

47. 1970 1980 1990 2000 2010 2020
computing mainframe pc’s mobility ubiquity
network 1G 2G 2.5G 3G 4G
internet IPv4 IPv6
devices brick candybar feature touch
web academia dot-com web 2.0 next
MADE WITH LOVE IN SEATTLE BY

48. 1970 1980 1990 2000 2010 2020
computing mainframe pc’s mobility ubiquity
network 1G 2G 2.5G 3G 4G
internet IPv4 IPv6
devices brick candybar feature touch
web academia dot-com web 2.0 next
MADE WITH LOVE IN SEATTLE BY

49. 1970 1980 1990 2000 2010 2020
computing mainframe pc’s mobility ubiquity
network 1G 2G 2.5G 3G 4G
internet IPv4 IPv6
devices brick candybar feature touch
web academia dot-com web 2.0 next
MADE WITH LOVE IN SEATTLE BY

50. everything has led
to this moment

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

52. the future of mobile will
not be the web...
...or apps

55. it’s everything everywhere

56. That Guy

57. vs vs
native hybrid web

58. native app
An application that is
specifically written for a
device platform.

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

67. $32,639 for a simple app
2 months to create
2 weeks per feature
4 features
$8,160 per feature

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

69. $163,200 for a complex app
6 months to create
2 weeks per feature
12 features
$13,600 per feature

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

71. PLATFORM RESOURCES
iPhone 100%
iPad 150%
Android 175%
Honeycomb 200%
Blackberry 300%

72. Cost of Native
Simple 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

73. hybrid app
An application using
primarily web technologies
inside a native container.

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

79. ! Price Apps

81. The PhoneGap Box Score
Stars
53 1.2
Reviews Platforms

83. PLATFORM RESOURCES
Hybrid iPhone 113%
Hybrid iPad 141%
Hybrid Android 225%
Hybrid Honeycomb 225%
Hybrid Blackberry 338%

84. wtf?

85. 2.85:1
QA : Dev

86. For every hour spent on
development, three has to
be spent in QA.

87. Simple App
Native 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

88. Complex App
Native 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

90. web app
An application that runs
within a web browser.

91. p/z universal
build a website that provided the best
possible experience to the context.
iPad iPhone Desktop
magazine web app website

93. Content in Context

95. MADE WITH LOVE IN SEATTLE BY

96. 1x HTML5 Markup
1x Hexadecimal CSS Framework
1x Typography Framework
3x Javascript Frameworks
12x Media-Query-based Layouts

97. a hexadecimal what?

98. the hex-grid
Typically when using a grid
web designers are typically
only using vertical units.

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

102. iPad iPhone Desktop
magazine web app website
‣ pagination was a nightmare. ‣ largeimage needs for iPad were
‣ had
brutal.
to create an entirely new css
framework to deal with all the screen ‣ had to add device detection to reduce
sizes. JS page load per context.
‣ every page had to be designed ‣ typical navigation had to be scrapped.
individually. ‣ design sacrifices had to be made to
‣ content had to be type fitted, similar to make it work.
print layout workflow. ‣ page flow was less than ideal.
‣ had to disable pinch to zoom.

105. 2.85:1
QA : Dev

107. sni er.pinchzoom.com

108. Simple App
Native 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

109. Complex App
Native 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

110. That Guy

111. ask questions.
get answers.

112. + +
native? hybrid? web?