24th July 2013 Sachin Bhosale

Architecting Mobile Solutions for the Enterprise

Contents

Introduction

Pillars of Mobile Strategy

Mobile Sites vs. Native Applications

Mobile Sites

• Mobile Architecture• Building Mobile Websites• HTML5 and JQuery Mobile

Mobile Applications

• Patterns of Mobile Application Development• Cross Platform development

Introduction - The World Is Going Mobile Over 50% of the world’s households carry a

mobile device – 3B+

Global mobile traffic now represents roughly 13% of Internet traffic.

In India, mobile internet traffic surpassed desktop internet usage in May 2012 – other countries to follow

Out of 4B+ mobile users, 1B+ are smartphone users.

The future is already here – it’s just not evenly distributed

Pillars of a Mobile Strategy

• Define a Mobile Strategy

• Development and Costs

Going Mobile

• Focus on your audience

• Delivery Models

Outlining a B2C Strategy • Serve your (limited)

audience

• Mobile Enterprise Application Platforms

Outlining B2B Strategy

Mobile Sites vs. Native Applications

Server side solutionOne Site Fits (almost) AllHassle Free Deployments

No Access to Hardware capabilitiesVaried Browser CapabilitiesNetwork Latency

Fast and fully integratedApp Store IntegrationUser Experience

Isolated Mobile Continents (iOS, Android etc.)Minimized SEO

Mobile Sites

Native Applications

Mobile Sites > Architectureo Stereotypes to refresho Analysis firsto Defining a Mobile Application Layero Server-Side Device Detection

o Multi servingo One Web

• People Don’t Like Mobile Sites: Why Bother?

• You Don’t Need Mobile Sites at All

• A Tiny HTML Page Will Do the Trick

• One Site Fits All

Myths

Mobile Sites > Building Mobile Siteso Application Structure

o Single Page Interface (SPI) Modelo Full Page Refresho Partial Page Refresh

o The Device Detector Site

o Routing to mobile viewso Detecting device capabilitieso Putting the site up

Mobile Sites > HTML5 and jQuery Mobileo jQuery mobile is a cross-platform UI

framework for creating webapps for touch-enabled smartphones and tablets

o non intrusive semantic HTML5 codeo open sourced & lightweighto multi platform with progressive

enhancemento build one site that works on any

browsero Supports almost all platforms

Mobile Applications

• A applications developed to run natively on the targeted device, usually written in a device specific language like Objective-C or Java.

• Delivered through App stores

To achieve a significant market adoption, your solution needs to target at least 4-5 platforms:

iPhone , Android, Blackberry, Windows Mobile, Symbian too

Are you going to engineer for all?

Mobile Applications > Interaction Patternso Back and Save Pattern

Save the content of input screens when the user leaves (or is forced to leave) the screen

o Guess-Don’t-Ask PatternUse any available resources to make intelligent guesses and save users the largest possible bit of interaction

o A-la-Carte-Menu Pattern

o Sink-or-Async PatternImplement asynchronously any operations expected to perform for longer than a bunch of ms

o Logon-and-Forget Pattern

Mobile Applications > Presentation Patternso Babel-Tower Pattern

Avoid hard-coded and fixed layout text and design your application to support the dynamic injection of properly translated text.

o Do-as-Romans-Do PatternIt is compelling for users, and possibly also advantageous for developers, to abide by the look and feel and capabilities of the host operating system.

o List-and-Scroll PatternDon’t be afraid of using (vertical) lists in your mobile application, even long lists that contain more than 100 items to scroll.

Mobile Applications > Behavioral Patternso Predictive Fetch Pattern

If you depend on network connectivity, download data that is likely to be used later and make sure you have enough data stored at any time to survive a lack of connectivity.

o Memento-Mori PatternApplications always should save their relevant state when the operating system forces them into the background.

o As-soon-as-Possible PatternRemote operations that are critical for the application should be implemented in a protected manner and reiterated a few times before failing. In case of failure, however, the operation should be recorded and played back as connectivity returns.

Mobile Applications > Cross platform developmentThe Virtual Machine Approach

A virtual machine is an environment that creates a sort of abstraction layer on top of some underlying hardware

The Shell ApproachThe idea behind the Shell approach is to integrate a web-view native component with the user interface of the application

Titanium Mobile Flash Builder

Mobile Applications > Developing with PhoneGap

PhoneGap is built around a very simple (but effective) idea: you build a local HTML5 application, and the framework packages it as a native application for a variety of mobile platforms

Thank you!