Enviar pesquisa
Carregar
Deciding Mobile: HTML5 or native
•
1 gostou
•
5,872 visualizações
Nikolaos Kaintantzis
Seguir
Tecnologia
Denunciar
Compartilhar
Denunciar
Compartilhar
1 de 50
Baixar agora
Baixar para ler offline
Recomendados
Belgacom presentatie portal roundtable 27 september 2012
Belgacom presentatie portal roundtable 27 september 2012
MooijBert
Forum Nokia Le Mobile 2.0 Edition 2009
Forum Nokia Le Mobile 2.0 Edition 2009
servicesmobiles.fr
The Flash to HTML5 Opportunity
The Flash to HTML5 Opportunity
Thomas Burleson
Developing the Next Generation Embedded HMIs
Developing the Next Generation Embedded HMIs
mentoresd
iLabs Status and Toolbox
iLabs Status and Toolbox
Hilde Lovett
Maxime Thomas - eZBK
Maxime Thomas - eZBK
eZ Publish Community
IBM Presentation, E2.0, Sydney
IBM Presentation, E2.0, Sydney
guesta04b0
雲端服務對於台灣製造業IT的意義、挑戰及機會
雲端服務對於台灣製造業IT的意義、挑戰及機會
併力科技 JFT
Recomendados
Belgacom presentatie portal roundtable 27 september 2012
Belgacom presentatie portal roundtable 27 september 2012
MooijBert
Forum Nokia Le Mobile 2.0 Edition 2009
Forum Nokia Le Mobile 2.0 Edition 2009
servicesmobiles.fr
The Flash to HTML5 Opportunity
The Flash to HTML5 Opportunity
Thomas Burleson
Developing the Next Generation Embedded HMIs
Developing the Next Generation Embedded HMIs
mentoresd
iLabs Status and Toolbox
iLabs Status and Toolbox
Hilde Lovett
Maxime Thomas - eZBK
Maxime Thomas - eZBK
eZ Publish Community
IBM Presentation, E2.0, Sydney
IBM Presentation, E2.0, Sydney
guesta04b0
雲端服務對於台灣製造業IT的意義、挑戰及機會
雲端服務對於台灣製造業IT的意義、挑戰及機會
併力科技 JFT
Gestión emocional para líderes y profesionales ágiles con el Método Alba Emoting
Gestión emocional para líderes y profesionales ágiles con el Método Alba Emoting
Silvia Filippi Barra
Concrete, Magic converting wastes to concrete IDM10
Concrete, Magic converting wastes to concrete IDM10
Qatar University- Young Scientists Center (Al-Bairaq)
58 0225 el ojo de dios
58 0225 el ojo de dios
Miguel Angel Huayta Seminario
Ingresando a access
Ingresando a access
kevin9_
Control y gestión de calidad
Control y gestión de calidad
Jhonny Abril
Conference of the Sustainable Consumption Research and Action Initiative (SCO...
Conference of the Sustainable Consumption Research and Action Initiative (SCO...
FutureEarthAsiaCentre
Una mirada critica
Una mirada critica
Ivanrc12
Food packaging, Smart Can IDM10
Food packaging, Smart Can IDM10
Qatar University- Young Scientists Center (Al-Bairaq)
ประวัติส่วนตัว 1
ประวัติส่วนตัว 1
Bill's Wonder
Estudantes em ação
Estudantes em ação
Ryzia
Logam mesin maintenance and diagnostic refrigeration & ac 18 (7)
Logam mesin maintenance and diagnostic refrigeration & ac 18 (7)
Eko Supriyadi
Logam mesin fabrication 25
Logam mesin fabrication 25
Eko Supriyadi
Logam mesin casting and moulding 4
Logam mesin casting and moulding 4
Eko Supriyadi
Logam mesin fabrication 27
Logam mesin fabrication 27
Eko Supriyadi
Разработка посадочных страниц
Разработка посадочных страниц
MedMarketing
Telefonía
Telefonía
alma cassio gallardo
Cameron Straatsma - MRMyers Letter of Recommendation
Cameron Straatsma - MRMyers Letter of Recommendation
Michael Myers
Step Into Social Media Liw 2009
Step Into Social Media Liw 2009
Promote Public Relations Ltd
Cluster Ecommerce Empordà 10.11.11
Cluster Ecommerce Empordà 10.11.11
Quim Gudayol
Trends im E-Commerce 2012 - ONE
Trends im E-Commerce 2012 - ONE
Carpathia AG
A dummies guide to native, html5 and hybrid mobile apps
A dummies guide to native, html5 and hybrid mobile apps
John Moy
New trends of web technology on mobile: HTML5, PhoneGap & NaCl - Barcamp Saig...
New trends of web technology on mobile: HTML5, PhoneGap & NaCl - Barcamp Saig...
Vũ Nguyễn
Mais conteúdo relacionado
Destaque
Gestión emocional para líderes y profesionales ágiles con el Método Alba Emoting
Gestión emocional para líderes y profesionales ágiles con el Método Alba Emoting
Silvia Filippi Barra
Concrete, Magic converting wastes to concrete IDM10
Concrete, Magic converting wastes to concrete IDM10
Qatar University- Young Scientists Center (Al-Bairaq)
58 0225 el ojo de dios
58 0225 el ojo de dios
Miguel Angel Huayta Seminario
Ingresando a access
Ingresando a access
kevin9_
Control y gestión de calidad
Control y gestión de calidad
Jhonny Abril
Conference of the Sustainable Consumption Research and Action Initiative (SCO...
Conference of the Sustainable Consumption Research and Action Initiative (SCO...
FutureEarthAsiaCentre
Una mirada critica
Una mirada critica
Ivanrc12
Food packaging, Smart Can IDM10
Food packaging, Smart Can IDM10
Qatar University- Young Scientists Center (Al-Bairaq)
ประวัติส่วนตัว 1
ประวัติส่วนตัว 1
Bill's Wonder
Estudantes em ação
Estudantes em ação
Ryzia
Logam mesin maintenance and diagnostic refrigeration & ac 18 (7)
Logam mesin maintenance and diagnostic refrigeration & ac 18 (7)
Eko Supriyadi
Logam mesin fabrication 25
Logam mesin fabrication 25
Eko Supriyadi
Logam mesin casting and moulding 4
Logam mesin casting and moulding 4
Eko Supriyadi
Logam mesin fabrication 27
Logam mesin fabrication 27
Eko Supriyadi
Разработка посадочных страниц
Разработка посадочных страниц
MedMarketing
Telefonía
Telefonía
alma cassio gallardo
Cameron Straatsma - MRMyers Letter of Recommendation
Cameron Straatsma - MRMyers Letter of Recommendation
Michael Myers
Step Into Social Media Liw 2009
Step Into Social Media Liw 2009
Promote Public Relations Ltd
Cluster Ecommerce Empordà 10.11.11
Cluster Ecommerce Empordà 10.11.11
Quim Gudayol
Trends im E-Commerce 2012 - ONE
Trends im E-Commerce 2012 - ONE
Carpathia AG
Destaque
(20)
Gestión emocional para líderes y profesionales ágiles con el Método Alba Emoting
Gestión emocional para líderes y profesionales ágiles con el Método Alba Emoting
Concrete, Magic converting wastes to concrete IDM10
Concrete, Magic converting wastes to concrete IDM10
58 0225 el ojo de dios
58 0225 el ojo de dios
Ingresando a access
Ingresando a access
Control y gestión de calidad
Control y gestión de calidad
Conference of the Sustainable Consumption Research and Action Initiative (SCO...
Conference of the Sustainable Consumption Research and Action Initiative (SCO...
Una mirada critica
Una mirada critica
Food packaging, Smart Can IDM10
Food packaging, Smart Can IDM10
ประวัติส่วนตัว 1
ประวัติส่วนตัว 1
Estudantes em ação
Estudantes em ação
Logam mesin maintenance and diagnostic refrigeration & ac 18 (7)
Logam mesin maintenance and diagnostic refrigeration & ac 18 (7)
Logam mesin fabrication 25
Logam mesin fabrication 25
Logam mesin casting and moulding 4
Logam mesin casting and moulding 4
Logam mesin fabrication 27
Logam mesin fabrication 27
Разработка посадочных страниц
Разработка посадочных страниц
Telefonía
Telefonía
Cameron Straatsma - MRMyers Letter of Recommendation
Cameron Straatsma - MRMyers Letter of Recommendation
Step Into Social Media Liw 2009
Step Into Social Media Liw 2009
Cluster Ecommerce Empordà 10.11.11
Cluster Ecommerce Empordà 10.11.11
Trends im E-Commerce 2012 - ONE
Trends im E-Commerce 2012 - ONE
Semelhante a Deciding Mobile: HTML5 or native
A dummies guide to native, html5 and hybrid mobile apps
A dummies guide to native, html5 and hybrid mobile apps
John Moy
New trends of web technology on mobile: HTML5, PhoneGap & NaCl - Barcamp Saig...
New trends of web technology on mobile: HTML5, PhoneGap & NaCl - Barcamp Saig...
Vũ Nguyễn
Tw Technology Radar Qtb Sep11
Tw Technology Radar Qtb Sep11
Adrian Treacy
How to scale enterprise mobility and improve roi
How to scale enterprise mobility and improve roi
Apperian
HTML5 / Mobile Web
HTML5 / Mobile Web
Dipesh Mukerji
HTML5 - The Future in a Flash
HTML5 - The Future in a Flash
Rick Snailum
Should you say no to HTML5?
Should you say no to HTML5?
Kony, Inc.
Html5 workshop part 1
Html5 workshop part 1
NAILBITER
ITCamp 2012 - Adam Granicz - Web development with WebSharper in F#
ITCamp 2012 - Adam Granicz - Web development with WebSharper in F#
ITCamp
Html5 tx - preso
Html5 tx - preso
Santiago Esteva
Integrating ADF Mobile with WebCenter
Integrating ADF Mobile with WebCenter
Brian Huff
HTML5 for Mobile - When and Why
HTML5 for Mobile - When and Why
DMI
Qnx html5 hmi
Qnx html5 hmi
길수 김
Mobile Web Apps Overview
Mobile Web Apps Overview
Ramon Victor
"Marmalade" presentation at Ciklum event "Defining your Mobile Strategy"
"Marmalade" presentation at Ciklum event "Defining your Mobile Strategy"
Ciklum Ukraine
Open Saas brings freedom to the Cloud
Open Saas brings freedom to the Cloud
Cyril Reinhard
Resume
Resume
Ken Leong
Building & Managing The Lifecycle of Mobile Apps For The Enterprise
Building & Managing The Lifecycle of Mobile Apps For The Enterprise
Apperian
Let's Talk Mobile
Let's Talk Mobile
Chris Muir
CM WebClient CA Expo Mannheim Germany
CM WebClient CA Expo Mannheim Germany
CM First Group
Semelhante a Deciding Mobile: HTML5 or native
(20)
A dummies guide to native, html5 and hybrid mobile apps
A dummies guide to native, html5 and hybrid mobile apps
New trends of web technology on mobile: HTML5, PhoneGap & NaCl - Barcamp Saig...
New trends of web technology on mobile: HTML5, PhoneGap & NaCl - Barcamp Saig...
Tw Technology Radar Qtb Sep11
Tw Technology Radar Qtb Sep11
How to scale enterprise mobility and improve roi
How to scale enterprise mobility and improve roi
HTML5 / Mobile Web
HTML5 / Mobile Web
HTML5 - The Future in a Flash
HTML5 - The Future in a Flash
Should you say no to HTML5?
Should you say no to HTML5?
Html5 workshop part 1
Html5 workshop part 1
ITCamp 2012 - Adam Granicz - Web development with WebSharper in F#
ITCamp 2012 - Adam Granicz - Web development with WebSharper in F#
Html5 tx - preso
Html5 tx - preso
Integrating ADF Mobile with WebCenter
Integrating ADF Mobile with WebCenter
HTML5 for Mobile - When and Why
HTML5 for Mobile - When and Why
Qnx html5 hmi
Qnx html5 hmi
Mobile Web Apps Overview
Mobile Web Apps Overview
"Marmalade" presentation at Ciklum event "Defining your Mobile Strategy"
"Marmalade" presentation at Ciklum event "Defining your Mobile Strategy"
Open Saas brings freedom to the Cloud
Open Saas brings freedom to the Cloud
Resume
Resume
Building & Managing The Lifecycle of Mobile Apps For The Enterprise
Building & Managing The Lifecycle of Mobile Apps For The Enterprise
Let's Talk Mobile
Let's Talk Mobile
CM WebClient CA Expo Mannheim Germany
CM WebClient CA Expo Mannheim Germany
Último
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
apidays
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Edi Saputra
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Miguel Araújo
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
apidays
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
sudhanshuwaghmare1
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
sammart93
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
?#DUbAI#??##{{(☎️+971_581248768%)**%*]'#abortion pills for sale in dubai@
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)
wesley chun
Manulife - Insurer Innovation Award 2024
Manulife - Insurer Innovation Award 2024
The Digital Insurer
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
DianaGray10
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt Robison
Anna Loughnan Colquhoun
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
apidays
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
apidays
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
Remote DBA Services
GenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdf
lior mazor
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
Khem
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
MIND CTI
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
The Digital Insurer
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
Martijn de Jong
Deploy with confidence: VMware Cloud Foundation 5.1 on next gen Dell PowerEdg...
Deploy with confidence: VMware Cloud Foundation 5.1 on next gen Dell PowerEdg...
Principled Technologies
Último
(20)
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)
Manulife - Insurer Innovation Award 2024
Manulife - Insurer Innovation Award 2024
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt Robison
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
GenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdf
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
Deploy with confidence: VMware Cloud Foundation 5.1 on next gen Dell PowerEdg...
Deploy with confidence: VMware Cloud Foundation 5.1 on next gen Dell PowerEdg...
Deciding Mobile: HTML5 or native
1.
Mobile: HTML5 or
native? Deciding right for your needs Slide 1 Nikolaos Kaintantzis 11. April 2013 nikolaos.kaintantzis@zuehlke.com Twitter: @xnka Nikolaos Kaintantzis © Zühlke 2013
2.
Our biggest mistake
was betting too much on HTML5 rather than native applications It just wasn't there September 11th, 2012 http://techcrunch.com/2012/09/11/mark-zuckerberg-our-biggest-mistake-with-mobile-was-betting-too-much-on-html5/ Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 2 © Zühlke 2013
3.
Challenge accepted! HTML5 is
ready Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 3 © Zühlke 2013
4.
Facebook native
vs. Fastbook HTML5 Mobile: HTML5 or native? | Nikolaos Kaintantzis Source: http://vimeo.com/55486684 11. April 2013 Slide 4 © Zühlke 2013
5.
Displaying lots of
data is not technology related Questions to solve: • Local caching • Identity over server roundtrips • Update tracking • When and how to refresh? This is maybe not your problem Facebook's problems are note everyone’s problems Facebook still likes and uses HTML5 Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 5 © Zühlke 2013
6.
HTML5 vs. native? What
evangelists are saying expectation HTML5 vs 2010 time 2011 2012 2013 Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 6 © Zühlke 2013
7.
Goal of this
talk Identify your needs and use case Provide facts and arguments Showing the limits and strengths of HTML5 (focus on mobile) Help finding your decision HTML5 native Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 7 © Zühlke 2013
8.
Facets in mobile
development User experience Screen size segmentation Supporting main platforms Application lifecycle management (ALM) Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 8 © Zühlke 2013
9.
Facets in mobile
development User experience Screen size segmentation Supporting main platforms Application lifecycle management (ALM) Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 9 © Zühlke 2013
10.
Classification 2010 (before
HTML5) Thin, RIA, Rich web AJAX no Thin RIA techn. Plugin RIA cost barriers Environment Standalone RIA Store Rich Clients native low User Interaction complex/high Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 10 © Zühlke 2013
11.
Classification 2013 HTML5
and Rich web no HTML5 techn HTML5 Plugin RIA Environment Standalone RIA Rich Clients native low User Interaction complex/high Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 11 © Zühlke 2013
12.
HTML5 is more
than a hype expands AJAX-RIA-box to the right expands AJAX-RIA-box to the bottom • New types for <input> tag • Offline capabilities/ application cache • Drag and drop • Local storage and • Canvas and webGL indexed database • Web sockets • File-API • Geolocation • Web messaging / Channel messaging Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 12 © Zühlke 2013
13.
Classification 2015 HTM5 for
everything? Thin AJAX Plugin RIA Standalone RIA Rich Clients 2010 HTML5 2013 HTML5 HTML5 Plugin RIA 2015 ??? Standalone RIA Rich Clients Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 13 © Zühlke 2013
14.
HTML5 for everything?
- Challenge complex user interaction web no HTML5 techn HTML5 Plugin RIA Environment Standalone RIA Rich Clients native DnD, Keyboard low User Interaction complex/high Shortcuts, autom. data exchange Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 14 © Zühlke 2013
15.
HTML5 for everything?
- Challenge complex user interaction web no HTML5 techn No mobile use case HTML5 Plugin RIA Environment Standalone RIA Rich Clients native low User Interaction complex/high Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 15 © Zühlke 2013
16.
HTML5 for everything?
- Challenge native APIs and look and feel web no HTML5 techn No mobile use case HTML5 Plugin RIA Environment Standalone RIA Rich Clients native Access file system, low User Interaction complex/high webcam, native look and feel Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 16 © Zühlke 2013
17.
Can I use
the file system with HTML5? www.caniuse.com Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 17 © Zühlke 2013
18.
Can I use
the webcam with HTML5? www.caniuse.com Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 18 © Zühlke 2013
19.
Can I use
geolocation and device orientation? www.caniuse.com Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 19 © Zühlke 2013
20.
Mobile HTML5 and
wrapper Hybrid apps web HTML5 No use case Environment Native Wrapper (Camera, Location, Contact, SMS, Orientation, File System Workers and Parallel Processing, Cross-App native Messaging) low User Interaction complex/high Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 20 © Zühlke 2013
21.
Missing HTML5 features (or
support old browsers) Use fallbacks and polyfills • Use one of the 100+ HTML5 frameworks • Check with modernizr to see if a feature is missing • Modernizr includes YepNope.js for conditional loading of external js and css resources yepnope({ test : Modernizr.geolocation, yep : 'normal.js', nope : ['polyfill.js', 'wrapper.js'] }); Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 21 © Zühlke 2013
22.
HTML5 look Looks the
way you styled it May conflict with known and expected interaction paradigms • Backlink • Arrows in lists • No contextual action bar available (just the one of the browser) Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 22 © Zühlke 2013
23.
24.
HTML5 feel An HTML5
app may look native but not feel native • Some transitions and effects need hardware performance • Animations when clicking on widgets are different than native Feel depends on • the maturity of the framework you use • browser and the capability the OS gives to the browser Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 24 © Zühlke 2013
25.
User experience
HTML5 or native? Best user experience is with native native Performance and reactiveness could become UX issues • e.g. slow rendering of big object graphs Look and feel might not be an issue • e.g. Business-to-Employee (B2E)-Apps HTML5 Use the company CI as look and feel is much easier with HTML5 Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 25 © Zühlke 2013
26.
Facets in mobile
development User experience Screen size segmentation Supporting main platforms Application lifecycle management (ALM) Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 26 © Zühlke 2013
27.
iPad and iPhone
screen sizes Source: http://opensignal.com/reports/fragmentation.php Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 27 © Zühlke 2013
28.
Android screen sizes
Source: http://opensignal.com/reports/fragmentation.php Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 28 © Zühlke 2013
29.
Android screen sizes
of popular phones Source: http://opensignal.com/reports/fragmentation.php Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 29 © Zühlke 2013
30.
Native: programmatically with
OS support Source http://developer.android.com/design/ patterns/multi-pane-layouts.html
31.
HTML5: Responsive design source:
http://www.lukew.com/ff/entry.asp?1514 source: http://designmodo.com/responsive-design-examples/
32.
Mobile Page instead
of responsive design? Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 32 © Zühlke 2013
33.
Screen size segmentation HTML5
or native? Easier with HTML5 Save costs with HTML5 Advantage HTML5 HTML5 native Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 33 © Zühlke 2013
34.
Facets in mobile
development User experience Screen size segmentation Supporting main platforms Application lifecycle management (ALM) Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 34 © Zühlke 2013
35.
Mobile platform market
share March 2012 and 2013 Platform Market Share Market Share Market Share World Europe Switzerland 2013-03 2012-03 2013-03 2012-03 2013-03 2012-03 Android 37.19 45.42 33.22 (23.61) (31.72) (25.53) iOS 27.18 38.99 62.74 (23.99) (41.63) (70.14) Windows Phone ? 02.58 02.00 ? (00.99) (00.92) Symbian 07.99 02.32 01.05 (31.48) (08.31) (01.67) Blackberry 03.27 04.59 00.23 (06.43) (12.00) (00.40) Source: http://stats.areppim.com/ Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 35 © Zühlke 2013
36.
How to handle
fragmentation? • For each Platform native Need skills for each platform and language • Cross compiling (e.g. with Mono/Xamarin) – Non UI-Code is common / But code each UI Reuse skills in common code / UI skills for each platform / Know how for cross compiler • Interpreted apps (e.g. with Appcelerator Titanium) – One Language for all platforms & native widgets on each Learn framework or reuse JavaScript skills • Generated apps Modelling skills needed or reused • Hybrid Apps HTML5 • Web Apps – Responsive design – Mobile site } reuse HTML, JS and CSS skills Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 36 © Zühlke 2013
37.
Supporting main platforms
HTML5 or native? Native: native • Main is a small number • Having skills for each platform already • UI is less expensive than the rest (much common and less UI code) • You want the best user experience on each platform HTML5 • Main is a big number of platforms and versions • You whish less code to maintain You don’t have people or money to support each platform HTML5 • Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 37 © Zühlke 2013
38.
interim balance: responsive
design, mobile page, hybrid application or native? responsive design mobile page hybrid app native Fast changes / Always up to date Works with sensors (e.g. geolocation) No additional code to maintain Appstore presence and monetarisation No additional costs (e.g. dev. licence) Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 38 © Zühlke 2013
39.
Facets in mobile
development User experience Screen size segmentation Supporting main platforms Application lifecycle management (ALM) Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 39 © Zühlke 2013
40.
Why is ALM
a mobile topic? Native: • Support how many platforms? • Support how many platform versions? • Prepare for next platform version? HTML5: • Support how many browsers? Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 40 © Zühlke 2013
41.
iOS 6 is
the main version for iOS Source: http://forums.macrumors.com/showthread.php?t=1548883 Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 41 © Zühlke 2013
42.
New android versions
need time 93% with 3 Android Versions Source: http://www.appbrain.com/stats/top-android-sdk-versions Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 42 © Zühlke 2013
43.
Application Lifecycle Management
(ALM) HTML5 or native? Are you willing to maintain 1x Phone and 3x Android? native And are you willing to adapt your app for the new versions? And pay the costs? • Yes : – native o.k. • No: – HTML5 is the only way – Native: bad customer reviews rating for unsupported versions! Do you need to update fast? HTML HTML5 Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 43 © Zühlke 2013
44.
Summary Facets in mobile
development HTML5 native User experience Screen size segmentation Supporting main platforms Application lifecycle management (ALM) And what is about conflicts? I need exiting user experience and have to support many platforms! HTML5 and native! Important use cases native Remaining in HTML5 Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 44 © Zühlke 2013
45.
Summary HTML5 or native?
/ HTML5 and native! Reconsider your decisions made years ago web HTML5 There are lot of standards around HTML5 HTML5 Environment Plugin RIA that will empower HTML5 in native direction More use case are possible with HTML5 Standalone RIA There are limits and cost barriers Rich Clients native for HTML5 and native low User Interaction complex/high User experience is important for customers Best user experience is with native User experience Screen size segmentation Supporting main platforms ALM Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 45 © Zühlke 2013
46.
Questions?
web HTML5 HTML5 Environment Plugin RIA Standalone RIA Rich Clients native low User Interaction complex/high User experience Screen size segmentation Supporting main platforms ALM niko.ch/talks Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 46 © Zühlke 2013
47.
Want more? http://www.zuehlke.com/de/zuehlke-group/educationcentre/kursangebot.html Zühlke trainings
in Trainings with me • UI-Engineering • UI-Engineering • Interaction Design • Requirements Engineering Advanced Level – Elicitation & • Usability Engineering Consolidation Coming soon • HTML5 and JavaScript Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 47 © Zühlke 2013
48.
Links (1/3) Peter Friese:
Cross platform mobile development http://de.slideshare.net/peterfriese/cross-platform-mobile-development-11239246 Mischa Demarmels, Katja Neumann und Thomas Memmel: Mobile Engineering - Welche Umsetzungsstrategie ist die richtige? http://www.zuehlke.com/fileadmin/pdf/others/whitepaper_mobile_engineering.pdf Romano Roth und Oliver Brack: iOS, Android, WP7... Alle nativ auf einen Streich! http://www.zuehlke.com/fileadmin/pdf/others/ios-android-wp7-alle-auf-einen-streich.pdf Nikolaos Kaintantzis: Reicher werden - Wie HTML5 Rich Internet Applications verändert. http://www.zuehlke.com/fileadmin/pdf/fachartikel/218_ix_reicher_werden_nka.pdf Peter Kröner: Die Karte des HTML5-Universums http://www.peterkroener.de/die-karte-des-html5-universums/ Compatibility tables for support of HTML5, CSS3, SVG and more in desktop and mobile browsers: http://caniuse.com/ Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 48 © Zühlke 2013
49.
Links (2/3) Responsive Navigation
Pattterns http://bradfrostweb.com/blog/web/responsive-nav-patterns/ http://www.lukew.com/ff/entry.asp?1514 Styleguide Android-Apps: http://developer.android.com/design/index.html Responsive Design Examples http://designmodo.com/responsive-design-examples/ 5 Really Useful Responsive Web Design Patterns: http://designshack.net/articles/css/5-really-useful-responsive-web-design-patterns/ Standards for Web Applications on Mobile http://www.w3.org/Mobile/mobile-web-app-state/ HTML5 compatibility on mobile and tablet browsers http://mobilehtml5.org/ Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 49 © Zühlke 2013
50.
Links (3/3) Fastbook Homepage: http://fb.html5isready.com/ Blog
The Making of Fastbook: An HTML5 Love Story http://www.sencha.com/blog/the-making-of-fastbook-an-html5-love-story Fastbook vs Faceboom Video http://vimeo.com/55486684 Facebook still likes Web apps in some circumstances. http://news.cnet.com/8301-1023_3-57511142-93/html5-is-dead-long-live-html5 HTML5 isn't Facebook's 'biggest mistake‘ http://www.theregister.co.uk/2012/09/14/facebook_html_5_vs_native_apps/ polyfills http://tinyurl.com/polyfill modernizr http://modernizr.com/ YepNope.js http://yepnopejs.com/ Mobile: HTML5 or native? | Nikolaos Kaintantzis 11. April 2013 Slide 50 © Zühlke 2013
Baixar agora