Multi-Device Best Practices
Join the DZone community and get the full member experience.
Join For FreeI 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:
- Flex/AIR: Device form factor detection
- Device form factor detection in PhoneGap (example project):
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:
- Platform specific styles via CSS media queries
- Eskimo framework for platform specific styles
- Flex Code Samples (FXP)
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, DZone MVB. See the original article here.
Opinions expressed by DZone contributors are their own.
Comments