apptalk frontline: web vs hybrid vs native

AppTalk Frontline13.2.2013

2

Agenda Welcoming words by Karl Ots, Symbio Native, Hybrid or Web app? Mobile frontend Discussion & networking

3

Speaker Sebastian de Mel, frontend developer at Exove Oy.

Been in the web business as a entrepreneur for over 5 years until recently when he joined the ranks of Exove Oy, whose customers include: Nelonen, Fiskars, Bonnier publication and others.

Studied algorithms in University of Tampere and has a Media-assistant degree.

Technologies used in daily work:

JavaScript, Underscore, jQuery, Zepto etc.

PhoneGap

eZ Publish, Drupal, Concrete5

4

Native, Hybrid or Web app?

5

Initial questionsDoes it make sense?

”According to AppsFire's analysis, by the time you hit the 1000th app (as far as popularity), you're looking at only 1.76 percent of users with the program installed. Once you pass the 2000th program, the number of active installs is barely a blip on the radar.”Source: PCWorld (http://www.pcworld.com/article/181448/Apples_App_Store_100000_Apps_But_Most_Are_Unused.html)

6

Initial questions

Does it make sense?Mobile apps reach ROI is over two times smaller than an mobile websites

Assumptions in calculation: - Mobile App (Android) costs 28 000€ - Smartphone penetration 38%- Mobile App (iOS, Android, WP) costs 84 000€ - Finland’s population 2012: 5 262 930- Mobile website costs 28 000€ - Market share: WP 33%, Android 33%, iPhone 15%, other 19%

- 78% of smartphone users browse internet with there phoneData sources: http://www.thinkwithgoogle.com/mobileplanet, Finland data sethttp://wmpoweruser.com/finnish-carrier-data-shows-windows-phone-had-33-market-share-in-june/

Mobile app (Android)

Mobile app (WP, Android, iOS)

Mobile website

0 10 20 30 40 50 60

Reach (Persons per €) in Finland

Reach (Persons per €)

7

Initial questions

Do you need it and does it fit your business?

Asked whether he lost a big promotional opportunity by leaving the iTunes store, he replied: “I don’t need Apple to tell the world the Financial Times is here. We’ve been here for 120 years.” He added that iOS apps don’t seem to be working for publishers, as they’re not bringing in enough revenue. Said Grimshaw: “I’m not sure it’s all that it’s cracked up to be.”Source: PaidContent.org(http://paidcontent.org/2012/05/23/ft-web-app-success/)

8

Initial questions

Are your competitors there? How well are they doing?

AppStore App Sweden Uk Germany USA

IKEA #210 #15 #148 #42 #284

Walmart NA NA NA #32

H&M #29 #2 #112 #12 #28 #4 #67

9

Decission model

10

Customer Country/Ecosystem Age Gender

11

Customer: Country/Ecosystem

Sources:WM Power User.com, http://wmpoweruser.com/finnish-carrier-data-shows-windows-phone-had-33-market-share-in-june/Tech Thoughts.net,http://www.tech-thoughts.net/2012/07/global-smartphone-market-share-trends.html#.UUiLAVuPhW0

Globally: Android, iPhone Finland: Android, Windows Phone

12

Customer: Country/Ecosystem

Elisa consumer (FIN) DNA (FIN) Sonera (FIN)

1. Nokia Lumia 800 1. Samsung Galaxy Y 1. Nokia Lumia 800

2. Apple iPhone 4S 2. Nokia Lumia 920 2. Apple iPhone 4S

3. Nokia C2-01 3. Nokia Lumia 800 3. Samsung Galaxy Xcover

4. Samsung Galaxy S III 4. iPhone 5 4. Samsung Galaxy Gio

5. Samsung Galaxy S II 5. Nokia 113 5. Apple iPhone 5

2012 Smartphone ranks

Sources:Mobiili.fi, http://mobiili.fi/2013/01/02/dnan-elisan-ja-soneran-suosituimmat-vuonna-2012-nokian-lumiat-parjasivat-hyvin/

13

Customer: Age

Sources:Business Insider, http://www.businessinsider.com/chart-of-the-day-smartphone-demographics-still-skew-young-and-moneyed-2012-7Markting Charts.com, http://www.marketingcharts.com/wp/topics/demographics/tablet-adoption-less-age-dependent-than-smartphone-ownership-in-developed-markets-25824/

14

Customer: Age

Sources:Telecom Circle, http://www.telecomcircle.com/2011/10/chart-demographics-of-tablet-and-ereader-user/

15

Customer: Age

Sources:Flurry.com, http://blog.flurry.com/bid/90987/The-Truth-About-Cats-and-Dogs-Smartphone-vs-Tablet-Usage-Differences

16

Customer: Sex

Sources:Flurry.com, http://blog.flurry.com/bid/90987/The-Truth-About-Cats-and-Dogs-Smartphone-vs-Tablet-Usage-Differences

17

Content Lifetime Context User created Private/Share Connectivity

18

Content: LifetimeWhat is your contents average lifetime?

“The average Post Lifetime for a Page is 3 hours and 7 minutes. The median Post Lifetime is 2 hours and 56 minutes, illustrating that most Pages are experiencing Post Lifetimes around 3 hours.”

Source: Edgerank Checkerhttp://edgerankchecker.com/blog/2012/01/post-lifetime-how-long-does-a-facebook-post-live/

EXAMPLE: FACEBOOK POST

19

Content: Lifetime

Source:http://www.seomoz.org/blog/when-is-my-tweets-prime-of-life

20

Content: When When is your app used and in what context?

Source:http://searchengineland.com/infographic-how-where-when-people-share-content-100539

21

How much data does your user produce passively?

How much data can your user create?

What kind of data do you wantfrom the user?

Content: User created

Source:http://www.byreputation.com/User-Generated-Content-Statistics_a/319.htm

22

Content Private/Share

Is the data private or somethink the user can/should share

ConnectivityDoes the content need to move trough different devices?

Is the content a sub-group of larger content?

23

Use Type Where Offline/Online Session length Delay

24

Use: Type What type of

application is your app?Social networkGameRead/consume content

Produce data/content

Sources:Flurry.com, http://blog.flurry.com/bid/90987/The-Truth-About-Cats-and-Dogs-Smartphone-vs-Tablet-Usage-Difference

25

Use: WhereIN FINLAND

Where is your app ment to be used?

Some apps, like foursquere are used on-the-go while others arn’t location specific.

Notice, that location effects often the use-case

Data sources: http://www.thinkwithgoogle.com/mobileplanet, Finland data set

26

Use: Where Different use for

different deviceTablets more entertainment oriented (76%)

Smartphones have more wider use- Utilities: 17%- Social Networking 24%- Entertainent: 42%* Here entertainment means

Games + Enternainment from the chart

Sources:Flurry.com, http://blog.flurry.com/bid/90987/The-Truth-About-Cats-and-Dogs-Smartphone-vs-Tablet-Usage-Difference

27

Use Offline/Online

If your app is to help fishers, you can asume that it should support offline use.

Session lengthRelated: Articlehttp://www.academia.edu/1606806/The_Effect_of_Context_on_Smartphone_Usage_Sessions

28

Use Delay

What is your contents prefered delay.

Example: - E-mail’s should be notified in ”real-time”- Blog posts can be ordered in RSS for ”real-time” updating

29

Company

Source:http://searchengineland.com/infographic-how-where-when-people-share-content-100539

GoalThe app can have a different goals and the goals should reflect the apps intended overall lifetime and audience.

BudgetApps cost often much more than websites. The dilemma in a budget is that if you go to cheep the end result might not make any impact. Large enough budget is key.

ROIApps have a smaller reach and each person costs more, however, you impact can be also greater.

30

Development

Source:http://searchengineland.com/infographic-how-where-when-people-share-content-100539

App lifetimeApp can have a short lifetime, so prepare to promote

Apps are not a fire-and-forget investment

Interesting slide show from Pinc Media (little outdated) http://www.slideshare.net/pinchmedia/iphone-appstore-secrets-pinch-media

31

Development: Complexity In native approach you will have 3-5 different client

projects and at least one backend. In hybrid you will have 1-2 different clients projects

and at least one backend In web, you have one client side (if any) and one

backend.

Projects increase rapidlyWeb: 1-2 projectsHybrid: 2-3 projects, 50-100% increase from webNative: 4-6 projects, 300-400% increase from web

32

Development: ComplexityAndroid screen fragmentation increases development and testing

complexity

33

Development

MaintenaceOften more complex = More maintenanceAccording to Roy Chomko at Adage Technologie“ Typically, application maintenance ranges from 15 to 20 percent of the original development costs. “ Source: http://www.manufacturing.net/articles/2012/07/the-real-cost-of-developing-an-app

34

Development Features

Does your app need to heavy calculations? Example: Augmented reality, image effects etc.

Does your app produce lot’s of offline data?Is your app

35

Conclusion

36

Comparison: Web/Hybrid to Native

37

38

39

40

41

42

43

44

Responsive design

45

Responsive design MediaQuery

Enables us to specify css for specific: screen size, orientation and dpi

ProblemsMainly used for hiding dataLoading data we don't see (images etc.)Retina content

FixesLayzy loading with JavaScript

Dedicated mobile sites can offer better experienceHowever, this requires a good detection code

46

Examples: Demi, Costume, Exove

47

Dedicated mobile site

48

Dedicated mobile site Service data that is needed, rather than hide it User experience can be customized for mobile

devices Requires redirect logic and possibility to view in

desktop mode Often has a different use case

49

Example: Finnlines

50

Example: Finnlines

51

PhoneGap

52

PhoneGap Provides an ”chromeless” web browsers with access

to native code In theory, you can develope once, use anywhere In practise, suffers from the same problems as any

web development (test on every browser enviroment)

Good of rapid prototyping and developing apps Can be hard to get JS/HTML5 to mimic native

experience

53

Example: Easy Break

54

Example: BBC Olympics

NOT DEVELOPED BY EXOVE

55

Native

56

Example: Golf GameBook

57