HTML5 Zone is brought to you in partnership with:

Andrew Trice is a MobileFirst Developer Advocate with IBM. Andrew is a product evangelist, experienced software architect, team leader, accomplished speaker, and published author who possesses more than a decade of designing and implementing rich applications for the web, desktop and mobile devices, plus public speaking, technical communication and product endorsement experience. Andrew has delivered customer solutions in the fields of application development, realtime data systems, GIS, immersive experiences, and data visualization, and has presented hundreds of times to audiences ranging from C-level management, to technical & developer groups, and to creative designers and art directors. Andrew is a DZone MVB and is not an employee of DZone and has posted 55 posts at DZone. You can read more from them at their website. View Full User Profile

Multi-Device Best Practices

05.05.2012
| 5825 views |
  • submit to reddit

I recently spoke at the 360|Flex conference in Devner, CO on “Multi-Device Best Practices”.  This presentation was focused upon multi-device & multi-platform development strategies for both PhoneGap and Flex/AIR applications.  Below you can view my presentation slides and source code, and a brief summary.

First, I gave an overview of mobile & multi-platform with AIR and PhoneGap.  See these links for more detail on the platforms:

Next, I emphasized the differences in user experience, display density, usability, and application style/feel between different platforms and device form factors.  You can read more detail on these topics here:

var _w = Math.max( $(window).width(), $(window).height() );
var _h = Math.min( $(window).width(), $(window).height() );

// assume tablet view based upon display resolution
var tabletView = (_w >= 1000 && _h >= 600);

if ( tabletView ) {
  //Setup the tablet form factor via JS
}
else {
  //Setup the phone form factor via JS
}

I also covered various libraries and techniques for making your creations feel like “native apps” instead of “web pages in a container”, and ways to make your apps look & feel “more native” for a given platform.

Details on Flex/AIR-specific tools & frameworks for native-like app experiences:

Frameworks/Libraries for HTML/Web/PhoneGap, for “app-like” experiences:

Feel free to leave a comment with any questions.
Enjoy!

Published at DZone with permission of Andrew Trice, author and DZone MVB. (source)

(Note: Opinions expressed in this article and its replies are the opinions of their respective authors and not those of DZone, Inc.)