Scott’s post pointed out that people just don’t like to scroll horizontally. What are you? A bunch of pansies? Is it too difficult for your delicate hands? Up and down’s ok, but left and right… Wooh! Hold the boat!

Seriously though… I propose that people simply don’t want to scroll at all. It’s just that we’ve been forcibly accustomed to vertical scrolling for so long now that we don’t even notice it nor even think of it as a bad thing anymore. There’s just too much content to present. It has to all go somewhere. If we all had 60″x60″ monitors (and if the Internet loaded virtually instantaneously so that there’s no lag) then we could avoid scrolling all together. Now that would be heaven.

We’re an “at a glance” type of beast. We want all our content available at a glance. We want to be easily able to see all the important things at a glance. The more you have to scroll to see content, the less “at a glance”-ness your presentation has.

Think about it. We don’t particularly mind vertical scrolling nowadays (as long as it’s not too long). We all agree that it sucks when we have to scroll both vertically and horizontally. But if we also had to scroll on some z-axis… well, that would just be horrible, wouldn’t it?

It would be that much more scrolling to see all the content. And that’s what we’re to trying to minimize: the amount of scrolling. Therefore less scrolling = more betterness.

In lots of applications I use and write, left-aligned labels are used:

In principle this violates the Law of Promoxity since the labels are aligned with the left edge of each other instead of being aligned with the control they reference. This isn’t too bad unless the labels are pretty far from the control.

I can actually feel my eyes trying to keep steady as they scan across the page trying to keep a level visual line to identify the control that the label is associated with. Of course for an easy fix, you can just move the labels in closer to the controls. But what if you have a label that is noticeably longer than the others? That doesn’t seem to work very well:

So unless you have label length problems (as shown above), aligning the labels with the controls seems to make the most sense both logically and aesthetically. Sometimes it’s a little too late to change though.

…But what do you think?

When is it too late to change? When do you go back and change the design so that it’s more correct and more efficient rather than just leaving the code as it is in its working state? When do you go back and change all the controls so that they’re consistent rather than just leaving them as they are? When do you go back and fix the spaghetti code and when do you just let things continue to work?

I like things to be consistent throughout all my code and all my screens. I don’t like duplicated code. Sometimes at work I take things a bit too far and I go through all the code and change these things even though it may not be the most important thing at the moment.

Although there’s definitely a fine line on when you should do this. It’s a balancing act between what you get back and the time it takes to make the change. ROI, baby. Usually if I can make the change in about a day, it’s something that will help the overall design and if there’s low risk that my change will cause any bugs or failures then I’ll just make the change and be done with it.

But if the change isn’t particularly that important, then however much I feel the need to make the dialogs more consistent or to make all the classes use the same set of functionality then I try to restrain myself.

…So when do you make the change and when do you just let things be?

The Gestalt laws are pretty common vernacular in UI design. I thought I would review them a little for future reference. So here’s a handful of the more common ones:

• Law of Pragnanz — Reality is organized or reduced to the simplest form possible.

  

• Law of Closure — Objects grouped together are seen as a whole.

  

• Law of Similarity — Items that are similar tend to be grouped together.

  

• Law of Proximity — Objects near each other tend to be grouped together.

  

• Law of Continuity — Lines are seen as following the smoothest path.

  

And here’s other good links on the subject.

When you have an option to present to the user that has more than two choices, how do you do it?

Do you use horizontally aligned radio buttons:

…or do you use vertically aligned radio buttons:

…or do you use a combo box:

I’m starting to think that combo boxes should always be used. There are easy to add more choices to later on; They save space on a potentially tight dialog; And IMHO there are just cleaner looking than the alternative of cramming all these radio buttons onto one dialog. Plus if you need to change content on the dialog below the choice in question, they keep all the content in close proximity and form a nice logical grouping:

So… how do you decide whether to use radio buttons or combo boxes?