View
117
Download
6
Category
Tags:
Preview:
DESCRIPTION
Everybody wants an app today, but do you really need an app? The need for mobile solutions is growing and there are many ways to accomplish this. There is no "silver bullet" that fits every situation. As usual you need to first look at what problem you need to solve, what are the needs and then pick a technology. Responsive design, mobile website, web app, HTML5, hybrid, mixed hybrid, custom runtime, native, mobile platform, there are a lot of technical terms floating around in mobile development. Lets go thru each one and look at the benefits as well as the drawbacks, when they fit and when not to use them. We look at a couple of real world examples, what technology they use and why. Finally we end the presentation with a new interactive model that can give you a helping hand when choosing technology for your next mobile project.
Citation preview
How to pick the right development model for your next mobile projectConny Svensson | Managing Architect and Strategist Mobilityc.svensson@cgi.com | @connysvensson
ScanDev 2013
2
2
2
Web vs Native is irrelevant!
Every project is different!
• Audience• Time and budget• Usage patterns• Features• Monetization• Maintenance
Requirements and context
4
Technology is only one part
5
Technology is only one part
5
Business User
Technology
We live in a multi-platform world!
7
7
7
Change is constant
Android iOS Symbian RIM Bada Windows Others
8
20,0
40,0
60,0
80,0
2007 2008 200910Q110Q210Q310Q411Q111Q211Q311Q412Q112Q212Q312Q4
Change is constant
Android iOS Symbian RIM Bada Windows Others
8
9
9
We live in a multi-device world!
11
11
11
12
Mobile websiteHybrid
Responsive
Web app
Custom runtimeNative
Mobile platform
12
Cross compiling
Mixed hybrid
What’s the difference?
13
Mobile BrowserHTML4/5CSS2/3
JavaScript
Mobile Web Site
Mobile BrowserHTML5CSS3
JavaScriptApp Framework
Mobile Web App
WrapperHTML5CSS3
JavaScriptApp Framework
Bridge API
Hybrid App
Device API
Plugins
AppJava
Objective-CC#
C/C++Platform SDK
Native App
Device API
AppJavaScript
ActionScriptJavaC#
Framework API
Custom runtime
Device API
Runtime
Lets go through them one by one...
Responsive design
15
Responsive design
15
Responsive design
15
Responsive design
15
Responsive design
16
Responsive design
16
@media screen and (min-width: 560px){! .ui-field-contain label.ui-slider {! ! vertical-align: top;! ! display: inline-block;! ! width: 100%;! ! margin: 0 2% 0 0;! }! .ui-field-contain div.ui-slider {! ! display: block;! ! width: 100%%;! }! .ui-field-contain.ui-hide-label div.ui-slider {! ! display: block;! ! width: auto;! }}
Responsive design
Frameworks– 1140 CSS Grid– 320 and Up– Amazium– Base– Foundation– Gumby– Kube– Skeleton– Twitter Bootstrap
17
Mobile web site
18
Mobile web site
18
Mobile web site
Tools and services– Mippin– Mobify– MobiSite Galore– Mobstac– Mofuse– BMobilized– Onbile– Winksite– Zinadoo
19
Mobile web app
20
Mobile web app
20
Mobile web app
Frameworks– DHTMLX Touch– Dojo Mobile– Jo– jQuery Mobile– Kendo UI– Sencha Touch– Sproutcore– The M-Project– Wijmo
21
Hybrid
22
WrapperHTML5CSS3
JavaScriptApp Framework
Bridge API
Device API
Plugins
Hybrid
23
Hybrid
23
Hybrid
23
PhoneGap / Cordova
24
It’s your own custom branded web browser!
PhoneGap / Cordova
24
It’s your own custom branded web browser!
Custom Runtime
25
AppJavaScript
ActionScriptJava
C/C++/C#Framework API
Device API
Runtime
Custom Runtime
Frameworks– Flash / Air (ActionScript)– MoSync (C/C++)– Titanium (JavaScript)– Xamarin (C#)
Cross compiling–Codename One (Java)– Java2ObjC (Java)
26
Native
27
AppJava
Objective-CC#
C/C++Platform SDK
Device API
Native
28
How do I choose?
30
Full capability
Partial capability
Single platform Multiple platforms
30
Full capability
Partial capability
Single platform Multiple platforms
NativeJava/Obj-C/C#Advanced UIFastest performanceFull access to platformApp store distribution
WebHTML/CSS/JavaScriptNo special tools or hardwareDesktop reusabilityLimited access to deviceUnrestricted distribution
30
Full capability
Partial capability
Single platform Multiple platforms
NativeJava/Obj-C/C#Advanced UIFastest performanceFull access to platformApp store distribution Hybrid
HTML5/CSS3/JavaScriptEmulated native UIPartial access to deviceApp store distribution
WebHTML/CSS/JavaScriptNo special tools or hardwareDesktop reusabilityLimited access to deviceUnrestricted distribution
Custom RuntimeJava/C#/JavaScriptNative UI / Custom UIPartial access to deviceApp store distribution
User experience and features
Resources
31
Responsive
User experience and features
Resources
Mobile websiteWeb app
Native
Hybrid
Custom runtime
Mobile platform
31
There are no silver bullets!
AppDevMoPr (App Development Model Picker)
33
A tool helping you to choose the right development model based on your needs
AppDevMoPr (App Development Model Picker)
33
A tool helping you to choose the right development model based on your needs
http://admp.cgilabs.se
BETA
Thank you!Conny Svenssonc.svensson@cgi.com@connysvensson
Recommended