Media Processing Server Series Platform Vendor Independent ...
Cross Platform Development Strategies with vendor review and PhoneGap case study
-
Upload
elegant-technologies-llc -
Category
Technology
-
view
7.034 -
download
0
description
Transcript of Cross Platform Development Strategies with vendor review and PhoneGap case study
![Page 1: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/1.jpg)
Beyond the BlackBerry Smartphone: Using PhoneGap and Other Strategies to Deploy Applications Across Multiple Devices
November 10th, 2009JJ RohrerPresidentElegant Technologies, LLCeleganttechnologies.com/blog/etr
![Page 2: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/2.jpg)
Agenda
• Cross Platform Problem Space
• Vendors, Options, Strategies
• Case Study - Web, PhoneGap, & Widgets
• Recommendations
![Page 3: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/3.jpg)
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
![Page 4: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/4.jpg)
4
Cross Platform Problem Space
![Page 5: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/5.jpg)
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
![Page 6: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/6.jpg)
Cross Platform Problem SpaceCross 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
![Page 7: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/7.jpg)
Cross Platform Problem SpaceCross 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.
![Page 8: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/8.jpg)
Cross Platform Problem SpaceCross 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
![Page 9: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/9.jpg)
9
Vendors, Options, Strategies
![Page 10: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/10.jpg)
Vendors, Options, StrategiesCross Platform for Mobile is New(ish) Beast
• Titanium (Appcelerator)
• Rhomobile
• J2ME Polish
• Pure WebApp
• Web, PhoneGap, Widgets
• Flash 10.1
![Page 11: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/11.jpg)
11
Vendors, Options, StrategiesCapabilities Matrix
Cost BB iPhone PalmWebOS
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
![Page 12: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/12.jpg)
12
Case Study - Web, PhoneGap, & Widgets
![Page 13: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/13.jpg)
13
• Write Once - Run Many
• Keep it simple
• Real-World use
• Start with PhoneGap, or derivative
13
Case Study - Web, PhoneGap, & Widgets Objectives
![Page 14: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/14.jpg)
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
![Page 15: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/15.jpg)
15
• 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
15
Case Study - Web, PhoneGap, & Widgets How Does it Work
![Page 16: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/16.jpg)
16
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
![Page 17: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/17.jpg)
17
Case Study - Web, PhoneGap, & Widgets Safari
![Page 18: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/18.jpg)
18
Case Study - Web, PhoneGap, & Widgets Safari to Devices
![Page 19: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/19.jpg)
19
Case Study - Web, PhoneGap, & Widgets Android
PhoneGap
![Page 20: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/20.jpg)
20
Case Study - Web, PhoneGap, & Widgets Nokia S60
Widget
![Page 21: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/21.jpg)
21
Case Study - Web, PhoneGap, & Widgets Palm Pre (Web OS)
~Widget
![Page 22: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/22.jpg)
22
Case Study - Web, PhoneGap, & Widgets iPhone
PhoneGap
![Page 23: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/23.jpg)
23
Case Study - Web, PhoneGap, & Widgets BlackBerry
Widget
![Page 24: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/24.jpg)
24
• 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
24
Case Study - Web, PhoneGap, & Widgets What Went Well
![Page 25: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/25.jpg)
25
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
25
![Page 26: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/26.jpg)
26
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
• Version26
![Page 27: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/27.jpg)
27
Recommendations
![Page 28: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/28.jpg)
RecommendationsWhat 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?
![Page 29: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/29.jpg)
29
Budget Platform Access Native Technology
RespondstoMoney
RespondstoHacking
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
RecommendationsWhat to Do...It depends...
![Page 30: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/30.jpg)
30
Conclusion
30
![Page 31: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/31.jpg)
Conclusion
• Know what you are getting yourself into
• Be ready to make trade-offs
• Keep watching the technologies for new developments
![Page 32: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/32.jpg)
Thank You
10 November, 2009
JJ Rohrer
Elegant Technologies, LLC
eleganttechnologies.com/blog/[email protected]
![Page 33: Cross Platform Development Strategies with vendor review and PhoneGap case study](https://reader036.fdocuments.in/reader036/viewer/2022062703/554d198eb4c905805d8b55cb/html5/thumbnails/33.jpg)
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