introduction myths benefits conclusionchallenges
html5 app
development
advantages & drawbacks
introduction Vincent van Scherpenseel
Founder & UX Designer at dotBlue.
Web realization and consultancy.
Offices in Haarlem ...
introduction SalesChamp
Application supporting door-to-door sales.
HTML5-based.
introduction SalesChamp
• Registration of sales visits
• Real-time reporting
• Schedule follow-up
meetings
• Contract sign...
introduction Why we choose HTML5
• We need to support multiple platforms
Prior experience showed that native can be
very c...
introduction Definitions
• Native app
iOS, Android or other binary platform.
Question: what is native on Firefox OS?
• HTML...
introduction Great HTML5 apps
• Financial Times (app.ft.com)
FT didn’t want to play by Apple’s rules.
• Forecast.io
Multip...
myths HTML5 is slow
The most commonly used quote?
myths HTML5 is slow
The most commonly used quote?
“Our Biggest Mistake Was Betting Too Much on
HTML5.” - Mark Zuckerberg
myths HTML5 is slow
The most commonly used quote?
“Our Biggest Mistake Was Betting Too Much on
HTML5.” - Mark Zuckerberg
myths HTML5 interfaces are ugly
You can’t build a pretty UX in HTML5.
myths HTML5 interfaces are ugly
You can’t build a pretty UX in HTML5.
myths HTML5 doesn’t allow for complex apps
You can’t build a complex app
such as a game in HTML5.
myths HTML5 doesn’t allow for complex apps
You can’t build a complex app
such as a game in HTML5.
myths HTML5 doesn’t work offline
You can’t use an HTML5 app while being offline.
myths HTML5 doesn’t work offline
You can’t use an HTML5 app while being offline.
myths HTML5 apps run in a browser
HTML5 apps run in a browser.
Technically correct, but not from a UX
perspective.
myths HTML5 apps run in a browser
HTML5 apps run in a browser.
Technically correct, but not from a UX
perspective.
challenges HTML5 is harder
Creating a speedy, stable app which looks good
and works seamlessly offline is harder in HTML5.
challenges Not a standard yet
HTML5 specifications are not final yet.
Recommendation status expected
at the end of 2014.
challenges Write once, run everywhere?
There is no such thing as a browser.
Per-platform tweaking is still needed.
challenges Offline app usage
• Offline app usage
Manifest file is hard to work with (stale cache).
• Offline databases
Two appro...
challenges Accessing hardware APIs
Accessing hardware APIs is limited.
challenges Accessing hardware APIs
Accessing hardware APIs is limited.
But we more or less have:
URI schemes, GPS, device ...
challenges Accessing hardware APIs
Accessing hardware APIs is limited.
But we more or less have:
URI schemes, GPS, device ...
challenges Performance and stability
Creating a fast & stable app is definitely possible.
But it takes some effort.
challenges User’s mental model
The app store concept is well understood.
Bookmarking an app is not.
benefits Multi platform
With a single codebase
you can target all major platforms.
benefits Release whenever you want
No need to get approval.
Update while users are using your app.
benefits You are in control
You are in control of your business model.
benefits Data collection
Use common web analytics tools
to measure and analyze usage.
benefits More development resources
It may be easier to find HTML5 development
resources than native resources.
benefits Future proof
It’s not about
iOS vs. Android.
conclusion Main drawbacks of HTML5
• Harder to build
It takes more effort, but fortunately
frameworks and tooling are getti...
conclusion Main advantages of HTML5
• Multi-platform
Cheaper building & maintenance. Reduce costs.
• You’re in control of ...
conclusion Final verdict
It’s up to you! — Ask yourself:
• Which platforms do we need to support?
• What is our release fr...
thank you
for your attention
vincent van scherpenseel
vincent@dotblue.nl
Upcoming SlideShare
Loading in …5
×

HTML5 App Development - Advantages & Drawbacks

6,632 views

Published on

Published in: Technology
1 Comment
5 Likes
Statistics
Notes
No Downloads
Views
Total views
6,632
On SlideShare
0
From Embeds
0
Number of Embeds
883
Actions
Shares
0
Downloads
75
Comments
1
Likes
5
Embeds 0
No embeds

No notes for slide

HTML5 App Development - Advantages & Drawbacks

  1. 1. introduction myths benefits conclusionchallenges html5 app development advantages & drawbacks
  2. 2. introduction Vincent van Scherpenseel Founder & UX Designer at dotBlue. Web realization and consultancy. Offices in Haarlem and Brno (CZ).
  3. 3. introduction SalesChamp Application supporting door-to-door sales. HTML5-based.
  4. 4. introduction SalesChamp • Registration of sales visits • Real-time reporting • Schedule follow-up meetings • Contract signing • Team-based or stand- alone
  5. 5. introduction Why we choose HTML5 • We need to support multiple platforms Prior experience showed that native can be very costly to build and maintain. • This is not a consumer app We don’t want to be in an app store, nor do we want to pay a subscription / licensing fee. • We are a web firm We were already familiar with HTML5/CSS/JS.
  6. 6. introduction Definitions • Native app iOS, Android or other binary platform. Question: what is native on Firefox OS? • HTML5 app Completely web-based. • Hybrid app Web-based app packed in a binary.
  7. 7. introduction Great HTML5 apps • Financial Times (app.ft.com) FT didn’t want to play by Apple’s rules. • Forecast.io Multiple platform support. • Google Chrome Maze (chrome.com/maze/) Tech demo.
  8. 8. myths HTML5 is slow The most commonly used quote?
  9. 9. myths HTML5 is slow The most commonly used quote? “Our Biggest Mistake Was Betting Too Much on HTML5.” - Mark Zuckerberg
  10. 10. myths HTML5 is slow The most commonly used quote? “Our Biggest Mistake Was Betting Too Much on HTML5.” - Mark Zuckerberg
  11. 11. myths HTML5 interfaces are ugly You can’t build a pretty UX in HTML5.
  12. 12. myths HTML5 interfaces are ugly You can’t build a pretty UX in HTML5.
  13. 13. myths HTML5 doesn’t allow for complex apps You can’t build a complex app such as a game in HTML5.
  14. 14. myths HTML5 doesn’t allow for complex apps You can’t build a complex app such as a game in HTML5.
  15. 15. myths HTML5 doesn’t work offline You can’t use an HTML5 app while being offline.
  16. 16. myths HTML5 doesn’t work offline You can’t use an HTML5 app while being offline.
  17. 17. myths HTML5 apps run in a browser HTML5 apps run in a browser. Technically correct, but not from a UX perspective.
  18. 18. myths HTML5 apps run in a browser HTML5 apps run in a browser. Technically correct, but not from a UX perspective.
  19. 19. challenges HTML5 is harder Creating a speedy, stable app which looks good and works seamlessly offline is harder in HTML5.
  20. 20. challenges Not a standard yet HTML5 specifications are not final yet. Recommendation status expected at the end of 2014.
  21. 21. challenges Write once, run everywhere? There is no such thing as a browser. Per-platform tweaking is still needed.
  22. 22. challenges Offline app usage • Offline app usage Manifest file is hard to work with (stale cache). • Offline databases Two approaches: IndexedDB and WebSQL. WebSQL is deprecated, but supported by iOS. • Offline flat data Web Storage (key/value store) is pretty ok.
  23. 23. challenges Accessing hardware APIs Accessing hardware APIs is limited.
  24. 24. challenges Accessing hardware APIs Accessing hardware APIs is limited. But we more or less have: URI schemes, GPS, device orientation, camera, battery, vibration, ambient light sensor, network, push messages.
  25. 25. challenges Accessing hardware APIs Accessing hardware APIs is limited. But we more or less have: URI schemes, GPS, device orientation, camera, battery, vibration, ambient light sensor, network, push messages. Going hybrid may help you, but introduces its own drawbacks.
  26. 26. challenges Performance and stability Creating a fast & stable app is definitely possible. But it takes some effort.
  27. 27. challenges User’s mental model The app store concept is well understood. Bookmarking an app is not.
  28. 28. benefits Multi platform With a single codebase you can target all major platforms.
  29. 29. benefits Release whenever you want No need to get approval. Update while users are using your app.
  30. 30. benefits You are in control You are in control of your business model.
  31. 31. benefits Data collection Use common web analytics tools to measure and analyze usage.
  32. 32. benefits More development resources It may be easier to find HTML5 development resources than native resources.
  33. 33. benefits Future proof It’s not about iOS vs. Android.
  34. 34. conclusion Main drawbacks of HTML5 • Harder to build It takes more effort, but fortunately frameworks and tooling are getting better. • Not all hardware APIs are accessible But this is definitely improving.
  35. 35. conclusion Main advantages of HTML5 • Multi-platform Cheaper building & maintenance. Reduce costs. • You’re in control of your release process Release when you want, no need for approval. • You’re in control of the business model No need to play the app-store game.
  36. 36. conclusion Final verdict It’s up to you! — Ask yourself: • Which platforms do we need to support? • What is our release frequency like? • Are we building internally or externally? • If internally: what knowledge do we have (access to)?
  37. 37. thank you for your attention vincent van scherpenseel vincent@dotblue.nl

×