MOBILE APPLICATION DEVELOPMENT

Curix InfoTech Pvt. Ltd.

From a Web Developer’s Perspective

Today’s Mobile Technology

Today’s Mobile Technology

High-speed Internet Edge/3G: 100 Kbps–1.5

Mbps Wifi: 10+ Mbps Significant processor

speeds Significant graphical

capabilities Touch interfaces

Web App vs. Native App

Web App vs. Native AppEasy to developDon’t require approvalMaintained centrallyNot on App StoreLimited to HTML/CSS/JavaScript capabilities

Better UI More powerful More control Access to GPU Costly to develop Requires approval

Web App vs. Native App

Mobile & Smartphone Style sheets • Viewport Definition • Optimized Graphics

…vs. Mobile Website

Technologies• Objective-C & Cocoa Touch (iPhone-only)• Java (Blackberry, Android, Symbian)• Palm Mojo [HTML5, JS, CSS + Dojo-based framework] (Palm-only)• Visual C#/Visual Basic/.NET (Windows Mobile-only)• C++ (Symbian, Windows Mobile)• HTML5, JavaScript and CSS• PhoneGap• Titanium Mobile• RhomobileCross-platform w/ single API

HTML5, JavaScript & CSSThe basics

CSS2“Handheld” Media Stylesheets

CSS3 Media Queries Apple* Viewport

Advanced • HTML5 Offline Caching • HTML5 SQLite-compatible Offline

Storage • CSS3 CSS Animations • W3C API Geo location • HTML5 Canvas

HTML5, JavaScript & CSS

Mobile JS/CSS Frameworks

jQTouchjQuery plugin for iPhone UIhttp://www.jqtouch.com/SafireiPhone UI clonehttp://code.google.com/p/safire/iWebKitExtensive iPhone UI clonehttp://iwebkit.net/WebApp.NetiPhone UI clone + frameworkhttp://webapp-net.com/DashcodeApple’s Dashboard Toolkithttp://bit.ly/7sntmM

IUI(Older) iPhone UI clonehttp://code.google.com/p/iui/XUIMobile-focused frameworkhttp://xuijs.com/CiUICNET’s iPhone UI clonehttp://bit.ly/5p4tMYUiUIKitCSS-only iPhone UI clonehttp://bit.ly/7QtnhxMagic FrameworkiPhone UI clonehttp://bit.ly/6zJ4eK

PhoneGapPhoneGap

WebKit-wrapper application Consistent APIs for device

functions Geolocation Vibration Accelerometer Etc Supports many devices

PhoneGap Device Support

Titanium MobileTitanium Mobile

Accelerometer Database File system Geolocation Mapping Media Networking

+Native UI

Components

Titanium 0.9/1.0 iPad & Blackberry

support Less reliance on web views (slow) Dynamic APIs More extensible 5x+ performance increases

New APIs Animation Streaming Audio Proximity Sensor Low-level Graphics Network Streaming

PhoneGap vs. Titanium Easier to

start Supports

more Platforms

Mobile & desktop

Native UI Poor

documentationBoth fully open source!

PhoneGap vs. Titanium

PhoneGap vs. Titanium

Objective-C/Cocoa Touch 100% Native Application

Full native performance Access to entire iPhone SDK & UI

Components Interface Builder iPhone/iPad-only Mac development-only*

* No matter what you need a Mac to compile for iPhone

DEMOHTML5 Offline Caching

HTML5 Offline Caching

Mobile StylesheetsTo account for Windows Mobile, conditional

comments are required (not shown).

Mobile StylesheetsTo account for Windows Mobile, conditional

comments are required (not shown).

Mobile StylesheetsTo account for Windows Mobile, conditional

comments are required (not shown).

Mobile StylesheetsTo account for Windows Mobile, conditional

comments are required (not shown).

Viewport Scaling

Width Height initial-scale minimum-scale maximum-scale user-scalable

Tip:When setting the width/heightyou can use “device-width” and“device-height” to match thesize of the user’s device.

HTML5 SQLite Storage

CSS3 Transitions Properties: none, all, <property> Timing: ease, ease-in, ease-out, ease-in-out, cubic-bezier(x1, y1, x2, y2)

Geolocation API

Geolocation API

Geolocation API

Geolocation API

Geolocation API

Phone-Specific Tags apple-mobile-web-app-capable (yes/no) apple-mobile-web-app-status-bar-style

(default,black, black-translucent)

format-detection (telephone=no)

Philly New Media Hub Mobile

IUI Code Example

IUI Code Example

IUI Code Example

IUI Code Example

G-19, Sec – 63 Noida-201301

Curix InfoTech Pvt. Ltd.

Sandeep Verma (Director)Curix InfoTech Pvt. Ltd.Ph:0120-4331955 Web: http://www.curixinfotech.comEmail: sales@curixinfotech.com