Click to search on your search term.
Subscribe to Fig Leaf Tutorials


Need help with a project? Contact us at sales@figleaf.com.
From code reviews to project "jumpstarts" and full life-cycle development, we've got you covered!
Check out our case studies!
Follow us on Twitter!
Click here to join our Facebook group!

Ready to upgrade your skills? Try these instructor-led classes in Washington, DC:
Ext JS 6 Bootcamp
12/04/2017

Understanding Design Challenges with Devices

Page of 168

Supporting variable screen resolutions, touch input, gesture support, and variable bandwidth inevitably leads you to build applications that look very different from their desktop counterparts.

Consider the following table that illustrates the differences between some of the most popular mobile platforms:

Device Resolution Screen Size
(diagonal in.)
iPhone 4 / 4S 640 x 960 3.5
iPhone 5 1136 X 640 4
iPad 3+ 1536 X 2048 9.7
iPad Mini 1024 x 780 7.9
Kindle Fire 1024 X 600 7
Droid X 480 x 854 4.3
Samsung
Galaxy Tab 10.1
1280 X 800 10.1"

Such a significant variance between device capabilities and, in particular, the very small screens of mobile phones necessitate that you implement new user interface paradigms. One challenge, for instance, is that the iPhone Human Interface Guidelines from Apple recommend that all of your on-screen buttons should be a minimum of 44 pixels in height. This occupies nearly 5% of the screen on an iPhone 4-series! Based on that recommendation, using desktop development paradigms (which tend to be very button and menu-centric), you would ultimately produce an application that reserved a very small portion of real-estate to display the information that you wish to convey.

Page of 168
comments powered by Disqus