The bad news is this device diversity also means a large number of screen sizes, densities and resolutions, which vendors often play with to try to differentiate their products. Developers have to make sure their app’s UI provides a good experience across all of these devices — or at least as many as possible. Just how big a challenge is that? Opinions vary among experienced developers.
“The biggest problem we’ve had with Android is the various different screen sizes and being able to scale our UI to those different screen sizes,” says Geoff Pado, lead developer at Newsy, whose apps provide news videos. “It’s one of the things that take up a lot of time when we’re building apps.”
Other developers say that planning ahead minimizes the amount of time and effort required. “It’s not hard to be resolution-agnostic if you plan for it ahead of time, especially because Google provides all kinds of interface tools for building UIs that can scale and stretch and change based on the current display,” says Chris Pruett, chief taskmaster at Robot Invader, which specializes in games. “The only time it becomes difficult is when you try to port an application that was written to target just one screen size and relies on hard-coded absolute pixel offsets and regions.
“Such applications are usually full of assumptions that were made about its original platform (such as ‘How many pixels tall is the screen?’) which are no longer true,” says Pruett. “Replacing all of those hard-coded bits with proper rules to scale or stretch UIs after the fact is a lot of work. A lot of complaints about Android screen size diversity boil down to ‘I didn’t consider this when I originally wrote this code.’”
Pay Attention to Densities and Documentation
The first step in ensuring a consistently great UI is to take advantage of Google’s documentation.
“The bible is here: http://developer.android.com/guide/practices/screens_support.html,” says Vincent Chavy, director of product management for mobile and desktop solutions at RADVISION, whose apps enable video conferencing. “This is a must-read for any Android developer willing to ensure an app will be great on any screen.”
As the Android OS has evolved, it’s gradually added features and documentation that help developers accommodate device diversity. “Android 3.0 introduced new elements called fragments,” says Volodymyr Kasyanenko, RADVISION’s lead architect for mobile and desktop solutions. “This guide provides an overview. Android introduced fragments in Android 3.0 (API level 11), primarily to support more dynamic and flexible UI designs on large screens, such as tablets.”
Google’s documentation and tools can be particularly helpful for developers who are just starting out and are not yet comfortable with the idea of figuring out their own techniques and tricks. Experience aside, the role of Google’s documentation and tools also varies by the type of application.
“Since we are making games, we do not rely as heavily on Google’s UI tools as other sorts of applications do, because we render everything — including our UI — with our game engine,” says Pruett. “However, nongame applications should totally leverage Google’s tools to make size-independent UI.
“There’s tons of functionality already built into the OS to deal with this, and while we choose to roll our own solutions sometimes, it’s so that our codebase remains as platform-agnostic as possible,” says Pruett. “Just utilizing what’s already provided by the platform is the right way to solve this problem for most developers.”
It’s also important to understand the major ways that displays differ, including the pixel density and resolution.
“To deal with screen density, ensure that all the GUI elements will take the same space regardless of the density of the screen,” says Chavy. “If you do not ensure this, then your app will have different layouts depending on the density of the screen, and you do not want this!”
The next step is to decide whether to optimize the app for devices with high-density screens. For example, for its SCOPIA Mobile app, RADVISION has separate sets of bitmaps for medium- and high-density screens.
“If you do provide the same bitmap for any screen density, it will work, but Android will scale the bitmap to fit, and this will most likely result in a blurry or pixelated result,” says Chavy. “The same applies with iOS, where it’s better to provide one set of graphics for the regular devices and another, higher-definition set of images for iOS devices supporting Retina displays.”
Understand the App’s and Device’s Use Case
Many vendors are pricing their Android tablets so they’re affordable for as many people as possible. If that strategy pays off, it will mean a large pool of Android tablets for developers to target.
But that doesn’t mean all developers need to start thinking about how to make their apps look equally good on tablets and smartphones. Just the opposite: Some developers can afford to ignore tablets if their target audience is unlikely to use those devices for their apps. A prime example is fitness, where toting a tablet isn’t practical.
“Our application is not suited for tablets, so we only care about the phone resolutions,” says Morten Keldebaek, head of mobile applications at Endomondo, which combines exercise with social networking.
An app’s use case can also affect how people hold their device and, as a result, what developers need to focus on UI-wise. “We force portrait mode on most screens, so we do not really care about landscape,” says Keldebaek. “We do it so that we give priority to making the application look as good as possible on the most-used screen sizes, and then we let Android scale to anything else. We have the 480 by 800 and the 320 by 480 resolutions as top priority, and then we ensure that the new 720 by 1280 looks good as well. Then, we ensure that QVGA ‘works,’ but it is really difficult to make it look nice.”
Test and Test Again
Regardless of whether the target devices are tablets, smartphones or both, testing is critical for ensuring that UI provides a consistently great experience. “The best way to handle scaling issues is to continue to test for all of these different platforms,” says Pado. “Between knowing Google’s best practices and then testing, testing, testing, that’s really all we can do about the fragmentation.”
Professional developers often have the advantage of a large staff and thus more people to test an app. Newsy, for example, has a staff of about 65 full- and part-timers. Smaller developers can use friends and family as testers, but they also shouldn’t overlook their app’s users as a way to identify UI fragmentation problems — or other types of issues, for that matter. Checking reviews in the Google Play Store (formerly Android Market) and third-party stores such as Amazon’s App Store are obvious places to start. Also consider creating a Google Alert for the app’s name and terms such as “screen.”
Finally, make it easy for users to provide feedback directly, such as via an email address that’s prominent in the app and on the website that the stores link to. After all, the worst time to find out about UI problems is when an app’s reputation has already been damaged.