The other night, I was using the Netflix app on my iPhone 4 and had a shocking revelation: this is one of the worst designed, “professional” apps I’ve ever seen. Yes, I can stream video over 3G. I can search for movies and manage my queue. In most areas of functionality, Netflix for iPhone delivers. It is relatively new and I’m sure a work in progress but as of the current version, it is a prime example of what not to do in terms of iOS app design. Here are some reasons why.
1) Reinventing the Wheel
The iOS SDK contains an expansive library of UI elements. I imagine that in some rare cases, it might be required to write your own UI object from scratch, but the vast majority of times that button, dialog, slider, or table can be created simply by using stock objects and customizing their appearance, and/or sub-classing them for augmented functionality.
In our example of the Netflix app, the “Home” tab is populated by a table of Top Picks and titles similar to ones you’ve recently watched. You can tap on a movie to take you to a detailed description. It’s a design paradigm that is used in literally thousands of iOS apps.
The obvious design choice here (and the one recommended by Apple docs) would have been to use the highly-customizable UITableView within a UINavigationController. However, for reasons beyond me, Netflix appears to have created their own table and navigation entirely. The latter is clear from the clunky animation that occurs when opening the detail view; the former by the off-behavior of section headers (they continue to scroll up with the rest of the table, rather than hanging at the top of the screen until the next header comes up). The point is really driven home when you observe the pixelated navigation graphics on a Retina-display (such as the “back” buttons or the detail disclosure indicators on table cells) which would have otherwise been Retina-display ready. The confusing thing is that these UI examples were all modeled to look and act just like the stock ones but instead feel clunky and amateur.
2) Using Low-Res Graphics
With the iPhone 4 and the new iPod Touch rocking beautiful Retina-displays, it’s more important than ever to use high-resolution graphics in your apps. In some cases, it might require a total re-creation of a graphic, but if your designer was careful at all, it would simply be a matter of exporting a double-resolution file.
With the Netflix app, the majority of UI graphics and movie thumbnails are very pixelated. In a lot of these cases, this could have been avoided simply by using stock UI-elements (which their customized ones were mimicking anyway). The movie thumbnails are simply a matter of grabbing higher-resolution graphics from their server- I know they exist, they are used on the desktop site. Also, while the logo on the loading screen is crystal clear, the smaller logo on the top navigation bar is blocky- why wouldn’t you just use the same graphic for both? The lack of attention to detail is astounding.
3) Over/Under Animating
Over animating can be a resource-hog and can slow down your user’s ability to navigate your app. However, some animations are necessary to deliver subtle visual cues to the user.
In the Netflix app, some buttons animate when you press them, some don’t. It’s odd and confusing, especially considering the default behavior of buttons is to darken when being pressed. The same is true for table cells- sometimes they appear “selected,” sometimes they don’t. On a small screen, these small visual nods are necessary to confirm the user’s selection was accurate.
4) Not Expecting Multi-Tasking
We knew multi-tasking was coming. Now it’s been here a while. Your app should know what to do. In most cases, you don’t actually have to change anything, but it’s still important to test your app’s behavior.
Actually in this case, it appears Netflix took steps to accommodate multi-tasking. However, they once again took an odd and annoying design choice. Every time you drop out or return to the app, you see a (full screen) loading splash. Why did they deem this necessary? The OS is already caching the app’s state, and the speed at which it loads would lead me to believe it is not actually doing anything other than reminding you what app you’re using. It’s another small piece of the puzzle that makes the Netflix app a perfectly functioning example of bad design.
In Conclusion
Don’t get me wrong- I love Netflix. I use it almost every day. But as a large company at the forefront of technology the poor design of their mobile app is pretty shocking. I might have guessed that the UI inconsistencies could be attributed to possibly having used a third-party development tool in order to release their app across several mobile platforms at once. However with the Windows Phone 7 having been just released this month and the Android app still notably MIA, I’m not exactly sure what happened. All I know is that app designers: you’re better than this.
Follow Mike Keller and GeekTech on Twitter.