How to pick the right development model for your mobile project?

58
How to pick the right development model for your next mobile project Conny Svensson | Managing Architect and Strategist Mobility [email protected] | @connysvensson ScanDev 2013

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.

Transcript of How to pick the right development model for your mobile project?

Page 1: How to pick the right development model for your mobile project?

How to pick the right development model for your next mobile projectConny Svensson | Managing Architect and Strategist [email protected] | @connysvensson

ScanDev 2013

Page 2: How to pick the right development model for your mobile project?

2

Page 3: How to pick the right development model for your mobile project?

2

Page 4: How to pick the right development model for your mobile project?

2

Page 5: How to pick the right development model for your mobile project?

Web vs Native is irrelevant!

Page 6: How to pick the right development model for your mobile project?

Every project is different!

Page 7: How to pick the right development model for your mobile project?

• Audience• Time and budget• Usage patterns• Features• Monetization• Maintenance

Requirements and context

4

Page 8: How to pick the right development model for your mobile project?

Technology is only one part

5

Page 9: How to pick the right development model for your mobile project?

Technology is only one part

5

Business User

Technology

Page 10: How to pick the right development model for your mobile project?

We live in a multi-platform world!

Page 11: How to pick the right development model for your mobile project?

7

Page 12: How to pick the right development model for your mobile project?

7

Page 13: How to pick the right development model for your mobile project?

7

Page 14: How to pick the right development model for your mobile project?

Change is constant

Android iOS Symbian RIM Bada Windows Others

8

Page 15: How to pick the right development model for your mobile project?

20,0

40,0

60,0

80,0

2007 2008 200910Q110Q210Q310Q411Q111Q211Q311Q412Q112Q212Q312Q4

Change is constant

Android iOS Symbian RIM Bada Windows Others

8

Page 16: How to pick the right development model for your mobile project?

9

Page 17: How to pick the right development model for your mobile project?

9

Page 18: How to pick the right development model for your mobile project?

We live in a multi-device world!

Page 19: How to pick the right development model for your mobile project?

11

Page 20: How to pick the right development model for your mobile project?

11

Page 21: How to pick the right development model for your mobile project?

11

Page 22: How to pick the right development model for your mobile project?

12

Page 23: How to pick the right development model for your mobile project?

Mobile websiteHybrid

Responsive

Web app

Custom runtimeNative

Mobile platform

12

Cross compiling

Mixed hybrid

Page 24: How to pick the right development model for your mobile project?

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

Page 25: How to pick the right development model for your mobile project?

Lets go through them one by one...

Page 26: How to pick the right development model for your mobile project?

Responsive design

15

Page 27: How to pick the right development model for your mobile project?

Responsive design

15

Page 28: How to pick the right development model for your mobile project?

Responsive design

15

Page 29: How to pick the right development model for your mobile project?

Responsive design

15

Page 30: How to pick the right development model for your mobile project?

Responsive design

16

Page 31: How to pick the right development model for your mobile project?

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;! }}

Page 32: How to pick the right development model for your mobile project?

Responsive design

Frameworks– 1140 CSS Grid– 320 and Up– Amazium– Base– Foundation– Gumby– Kube– Skeleton– Twitter Bootstrap

17

Page 33: How to pick the right development model for your mobile project?

Mobile web site

18

Page 34: How to pick the right development model for your mobile project?

Mobile web site

18

Page 35: How to pick the right development model for your mobile project?

Mobile web site

Tools and services– Mippin– Mobify– MobiSite Galore– Mobstac– Mofuse– BMobilized– Onbile– Winksite– Zinadoo

19

Page 36: How to pick the right development model for your mobile project?

Mobile web app

20

Page 37: How to pick the right development model for your mobile project?

Mobile web app

20

Page 38: How to pick the right development model for your mobile project?

Mobile web app

Frameworks– DHTMLX Touch– Dojo Mobile– Jo– jQuery Mobile– Kendo UI– Sencha Touch– Sproutcore– The M-Project– Wijmo

21

Page 39: How to pick the right development model for your mobile project?

Hybrid

22

WrapperHTML5CSS3

JavaScriptApp Framework

Bridge API

Device API

Plugins

Page 40: How to pick the right development model for your mobile project?

Hybrid

23

Page 41: How to pick the right development model for your mobile project?

Hybrid

23

Page 42: How to pick the right development model for your mobile project?

Hybrid

23

Page 43: How to pick the right development model for your mobile project?

PhoneGap / Cordova

24

It’s your own custom branded web browser!

Page 44: How to pick the right development model for your mobile project?

PhoneGap / Cordova

24

It’s your own custom branded web browser!

Page 45: How to pick the right development model for your mobile project?

Custom Runtime

25

AppJavaScript

ActionScriptJava

C/C++/C#Framework API

Device API

Runtime

Page 46: How to pick the right development model for your mobile project?

Custom Runtime

Frameworks– Flash / Air (ActionScript)– MoSync (C/C++)– Titanium (JavaScript)– Xamarin (C#)

Cross compiling–Codename One (Java)– Java2ObjC (Java)

26

Page 47: How to pick the right development model for your mobile project?

Native

27

AppJava

Objective-CC#

C/C++Platform SDK

Device API

Page 48: How to pick the right development model for your mobile project?

Native

28

Page 49: How to pick the right development model for your mobile project?

How do I choose?

Page 50: How to pick the right development model for your mobile project?

30

Full capability

Partial capability

Single platform Multiple platforms

Page 51: How to pick the right development model for your mobile project?

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

Page 52: How to pick the right development model for your mobile project?

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

Page 53: How to pick the right development model for your mobile project?

User experience and features

Resources

31

Page 54: How to pick the right development model for your mobile project?

Responsive

User experience and features

Resources

Mobile websiteWeb app

Native

Hybrid

Custom runtime

Mobile platform

31

Page 55: How to pick the right development model for your mobile project?

There are no silver bullets!

Page 56: How to pick the right development model for your mobile project?

AppDevMoPr (App Development Model Picker)

33

A tool helping you to choose the right development model based on your needs

Page 57: How to pick the right development model for your mobile project?

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