Microsoft & .NET.NETEverything You Know About UI Design Is Wrong

Everything You Know About UI Design Is Wrong content and product recommendations are editorially independent. We may make money when you click on links to our partners. Learn More.

Well, maybe not everything. But if you’ve spent the past decade (roughly, the time since the release of Windows 95) honing your Windows user interface design skills, it’s time for you to pay attention. With the release of Windows Vista next year, Microsoft is changing an awful lot of the rules again. This is not just another minor user interface change like the upgrade from Windows 98 to Windows XP. It’s more along the lines of the massive overhaul we all saw going from Windows 3.1 to Windows 95. If you’re shipping applications for the Windows desktop, it’s definitely time to sit up and pay attention again – or risk being one of those people putting out software that looks clunky and dated before its time.

The New Guidelines

Fortunately, Microsoft isn’t making you figure out the new rules by installing the betas and running things (although that’s a good idea too). Rather, if you’re a developer with an interest in building things for Vista you should hop on over to your Internet connection and download the Windows Vista User Experience Guidelines, known as the “UX Guide” for short. Execute the downloaded file and you’ll get a Web-based look at what’s coming in Vista and what you should do about it (start your browsing at index.htm, a fact that the Microsoft download instructions neglect to include). As of mid-October the download is version 0.8 of the UX Guide, which means that there are various loose ends and pages that say simply “This content hasn’t been written yet” (which leads one to wonder how Microsoft designed their own Vista applications, but let it pass for now). Still, there’s plenty of content to get you started in the right direction.

Looks Count

If you go back far enough, think about the transition from Windows 3.1 to Windows 95. Remember how some applications just didn’t get it, and looked like, well, Windows 3.1 applications running on Windows 95 instead of native Windows 95 applications? We’re going to be seeing that same problem again next year. Applications written for a Windows XP world will run just fine on Windows Vista, and they’re going to look subtly (or not-so-subtly) wrong. If you want to be one of the cool kids (and more importantly, if you want to maximize your application’s sales), don’t ship one of those applications. Set the time and energy aside to do it right. At a minimum, I’d allow a couple of months for a UI migration and tune-up on a medium-sized desktop application; more for a large or complex one. Here are some of the factors you need to consider to play nice in the Vista universe:

  • If you’re not using the Themes API yet, it’s time to start. There are a lot of niggling little bits of getting your application to use the default “Aero” theme and you’ll go crazy trying to figure all of them out for yourself. Let the system do it for you.
  • In fact, let the system do everything it can. You’ve been hearing for years that you should use system fonts, colors, and sizes for things, and now it’s definitely time to listen. Otherwise your application is going to stand out like a lump of coal in a field of clover.
  • Use the new version of the Windows Common Controls. Everything from buttons to listviews has a new look in Vista, and you want to make sure you’re getting that new look.
  • Get a pro to design your icons. Yeah, I did my own icons in the past too. Now the system wants icons up to 256×256 and they’re supposed to look “better than photorealistic.” This is a job for an artist, not a developer who happens to have a copy of Paint open. If you just let the system blow up your 32×32 icon, people will laugh at you behind your back.
  • I hate to say this because there are going to be some truly hideous user interfaces deployed next year, but take a look at your application to figure out where you can use the translucent “glass” look and where you might be able to make effective use of some 3D elements. Yes, to be honest there are many applications that don’t need either one of these things. But they’re going to be necessary if you want to look modern.
  • If your application uses a menus-and-toolbars user interface now, consider emulating the Office 12 “ribbon” user interface. While Microsoft probably won’t release the tools to build this user interface any time soon, most UI component vendors will have their own version out shortly after Office 12 ships. Imitating Microsoft is always a good way to look current on the Windows platform.

And while you’re thinking about hiring professionals: if you’re working in the .NET universe and considering using Windows Presentation Foundation (the API formerly known as “Avalon”) for your user interface, it might make sense to farm the entire UI out to a graphics designer. WPF lets you completely break the mold and create innovative applications that model real-world objects, carry a consistent custom brand throughout, or have their own custom behaviors. It also makes it easier than ever to create unusable and unattractive disasters. It looks like WPF design is going to be best carried out with a graphics tool such as Microsoft Expression “Sparkle Interactive Designer”. That’s a tool that you should have an artist drive, not a developer pretending to be an artist on their lunch break. When they’re done they can hand over the XAML code to you to program against.

Actions Count

Your application needs to have more than just a pretty face to succeed in the Vista environment. How it behaves is also important. Microsoft is making a bunch of changes to the way their own pieces of the operating system act, and you’ll want to make sure that your own application fits right in. Here are some of the key areas to take a good hard look at:

  • For dialog boxes, switch from the MessageBox API to the new Task Dialog API. Task dialogs let you set your own text for commands instead of being stuck with inflexible command button choices, have an expandable content area that lets you easily build in explanations without cluttering up the main dialog box, and automatically support a “don’t show this again” option.
  • If there’s anything searchable in your application, stick a search box in the upper-right corner. Microsoft is making search boxes ubiquitous in the interface, and users are going to expect them everywhere. Soon enough an application without a search box will look as naked as an application without a close button.
  • If you use wizards, you’ll probably need to rewrite them to make them look like Vista wizards. The changes here are not limited to visual styling. Welcome and confirmation pages have been given the ax, so users shouldn’t have to click through any wizard pages that don’t really do anything. On the other hand, if there are other actions that logically follow your wizard, add a follow-up page with hyperlinks to appropriate spots in the application.
  • If your application has useful but not critical things to tell the user, use the notification API (aka “toast”). Microsoft is emphasizing toast for this sort of information, so it’s going to be popping up all over. You might as well be popping up there too.

Above all, Microsoft says, “the ideal Windows Vista application is both powerful and simple.” It remains to be seen how well they’re going to follow their own advice, but right now the UX Guide urges designing applications that do one thing, do it well, and make it easy for the users to do it. If you’ve created a big sprawling multiple-use Windows XP application, it might be more appropriately refactored as a suite of smaller Vista applications.

Language Counts

Finally, and perhaps most difficultly for many application developers to grasp, Vista introduces a new “tone” to use when writing user interface text and messages. The Guide says that the tone creates the personality of the program and evokes emotions in the user. Whether you believe that or not, if your application doesn’t talk the same way the rest of Vista does, it’s going to stand out. Things to consider in this area include:

  • Make all user interface clear, using natural language. Avoid computer jargon.
  • Be encouraging and empowering (use “you can” instead of “The application lets you”).
  • Use real-world language, with short, precise words and active voice phrasing.
  • Don’t convert nouns to verbs or verbs to nouns.
  • Use short sentences. Make every word count.
  • Don’t blame the user. “Access denied” is a hostile message; “you need a higher level of permissions” is a friendlier way to say the same thing.
  • Address the user as “you,” not as “the user.”

The Windows Vista tone is a balancing act. You don’t want your application to sound like it’s a talking computer with an impersonal voice completely removed from any human language. At the same time, you don’t want it to sound like an overly-chipper sales rep anxious to be the user’s best friend for an hour. As with visual design, this is an area where many developers will benefit from some professional help: when you’ve got language to polish, it may be worth spending some money on a pass by a professional editor.

It’s Later Than You Think

We’ve been awaiting the release of Vista (mostly under its “Longhorn” code name) for years now. That long wait has lulled many developers into a sense of having all the time in the world to get their applications ready for the new platform. Well, it’s time to wake up and start gulping the coffee. After years of delay, it looks like Microsoft is pretty well on track to release this beast within the next year. There are plenty of test versions floating around, and the APIs are largely settled down. Visual Studio 2005, which will make an ideal platform for working on Vista, is on the verge of release itself. If you’re an application developer who intends to be a part of the Vista world, it’s definitely time to have a plan – and probably time to start slinging code. Just do your research first, or you may end up shipping something that no one wants to buy.

About the Author

Mike Gunderloy is the author of over 20 books and numerous articles on development topics, and the lead developer for Larkware. Check out his latest books, Coder to Developer and Developer to Designer, both from Sybex. When he’s not writing code, Mike putters in the garden on his farm in eastern Washington state.

Get the Free Newsletter!

Subscribe to Developer Insider for top news, trends & analysis

Latest Posts

Related Stories