Download Mobi-sites and Apps for Mobile Devices

Mobi-sites and Apps for
Mobile Devices
“pros & cons of each”
Presenter: Willie Nel
Date: 12 March 2014
ITS Integrator User Group 2014
Session: 80
Agenda
• Future of Mobile Devices
• Native Mobile Apps – Brief Overview
• Mobile Web – Brief Overview
– Popular Libraries
– Responsive Web Design
• Hybrid Mobile Technology
• Native Mobile Apps or Mobile Web – Guidelines on Choosing the Right
Technology (pros and cons)
Future of Mobile Devices – Jan 2011
Future of Mobile Devices – Jan 2012
Future of Mobile Devices – Jan 2013
Future of Mobile Devices – Jan 2014
Future of Mobile Devices - Worldwide
Future of Mobile Devices - Africa
Future of Mobile Devices – South Africa
Native Mobile Apps – Brief Overview
• Native Mobile Applications (Apps)
– Application software designed to run on smartphones, tablet computers
and other mobile devices
– Apps are usually available through application distribution platforms
•
•
•
•
Apple – App Store (650 000 available apps)
Android – Google Play (850 000 available apps)
Microsoft – Windows Phone Store (120 000 available apps)
Blackberry – Blackberry App World (120 000 available apps)
– According to Gartner:
• 102 billion apps will be downloaded in 2013
• 91% of them will be free
• Will still generate US$26 billion
Native Mobile Apps – Popular Examples
Mobile Web – Brief Overview
• Mobile Websites (Web)
– A mobile-friendly site is a website which content is rendered in a manner
that is easily readable and for mobile devices (smaller screen devices),
such as smart phones and tablet devices.
– The websites are usually developed using HTML5, CCS3 and JavaScript
technology.
– Popular libraries like jQuery Mobile can be used.
Mobile Web – Examples
• Disney World
• http://m.disneyworld.disney.go.com/
Mobile Web – Examples
• Stanford
• http://m.stanford.edu
Mobile Web – Responsive Web Design
• Responsive Web Design (RWD)
– A Web design approach aimed at crafting sites to provide an optimal
viewing experience.
• Easy reading and navigation with a minimum of resizing, panning, and scrolling
• Across a wide range of devices (from mobile phones to desktop computer
monitors)
• http://www.awwwards.com/
• https://pittsburghkids.org/
• http://www.bostonglobe.com/
Mobile Web –
Mobile Site vs. Responsive Design
• Rendering Experience:
Mobile Site
A mobile site is essentially a copy of your website,
where the server does the work to deliver an
optimized page that’s smaller and easier to navigate.
Responsive Design
In responsive design, the device does the work and
automatically adjusts according to a device’s screen
size (large or small) and orientation (landscape or
portrait). It switches between these options on-the-fly.
The solution can really customize a unique experience
for mobile users.
A good choice when it might be too expensive to
redesign responsively.
A very good and flexible solution.
Mobile Web –
Mobile Site vs. Responsive Design
• Domain Protection:
Mobile Site
Responsive Design
With a mobile site, you must create a different domain Responsive design lets you keep your own domain—
(many companies choose to differentiate theirs by
nothing changes except code on the back-end.
“m.domain.com”).
Can dilute domain and hurt organic search traffic. Can
add to website management because you have to
maintain two separate silos of content.
Mobile Web –
Mobile Site vs. Responsive Design
• Link Equity:
Mobile Site
Because a mobile site uses a separate domain, links
shared from mobile browsers will not count as search
link equity toward your primary site.
Responsive Design
Since responsive design simply embeds new code on
the back-end of your website, your company’s link
equity is preserved.
Not as good for search.
Better option for search.
Mobile Web –
Mobile Site vs. Responsive Design
• Future-Ready:
Mobile Site
Responsive Design
The technology is more forward-thinking because once
Re-working of a mobile site might be needed in order added to site it will work on next months and next
to stay current with next-generation phones and
year’s devices without having to be programmed
mobile browsers.
further.
Could require higher maintenance and expense.
A better return on your investment.
Hybrid Mobile Technology
• Like native apps, run on the device
• Are written with web technologies (HTML5, CSS and JavaScript).
• Hybrid apps run inside a native container, and leverage the device’s
browser engine (but not the browser) to render the HTML and process
the JavaScript locally.
• A web-to-native abstraction layer enables access to device capabilities
that are not accessible in Mobile Web applications, such as the
accelerometer, GPS, camera and local storage.
Hybrid Mobile Technology
Hybrid Mobile Technology
Native Mobile Apps or Mobile Web – Guidelines on
Choosing the Right Technology (pros and cons)
Native Mobile Apps or Mobile Web – Guidelines on
Choosing the Right Technology (pros and cons)
Native Mobile Apps or Mobile Web – Guidelines on
Choosing the Right Technology (pros and cons)
Native Mobile Apps or Mobile Web – Guidelines on
Choosing the Right Technology (pros and cons)
Native Mobile Apps or Mobile Web – Guidelines on
Choosing the Right Technology (pros and cons)
Native Mobile Apps or Mobile Web – Guidelines on
Choosing the Right Technology (pros and cons)
Native Mobile Apps or Mobile Web – Guidelines on
Choosing the Right Technology (pros and cons)
Native Mobile Apps or Mobile Web – Guidelines on
Choosing the Right Technology (pros and cons)
Native Mobile Apps or Mobile Web – Guidelines on
Choosing the Right Technology (pros and cons)
Native Mobile Apps or Mobile Web – Guidelines on
Choosing the Right Technology (pros and cons)
Native Mobile Apps or Mobile Web – Guidelines on
Choosing the Right Technology (pros and cons)
Native Mobile Apps or Mobile Web – Guidelines on
Choosing the Right Technology (pros and cons)
Native Mobile Apps or Mobile Web – Guidelines on
Choosing the Right Technology (pros and cons)
Native Mobile Apps or Mobile Web – Guidelines on
Choosing the Right Technology (pros and cons)
Native Mobile Apps or Mobile Web – Guidelines on
Choosing the Right Technology (pros and cons)
Native Mobile Apps or Mobile Web – Guidelines on
Choosing the Right Technology (pros and cons)
Native Mobile Apps or Mobile Web – Guidelines on
Choosing the Right Technology (pros and cons)
Mobile Apps or Mobile Web – Guidelines on
Choosing the Right Technology (pros and cons)
Mobile Apps or Mobile Web – Guidelines on
Choosing the Right Technology (pros and cons)
Mobile Apps or Mobile Web – Guidelines on
Choosing the Right Technology (pros and cons)
Mobile Apps or Mobile Web – Guidelines on
Choosing the Right Technology (pros and cons)
Mobile Apps or Mobile Web – Guidelines on
Choosing the Right Technology (pros and cons)
Mobile Apps or Mobile Web – Guidelines on
Choosing the Right Technology (pros and cons)
App Features
Graphics
Performance
Native look and feel
Distribution
Device Access
Camera
Notifications
Contacts, calendar
Acceloromator
Offline storage
Geolocation
Gestures
Swipe
Pinch, spread
Connectivity
Development skills
Native Mobile Apps
Web Apps
Hybrid
Native APIs
Fast
Native
Appstore
HTML, Canvas, SVG
Slow
Emulated
Web
HTML, Canvas, SVG
Slow
Emulated
Appstore
Yes
Yes
Yes
Yes
Secure file storage
Yes (through built in GPS)
No
No
No
No
Shared SQL
Yes (Using Web Technology)
Yes
Yes
Yes
Yes
Secure file system, shared SQL
Yes (Using Web Technology)
Yes
Yes
Online and offline
ObjectiveC, Java
Yes
No
Online Only
HTML5, CSS, Javascript
Yes
Yes
Online and offline
HTML5, CSS, Javascript
Mobile Apps or Mobile Web – Guidelines on
Choosing the Right Technology (pros and cons)
Ask yourself the following questions to decide on a mobile strategy:
1.
2.
3.
4.
Will my application take advantage of smart phone functionality (Phone
GPS, Camera, Accelerometer, etc.)? Yes – consider MA
Do you have a complex UI and application design? Yes – consider MA
Do you have a limited budget? Yes – consider MW
Is your goal to make money by selling a license of your software? Yes –
consider MA
5.
Is search engine visibility to drive interest to your application important?
6.
7.
8.
Will you have difficulty getting App Store approval? Yes – consider MW
Is connectivity to the web essential to your application? Yes – consider MA
Are you sending or receiving massive amounts of data? Yes – consider MA
(Hybrid Apps is closing the gap)
Do you plan to make frequent updates to your application? Yes – consider
9.
Yes – consider MW
MW
10. Are you trying to create something that is universally accessible?
consider MW
Yes –
Mobile Apps or Mobile Web – Guidelines on
Choosing the Right Technology (pros and cons)
• Conclusion
– There is no one answer that works for everyone.
– If resources allow it, some suggest building both to capitalize on both
platforms and audiences.
– In order to decide which one is right for you, it’s important to evaluate your
specific goals, consider all the criteria above and determine which most
closely aligns with your intended audience.
– Before you begin, research, research, research.
References
• http://gs.statcounter.com/
• http://www.mdgadvertising.com/blog/should-you-build-a-mobile-app-ormobile-website-infographic/
• http://www.businessinsider.com/html5-or-native-apps-for-mobile-201310?op=1
• http://wiki.developerforce.com/page/Native,_HTML5,_or_Hybrid:_Unde
rstanding_Your_Mobile_Application_Development_Options
• http://www.e-junkie.info/2012/12/making-right-choice-native-mobileweb.html
• http://venturebeat.com/2013/07/29/native-v-web-chart/
Disclaimer
• The information, comments and material presented in this presentation
are provided for information purposes only. The presentation is not
addressing all possible technical or business aspects and does not
claim to be complete or exhaustive.
• Adapt IT reserves the right to change its business or product
development plans as circumstances dictate.
• This document may not be reproduced or distributed without the written
permission of Adapt IT (Pty) Ltd.
Thank you