Cross Platform Development Strategies with vendor review and PhoneGap case study

Beyond the BlackBerry Smartphone: Using PhoneGap and Other Strategies to Deploy Applications Across Multiple Devices November 10th, 2009 JJ Rohrer President Elegant Technologies, LLC eleganttechnologies.com/blog/etr

Agenda Cross Platform Problem Space Vendors, Options, Strategies Case Study - Web, PhoneGap, & Widgets Recommendations

Intro About Me MBA + MS/CS = Trouble Experimenting iPhone WebApp + Staff Pick = Big Head iPhone Native Android BlackBerry Storm N60 Palm Pre Need Better Way So - Let’s look at cross-platform strategies

Cross Platform Problem Space Cross Platform Desktop Development as Bad Model Cross Browser Web 2.0 Development as Bad Model Cross Platform for Mobile is New(ish) Beast

Cross Platform Problem Space Cross Platform Desktop Development as Bad Model Usually... Big framework J2ME, Adobe Air, GTK Non-native UI Swing, TCL/TK Common Language Output C/C++, Java, Ruby as executable Trades efficiency in execution for code commonality Bad Paradigm for Mobile because... Not efficient Can’t reach all platforms

Cross Platform Problem Space Cross Browser Web 2.0 Development as Bad Model Big framework JQuery, Yahoo toolkit, Adobe Air Minimal compatibility with mobile web browsers Non-native UI A common web UI will look out of place on all devices WebApps are bad for mobile because... Breaks “App” paradigm Loses device specific functionality Push, contacts, accelerometers, etc.

Cross Platform Problem Space Cross Platform for Mobile is New(ish) Beast Small is beautiful Limited memory, screen, cpu Real UI Differences between platforms Different Look & Feel (Mac vs. PC) Whole Different Metaphors! (Tabs vs. Cards) Different icon sizes, orientations, buttons, etc. Real Language Differences Java is fairly common, but not ubiquitous Android’s OS is way different than iPhone & BlackBerry iPhone only has ObjectiveC, C/C++, & JS in Webview

Vendors, Options, Strategies Cross Platform for Mobile is New(ish) Beast Titanium (Appcelerator) Rhomobile J2ME Polish Pure WebApp Web, PhoneGap, Widgets Flash 10.1

Vendors, Options, Strategies Capabilities Matrix Cost BB iPhone Palm WebOS S60 Android Win Mobile Safari Chrome Firefox IE 7 Comments Titanium ( Appcelerator) $$ X X Rhomobile $$ X X X X X +Ruby J2ME Polish $$ X X X J2ME w/ macros Pure WebApp - x X x x X x X X X X - Limited access to native Web, PhoneGap, Widget - x X X X X X X X X X - Immature + Unlimited customization Flash 10.1 (pre-beta) $$ X X X X X X X X X X + Adaptive strategies

Case Study - Web, PhoneGap, & Widgets

Write Once - Run Many Keep it simple Real-World use Start with PhoneGap, or derivative Case Study - Web, PhoneGap, & Widgets Objectives

Case Study - Web, PhoneGap, & Widgets What is PhoneGap? Open Source Wraps a web view with native code You write your app in HTML + JavaScript Provides conduits to device features

PhoneGap has its own JavaScript API Each platform shares some common JavaScript, plus some custom JavaScript Native code creates a web view and creates conduits between that web view and the device’s features. Contacts GPS, etc. Developer writes a single web page Initial testing in desktop browser Final testing on the device Case Study - Web, PhoneGap, & Widgets How Does it Work

Case Study - Web, PhoneGap, & Widgets App - Quadratic Equation Solver Quadratic Equation: ax^2 + bx + c = 0 Easy JavaScript No persistence No native device dependencies (GPS, contacts, etc.). Meaningful on the web, and on mobile devices Nice control point - Is there a market for something this simple? It shouldn’t get any easier than this

Case Study - Web, PhoneGap, & Widgets Safari

Case Study - Web, PhoneGap, & Widgets Safari to Devices

Case Study - Web, PhoneGap, & Widgets Android PhoneGap

Case Study - Web, PhoneGap, & Widgets Nokia S60 Widget

Case Study - Web, PhoneGap, & Widgets Palm Pre (Web OS) ~Widget

Case Study - Web, PhoneGap, & Widgets iPhone PhoneGap

Case Study - Web, PhoneGap, & Widgets BlackBerry Widget

Approach works for lots of the platforms This app is currently on iPhone, Android, Ovi app stores Unexpected Benefit Created a little web-based app emulator as sales tool Used Dashcode as WYSIWYG editor Writing ‘Fixer’ code to change Dashcode implementation with cross-platform implementation Case Study - Web, PhoneGap, & Widgets What Went Well

Case Study - Web, PhoneGap, & Widgets What Went Badly Not 100% cross platform yet - but close. Learning the common ground of HTML between browsers Very difficult to work with older browsers. Common Storage Model (cookies vs. SQL vs. other) Asynchronous disconnect Difficult to program when one device handles something, like storage, synchronously, but another handles it asynchronously Lack of means to call soft numeric keypad, numlock, etc. Track ball vs. keypad vs. tapping = impedance mismatch

Case Study - Web, PhoneGap, & Widgets What Was Unexpected Accessing Device Features (GPS, Contacts, etc) is almost a solved issue JavaScript compatibility is a huge challenge Layout compatibility is also a huge challenge Different HTML capability Different Screen sizes Build scripts made it tolerable Nearly every device has a variations on themes Icon image (various sizes) Title Version

Recommendations What to Know... Know your final platforms / devices Desktop Browser, BlackBerry, Android, Etc. Know which technologies you need Contacts, GPS, High Speed Graphics, etc. Know input modes Numeric Keypad, QWERTY, Trackball, Rockers, etc. Know your aptitude towards making custom extensions Do you need support, or can you hack your own extensions? Know your budget Can you buy your way out of difficulty?

Recommendations What to Do... It depends... Budget Platform Access Native Technology Responds to Money Responds to Hacking Titanium ( Appcelerator) $$ x X X Rhomobile $$ x X X J2ME Polish $$ x X x Pure WebApp X Web, PhoneGap, Widget X x X Flash 10.1 (pre-beta) $$ X X

Conclusion Know what you are getting yourself into Be ready to make trade-offs Keep watching the technologies for new developments

Thank You 10 November, 2009 JJ Rohrer Elegant Technologies, LLC eleganttechnologies.com/blog/etr [email_address]

Extra: Widget vs. PhoneGap Widgets are web wrappers written by the device maker This is like PhoneGap, except that device specific Not common API Usually very complete, robust, documented

Cross Platform Development Strategies with vendor review and PhoneGap case study

Recommended

More Related Content

What's hot (11)

Similar to Cross Platform Development Strategies with vendor review and PhoneGap case study (20)

Recently uploaded (20)

Cross Platform Development Strategies with vendor review and PhoneGap case study