a blog about geek stuff

Windows Phone 7 App User Experience Checklist

Here’s a list of things (non-exhaustive) to check when you are doing your wp7 apps (Also serve as a reminder for myself for future apps). I will also talk about if you are using phonegap for wp7 app development, what are some of the things to look out for.

Element Alignment and Spacing
General Principles of alignment applies. For the case of double columns, both column should be properly aligned both on the horizontally and vertically (the gap between rows of elements should be equal)

Control Feedback on Tap
Controls should use the Windows Phone tilt effect. No background, foreground, or border color changes are permitted.
Note: If you are using a 3rd party framework to help you build wp7 apps e.g. Phonegap, there might be a problem with this point since you can’t really do tilt effect using Javascript (at least not that I know of) but from my experience, they probably wont enforce this very harshly. That said, wp7 apps built using silverlight instead of phonegap definitely have better user experience.

List adorners (or Tableview Accessory if you are more familiar iOS terms)
There should be no list adorners. I think microsoft wants to make it such that it looked different from iOS.

Pivot/Panorama Control

There should be at least 2 pages in them for pivot and maximum of 5 panes for panorama.
If there is more than 5 panes for panorama the performance will be significantly affected. E.g. when you transit from a detail page back to the main panorama page, you will notice that it take a while to render the screen.

Toggle switches, Sliders, Map controls (unless they are static i.e. pinch/zoom/pan are disabled etc), Browser controls (again unless they are static) are not permitted in pivots/panorama

Master-detail view
The pivot control should never be used as a master-detail, filter-results view or as steps in a wizard. Changing controls/performing actions on a pivot page should not affect the other pages in the pivot.

Application bar
Common actions such as refresh, search, and settings should be placed in an application bar. Floating button on the panorama should be avoided.

Scrollable Panes
Panorama panes should either scroll vertically or horizontally. Not both.

Gesture Competition
Controls that provide a horizontally scrollable area or take a horizontal swipe gesture are not permitted in the pivot/panorama control as the horizontal swipe gesture is reserved for changing pivot pages/Panorama

Buttons
As far as possible, buttons should be placed in the application bar. A good gauge when to do this is to see other wp7 apps to decide when it should be placed in the application bar, when it should be just a button on a canvas.

Close and Back buttons
Windows Phone app should not have close buttons (I think you can’t programmatically close the app also, unless it crashed).
Similar to the Android case, there shouldn’t be a Back button should on the screen.
If you are using phonegap + jquery mobile or if you are a season iPhone developer, this is something to take note!

Start Tiles
Start tiles should not have rounded corners or 3d look.

Color theme
Since windows phone support both dark and light theme. You have to make sure that the app works well with both themes. Take special note to cases where you “hardcode” the color of text but keep the background as the default. It is very likely that if you set the color of text to be white, you can’t see it on light theme.

Does the app work on Airplane mode?
The app should not crash when no internet connectivity is available.

Test app using Visual Studio’s Marketplace Test Kit!
Under the menubar, Project -> Open Marketplace Test Kit and follow through the instructions