DevTopics » User Interface

Visual Studio 2010 Concept IDE

timm — Fri, 27 Feb 2009 15:59:25 +0000

Tom Ollar and Jim Bennett have developed a very interesting prototype for a next-generation version of the Visual Studio 2010 IDE. They present 20 new concepts ranging from the inherently useful (visual stack) to the somewhat silly (remoting eye, an eyeball that indicates your programming partner is connected to the session).

One interesting concept is the “mini,” shown in the photo at left. Before you say “not another diagramming standard!” note that the “mini” DebugDiagrammer is pluggable and can be replaced with UML or your own custom diagrammer. The intent is to visualize objects, not classes. The “mini” acts as a thumbnail showing the working internals of an object.

I’m a sucker for next-generation user interfaces. I love watching movies like Johnny Mnemonic and Minority Report to ogle their futuristic UIs. But I believe that future interfaces will be more simple and less cluttered, similar to what we’re seeing emerge on the iPhone. The days of “command smorgasbords” — layers upon layers of menus, toolbars and panels — will eventually give way to simple, malleable interfaces that provide just the information and controls you need at any one time to perform your task.

Read the Code Project article and download a prototype

UI Displacement

timm — Mon, 14 Apr 2008 14:39:49 +0000

Displacement in a user interface (UI) is when you are working with data in one place, and the software forces you to go to a completely different place to add or edit the data. UI displacement results in interrupted work flow, wasted time, user confusion and frustration.

UI displacement is becoming less common as PC software matures. Unfortunately, as I discussed in my article “PC’s and the Disabled: 20 Molehills that Become Mountains“, many of the UI advancements made by software over the past 20 years have been thrown out the window with Web 2.0 applications.

Good UI: No Displacement

A simple example of a good UI that avoids displacement is Windows Live Writer, a free blog editor from Microsoft. As you may know, you can assign a blog article to one or more categories. In Live Writer, you can select the categories from a pop-up list. But what if you want to add a new category? With Live Writer, you simply add the new category right there in the list, instead of having to go to your blog’s administration panel.

Bad UI: Displacement

A good example of bad UI displacement is Google AdSense and its new “ad units.” Previously, you would specify the colors of a Google ad right in the javascript code you included on your blog or website. But now you specify colors in an “ad unit” in the Google administration panel. To change a Google ad color used to take seconds, but now it’s a multi-step process that takes 10 minutes or more if you don’t have high speed Internet. Here’s the scenario:

1. I’m working in my blog administration panel and decide to change the background color. Naturally I want to change the background color of my Google ads as well.

2. Instead of changing the ad color right there where I’m working, I have to open a new browser tab and login to my Google AdSense account.

3. Navigate to ad setup.

4. Display the list of ad units.

5. Find and select the ad unit to edit.

6. Modify the color and submit.

7. Now here’s the kicker: I have to wait 10 minutes for the changes to appear.

With my satellite Internet, this whole process takes about 13 minutes. And what if I want to try many different colors and see how they look? This could result in an hour or more of wasted time.

Google’s new ad units are a good idea in theory: having all your advertising administration and setup in one place. But in practice, the resulting UI displacement is a time waster. The Google AdSense UI is pretty good generally, but sometimes software takes one step forward and two steps back.

PC’s and the Disabled: 20 Molehills that Become Mountains

timm — Tue, 27 Nov 2007 14:52:53 +0000

For the disabled PC user, every mouse click and keystroke can be a major effort or literal pain. So disabled users will often go to great lengths to automate repetitive tasks and minimize the steps required to perform each task. This includes the use of macros, voice recognition, mouse and keyboard utilities, and special hardware such as head-controlled mice and programmable button boards.

But in spite of these efforts, disabled PC users are often confounded by all-too-common problems found in today’s Windows and Web applications.

Following are 20 problems with PC software that may be minor nits for many users but can be a huge problem for the disabled. These are presented in no particular order, as each problem’s severity depends on the situation and individual.

No Focus
The window opens and there is nowhere to type. I have to position the mouse and click the tiny textbox just to start typing.
Stolen Focus
I’m typing away blissfully, and from the corner of my eye I see a window come and go, stealing my last few keystrokes. Even worse is when I’m not sure which window popped up and what did I just tell it to do?
Lost Focus
I delete an item from a long list, the list refreshes, and focus jumps back to the beginning. So I have to scroll through the long list to find my place again.
Amnesia
Memory is a skill where computers far surpass humans, so software really should remember my previous choices.
No Undo/Redo
Wouldn’t life be awesome with an Undo button? Sadly that’s not possible, but it is possible with software, so multi-step Undo/Redo should be in every application.
No Cut/Copy/Paste
If I can click it, I should be able to cut, copy and paste it.
cAPS lOCK cRAZINESS
jUST WONDERING… bUT CAN’T MY pc FIGURE OUT THIS IS WRONG?
No Keyboard Shortcuts
Automation tools and input devices typically operate via keyboard shortcuts, so applications should provide keyboard shortcuts for every command.
Fixed Keyboard Shortcuts
My programmable keyboard thinks “Find” is Ctrl+F. So if an application doesn’t agree, it should allow me to change the keyboard shortcut to match my setup.
Fixed Toolbars and Menus
While we’re on the subject of customization, toolbars and menus should be fully configurable as well.
Do Not Enter
It’s easier to press the Enter key than to precisely position the mouse over a tiny “Submit” button.
Tiny Buttons
Because precise mouse control is a challenge for disabled users, tiny buttons can be quite frustrating to click.
Tiny Fonts
Many PC users have vision challenges, so adjustable font sizes are best.
No Multiple Selection
Few things on the PC are more annoying than having to manage a large collection of items one at a time.
Big Lists in Little Windows
A new trend for web applications is to open a long list of items in a tiny window. As a result, I’ve become quite intimate with the Page Up/Down keys.
Window Clutter
Having multiple floating, sizable windows overlapping each other on a crowded desktop might seem like the ultimate in multi-tasking, but it’s a mouse control nightmare for the disabled.
Command Smorgasbord
Modern applications provide a smorgasbord of buttons, menus and windows. But usually at any one time I need only a handful of easily-accessible commands.
Are You Sure? Are You Sure? Are You Sure? Are You Sure?
Vista UAC proves there can be too much of a good thing, such as confirmation dialogs. Just ask me once.
Not Eating Their Own Dog Food
Occasionally an application’s interface can be so convoluted that you know the company doesn’t actually use its own software.
Bugs
Bugs waste time, generate rework, and can be a real pain for all users.

As Windows applications continue to improve, these problems become less pervasive. But the new generation of Web applications seems to have forgotten these important user interface lessons, and unfortunately software usability for the disabled has taken a step backward with Web 2.0.