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  Responsive Design  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.  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 (many companies choose to differentiate theirs by “m.domain.com”).   Responsive design lets you keep your own domain—nothing changes except code on the back-end.    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  Responsive Design  Because a mobile site uses a separate domain, links shared from mobile browsers will not count as search link equity toward your primary site. 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  Re-working of a mobile site might be needed in order to stay current with next-generation phones and mobile browsers. The technology is more forward-thinking because once added to site it will work on next months and next year’s devices without having to be programmed 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)   Native Mobile Apps Web Apps Hybrid App Features Graphics Native APIs HTML, Canvas, SVG Performance Fast Slow Native look and feel Native Emulated Distribution Appstore Web Device Access Camera Yes No Notifications Contacts, calendar Acceloromator Offline storage Secure file storage Shared SQL Secure file system, shared SQL Geolocation Yes (through built in GPS) Yes (Using Web Technology) Gestures Swipe Pinch, spread Connectivity Online and offline Online Only Development skills ObjectiveC, Java 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: 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 Is search engine visibility to drive interest to your application important? Yes – consider MW 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 MW Are you trying to create something that is universally accessible? Yes – consider MW

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-or-mobile-website-infographic/ http://www.businessinsider.com/html5-or-native-apps-for-mobile-2013-10?op=1 http://wiki.developerforce.com/page/Native,_HTML5,_or_Hybrid:_Understanding_Your_Mobile_Application_Development_Options http://www.e-junkie.info/2012/12/making-right-choice-native-mobile-web.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