Cross-Platform Mobile App Developmentwith HTML5

S Balamurugan, Lead Architect

24 Mar 2012

Agenda� Cross platform mobile app development

� Introduction

� Challenges

� Industry solution

� HTML 5 features for mobile apps

� Canvas 2D

� Geolocation

© 2012 Unisys Corporation. All rights reserved. 2

� Web DB

� HTML 5 app development using PhoneGap

� Write Once Deploy Many

� Architecture

� Enterprise mobile enablement

� MEAP introduction

� Cloud based mobile app development (PaaS)

� Best practices

Mobile Technology Stack

Mobile Apps

Web Apps, Native Apps, Hybrid Apps, …

Mobile Programming Languages, APIs & Tools

Objective C, Java, HTML5, C# .NET, …

© 2012 Unisys Corporation. All rights reserved. 3

Mobile Operating System

iOS, Android, WP7, BlackBerry, …

Network Connectivity

CDMA, GSM, WiFi, …

Mobile Device Models

iPhone, iPad, Samsung Galaxy Tab, HTC, Acer, …

Mobile App Development: Challenges

� Operating System Fragmentation

� Different Technologies

© 2012 Unisys Corporation. All rights reserved. 4

� Improved supportability and maintainability

� Diversified Device Models

Mobile App Development Environments

Mobile OSOperating System

Software / IDEsProgramming language

iOS Mac only Xcode Objective C

AndroidWindows / Mac /

Linux

Eclipse, Android Dev

Tool (ADT)Java

Windows Phone 7 Windows Visual Studio 2010 C#, .Net, Silverlight

© 2012 Unisys Corporation. All rights reserved. 5

BlackBerry Windows Eclipse /JDE, Java Java

Mobile App Development: Challenges

� Lack of developers with multiple platform skills

� Source code maintenance / product management

� Development excellence and software re-use

© 2012 Unisys Corporation. All rights reserved. 6

� Improved supportability and maintainability

� Development excellence and software re-use

Cross-Platform App Development

� Web technologies like HTML5, CSS3 and JavaScript

� Enable access to device features using JavaScript APIs

� Thin native app displays web content using WebKit

� Distributed through app stores / market places

� Popular framework - PhoneGap

Hybrid apps

© 2012 Unisys Corporation. All rights reserved. 7

� UI benefits of native app; maintainability of web app

� Limited to feature set of chosen framework

� Popular framework - Titanium Appcelarator

Interpreted apps

Web sites

� Mobile websites using HTML5

What is HTML5?

� HTML5 is the next generation of HTML

� Work in progress

� Major browsers support many of HTML5 elements and APIs

© 2012 Unisys Corporation. All rights reserved. 8

� HTML5 is not yet an official standard, and no browsers have full HTML5 support

Rules for HTML5

� New features should be based on HTML, CSS, DOM, and JavaScript

� Reduce the need for external plug-in (like Flash)

� Better error handling

© 2012 Unisys Corporation. All rights reserved. 9

� More mark up to replace scripting

� HTML5 should be device independent

� The development process should be visible to the public