To me, a lot of this UI complexity stems directly from a lack of separation between the UI and business logic layers.

Proper separation

As developers, we’re accustomed to the best practices of modularity and separating the implementation from the interface. This has lead to such patterns as MVC and Interface Oriented Design. However, when it comes to designing the UI layer, these rules sometimes aren’t followed. This is why we end up with overly complex “Search” pages, offering every option under the Sun, and configuration dialogs/screens with a one-to-one relationship to settings files or some other underlying implementation detail under the guise of “letting the user decide what they want”.

Without clear UI planning, this one-to-one relationship tends to rear its ugly head more often. Take our first example of a “Search” page. In most applications, the search functionality is interacting with some sort of a database backend, most likely a SQL RDBMS. The lazy approach is to design the search form based on the format of the SQL query itself. This is how we get search forms with multiple fields, drop-down boxes and so forth – because this format translates almost directly into a SQL query; i.e. of the form WHERE col1 LIKE... AND col2 LIKE...

Just because this is easier for the developer, doesn’t mean it’s the best solution for the end user. In fact, it’s often the case that this is the exact opposite.

Thinking like a user

In general, users don’t care about the implementation of your application or how it stores data. They shouldn’t have to know about the columns of the table where the data is stored, so why make a search form that exposes this? Instead, you need to understand what your users want and how they’re most likely to use your application. This isn’t an easy task, as many have pointed out.

This is where I think most UI problems come from – a misunderstanding of what users want. This isn’t to say that these developers are dumb or careless; but just that when it comes to empathizing with their users, they often are unable to because they know their own software and have such an intimate view of it from a coder’s perspective.

Take the example of QTTabBar, a Windows Explorer extension written in .NET that adds many useful features such as tabs, etc. to the interface. It is an excellent extension and does things very well, but the options page is a complete nightmare.

There are just too many options on this one page; what do they all mean? Furthermore, there are nine more tabs, each with roughly the same number of additional options! This is far too complicated, and I’m guessing most people will never have a use for all of these options.

Of course, it’s completely unfair of me to pick on QTTabBar in this manner, considering it’s written by one guy who has chosen to give it away for free. And, as I mentioned before, it’s a very useful utility that I can wholeheartedly recommend.

A simple story

Take a simply example, where we want to search a set of items, each of which have four separate properties – name, description, URL and tags. The items are displayed on screen with all of the four properties shown. The naive way would be to provide a search form that had fields for each property and allow users to search that way.

But with this simple (albeit contrived) example, there is an obviously simpler solution. Since all of the four pieces of information about an item are shown onscreen, it would be much better just to provide a single search field whose input would be used to search all four properties, returning all items that had a match in any of the properties. From a user’s point of view, this makes sense, since they are searching through what they know they can see and interact with.

If an advanced search was needed, it could be added later, but I would only do this if I knew it was absolutely needed by users, since the simple case is likely good for >90% of your users.

There’s an interesting article out that points to the fact that every day there are 10,000 canceled installations for Firefox; this meaning that each day 10,000 people download the Firefox installer, “fire up” the *.exe and then click “Cancel”. (A further 40,000 apparently downloaded the setup file, but didn’t even make it far enough to start and then subsequently cancel the installation)

Even more interesting were the reasons why the 10,000 canceled their install. A large part of the respondents were “confused” with some part of the install process (nearly half) while most of the other half identified that they did not have the proper permissions to complete the install.

Not simple enough?

The results seem to indicate that the installation process is not as easy as it could be. However, it’s dismiss the results by saying that Firefox is already easy enough to install, because after all, how hard can it be to just click “Next” a few times? But this ignores the central problem, that is, assuming everyone is technically proficient enough to find such things routine.

For example, to a mechanic an oil change would likely be an easy five-minute operation. For someone like me, who’s rarely popped open the hood of a car, much less done anything underneath it, such a task would likely entail reading a manual (or just Googling for the answer), then carefully following the steps one-by-one; I’d be lucky to get the whole thing done within 30 minutes.

The same can be said for software installation. Something that seems routine for most developers or power users may only seem routine because we’ve dealt with it countless times, or because we’ve dealt with more daunting situations that required manual workarounds and hacks in order to get things working. One person’s routine can be another person’s out-of-this-world experience.

The value of feedback

This is why Mozilla is actively taking steps to improve the process by collecting feedback from users who canceled the installation.

Users who canceled could optionally provide the reason why they canceled, how the installation made them “feel” as well as any suggestions or comments they had. This formed the basis for the feedback results Mozilla compiled:

The fact that a significant percentage of the respondents were “confused” shows that they are some issues that the installer could make easier. The vast majority of this confusion stemmed from the fact that installer could not close an existing/running Firefox process, a step required for the installation/upgrade to proceed. This is a legitimate technical issue that can hopefully be solved.

Installation rights

The other significant factor, based on user feedback, was the lack of permissions required to install Firefox. Normally, Firefox requires administrative privileges on the machine in order to install it. This wasn’t a problem during the days of Windows XP, when users by default had these rights, but with the advent of Windows Vista this is no longer the case. Instead, users will typically be hit with a UAC prompt when trying to install software, which may deter them from completing the installation if they are unsure or unaware of what it means, something that is exacerbated by a user’s inexperience.

This article by TG Daily shows how some other browsers have simplified the installation process. Apple has started to bundle Safari as an “update” in an aggressive attempt to gain market share, while Google’s Chrome uses a lightweight online installer to speed up the installation process.

Easy or flexible?

Chrome’s installation approach is particularly remarkable in how it works. It requires less user intervention and furthermore, installs itself in the current user’s Application Data folder, which does not trigger a UAC prompt. (This also means that it must be installed for each user on a system, rather than being installed on a system-wide basis) Google also installs its updater, which runs in the background to keep any Google software up to date on the target system. Such a system is highly convenient for non-technical users, who don’t want to be bothered with manually keeping things up to date, but has drawn complaints from those more technically-oriented.

This highlights the differences a developer faces when creating an installation procedure. Typically, developers will lean towards providing the end user with as many options as possible because it’s the easiest way to solve a design decision. Can’t decide between X and Y? Let the user choose! This also goes along with the philosophy of power users, (a group that developers are pretty much a subset of), who like to know exactly what’s being installed on their system and what’s being done to it.

This contrasts with the needs of the typical user, who just wants the software to install as seamlessly as possible. I’ll have to admit, the Chrome installation procedure irked me a little, as I was more comfortable with the “normal” Firefox installation procedure, which gave you the option of where you wanted to install the software, etc. But ultimately, the Chrome installation process likely worked for 95+% of the users, so in the end that way wins out.

Lowering the barrier

Much can be learned from these results if you’re trying to get users to sign up for a service. In many ways, the process for signing up a user is like the process of getting the user to install software. Both require the user to entrust their resources to your service, and both require them to go through a series of steps. If the user really wants your service, they’re likely to put up with more of a hassle, but in general your aim is just to get them to try out what you’re offering, so you have to make things as simple as possible.

This is what I’ve tried (not sure if I’ve accomplished) with the RunTrackr registration process. Obviously, there are changes/improvements to be made. If the service were to get more popular, I’d have to implement more anti-spam/anti-bot measures, some of which might impede usability. But in general, I like the one-step registration process.

One of the things I decided from the get-go was to allow users to create routes without registering; this lowers the barrier required for them to create content and allows them to try out the service before committing to registration. However this has resulted in a lot of “unowned” routes created as an initial use. Following this, even if the user registers, they are unable to “claim ownership” of the route. One improvement I’d like to make is to tie in a “quick registration” option after the unregistered user has created their first route, allowing them to register and claim ownership of that route. I haven’t figured out the best way to do this, though.

However, I’ve been looking at Kijiji as an example of how this might be done. Kijiji is a localized online classified ads site, owned by eBay, and it allows users to post wanted/for-sale ads without registration. (The user must enter an email address to provide confirmation, as an anti-spam measure) However, after posting an ad, Kijiji makes it easy for that user to quickly register in one step and claim ownership of the ad they’ve just created. I suppose this is easy, since they already have the user’s e-mail address, but I would still like to implement something similar to improve the user experience.

When developing any application, getting proper user feedback during the early stages is essential if you want to have the application suit your customers’ needs. Often this is done with staged tests, but with web applications you can have the benefit of using an online method of retrieving your users’ opinions.

However, doing so can be tricky. If you want to get feedback, you can implement your own system for soliciting it, however, this takes up extra time that could be used to further develop your core web application. Alternatively, there are some existing online services that can provide survey-like questionnaires to users, but honestly, these present more trouble to the user than they’re worth.

When I first started using Stack Overflow, I noticed that the feedback service they had been using, UserVoice, was an elegant and functional solution to this problem.

UserVoice takes care of the problem for you, by providing you with an easy-to-use comment and feedback forum. (It can also be a place where users can submit bug reports, as well) However, it’s more than just a forum: By allowing users to “vote” on particular topics, it allows clustering of the most popular ideas/requests, thus bringing them to your attention the most. It also helps prevent duplicate topics from being submitted, and is a great “Digg-style” way of using the “wisdom of the crowds”, as they say.

There are some drawbacks, of course. If you’re using it to allow users to submit bugs, I wouldn’t rely on it as your sole bug tracker. Instead, I’d use it to receive the reports, then parse through and verify them before adding them to a proper bug tracker (like Trac) where they can be better integrated into your development work-flow. Furthermore, if you have a popular site, the feedback forums can still become deluged in too many requests/ideas, but that is a problem no matter what type of system you’re using for feedback. And, as mentioned before, the voting system helps to bring to your attention the most popular ones so that you can further make a value judgment.

I’ve since launched a feedback forum for RunTrackr, my side project for the past little while. I encourage you to give UserVoice a try, since it’s so easy to get started – you’re literally up and running inside of two minutes. At a minimum, give their home page a visit – it does a great job of explaining the process in a simple and easy-to-understand manner.

A few things to note: Firstly, while the act of promoting or removing a search result seems very akin to Digg, the result is not the same. The changes you make only affect your own search results, and Google is very clear on this. However, it would be madness to believe that Google would not use the data gathered from this social experiment to further improve their algorithms. You also have the option of adding your own results to further personalize your searches and there is an option for seeing what others have recommended/promoted or removed, providing for an interesting social experiment.

Secondly, as this WSJ blog notes, this ability may annoy people who have used SEO tactics to improve their site’s placement in Google’s search rankings. However, I find this complaint misses the point: Search is supposed to simplify people’s lives, and if they’ve promoted or removed a link it was because they found something to be more useful or irrelevant.

This isn’t yet a “wisdom of the crowds” approach to search results, but its undoubtedly a step forward towards a hybrid approach that takes in more human input to determine the quality of results and their placement. One can only hope it will improve with time!

Okay, so maybe I’m being a bit melodramatic or maybe I’m just a bit stressed out. I had previously talked about how website purchase forms that require you to enter a credit card number in a specific format (e.g., no spaces) were poorly designed since most people don’t deal with large groups of numbers very well. Furthermore, it’s trivial to format the number server-side, so why require the user to? Well, today, I ran into a form that not only required you to enter all of the numbers without spaces, but also punished you if you did not.

A bit of background

I am a member of the IEEE. They’re a great organization, and I find some of their publications such as IEEE Spectrum to be fairly interesting. You also sort of need to be a member if you want to publish anything in the field (I did two summers of research while in university), and since I’m an Electrical Engineer, I feel that I need to be part of the largest organization dealing with the field.

So, when a renewal notice arrived in my mail recently, I didn’t hesitate to pay my dues to remain a member. (Well, actually, it sat on my desk for a week before I did anything, but my procrastination is another topic) I thought that renewal would be painless process; it started out great, because as soon as I logged into the site, there was a big button/link for renewing. Clicking it added a “Renewal” item to my cart.

Checkout, or, things take a turn for the worse

Clicking “Checkout”, I thought I’d just have to enter my CC number and a few details, and things would be done. After all, I’ve ordered a ton of stuff online and have never really had a problem. That was, until I encountered the payment form from hell. Just how bad was it? Well…

I enter my CC number in my usual fashion – groups of four digits, separated by spaces. I like to do this just so it’s easier to double check that I entered the correct numbers. I don’t really care if the server “requires” you to enter without spaces, since I usually just remove them myself before submitting. However, as soon as the credit card number field lost focus, after I tabbed to the next field, the form submitted!

After the page had reloaded, there was a warning in red text, “INCORRECT NUMBER OF DIGITS”, or something to that effect, pointing to the CC field. And, the field was empty. That’s right, it just blanked out the field without even giving me the faintest hint that it would. All my hard work of entering in a 16-digit number was gone, and I’d have to do it again. I didn’t even remember seeing an initial warning telling me that I couldn’t use spaces!

What really happened, of course, is that the form did not really submit. They had some messed up event handler tied to the blur event of the field which sent the value server-side, validated it by their stringent rules, and then loaded the page again if the entered number did not conform to their rules or if the planets did not perfectly align or something like that. That is just whack.

If you actually enter the number the way they want you to, no spaces, it still sends the value server-side, and the page still reloads – but now the credit card field displays not your full number, but just the “XXXX…” and the last four digits, typical of how most statements display it. Your CC number is then stored server-side in a session, I presume. Weird. Furthermore, the submit button of the form wasn’t actually a submit button, (of course…), but was instead a hyperlink with the href attribute set to javascript:someMethod().

Why this is bad

I shouldn’t have to explain this, but I will just because I feel like it. Firstly, as I mentioned before, it’s insane to require users to conform to the “no spaces in credit card numbers” rule when you can just process the number server-side to remove any spaces. But the IEEE form takes it a step further by not only requiring this format, but actively removing any data NOT entered in this manner. It should be a given that you never clear any fields in a form unless the user is given prior warning and confirms it. (This is also why “Reset” buttons should have some sort of confirmation against accidental clicks)

But to carry out all of this action right when the field loses focus is completely beyond me and probably where I lost it. This goes against everything “normal” in UI design. It disrupts your workflow, it changes the state without notification or warning and it pisses off users. A purchase form is probably the worst place to do this in, since you’re trying to facilitate payment from a potential customer.

But the idea that the user has to enter the data in one, very-specific way is just what peeved me off. Most people aren’t perfectionists, so why would you assume that they are when it comes to data-entry and then punish them when they fail to achieve that expectation?

Having strict data format standards for machine-to-machine transmissions is one thing. In human-computer interaction, it’s a whole different ball game, and one that whoever designed the form from hell, evidently doesn’t understand. I’m no usability expert, but I know junk when I see it.

Final words

Okay, so maybe I’m overreacting a bit, or a lot. Though this only wasted maybe five minutes of my time, I was bothered by it enough to write about it for a further ten minutes. You may think me stupid for that, but that’s just how I felt.

In general, security and usability often come into conflict with one another. After all, security is designed to make things tougher for the bad guys and usually some of this spills over onto regular, non-malicious users, making their experience often less easy than it should be.

One good example of this is with authentication. Authentication is perhaps the cornerstone of most computer security systems and is a crossroads where security, usability and other important matters meet. Designing a good authentication system requires consideration of all these points if it is to be effective at keeping bad guys out while still allowing normal users access. However, a few simple steps can be taken to alleviate the burden that such systems place on users. As an example, I’ll look at online credit card payment.

Already a nightmare

Payment by a credit card online can already be a tedious process. First you have to enter a long 16-digit number, followed by another number (usually called the “security code” or CVC), and finally the expiration date. (For those using “Verified by Visa”, you may also have to enter a password after this process) Compounding this situation is the fact that many payment systems that accept credit card info are horribly designed from a usability point of view.

If you buy a lot of stuff online, you’ll know what I’m talking about. Some sites warn you “not to include any spaces” when entering the credit card number. As if entering a 16-digit number wasn’t tedious enough, but now you’re forced to enter it without any separators of any sort. Long sequences of numbers are notoriously hard to discern or deal with for most people, which is one reason why phone numbers are broken up into chunks of three or four numbers, and why your credit card number is broken up into four-digit groupings in the first place.

Requiring the user to enter in a string of 16 digits without any spaces just to satisfy a system requirement is a poor example of usability, especially when it’s trivial to just strip out spaces (or hyphens or any separators for that matter) on the server-side.

Keep it simple

Furthermore, many sites require you to enter the expiration date in using a drop-down menu that often lists the textual names of the months, instead of its numeric representation. While using the textual representation is probably better in most situations since this is how humans naturally communicate, in the context of credit card info, a numeric representation is preferred. Why? Simply because that’s how it’s been done on the credit card itself. When you force the user to choose the textual representation of a month when the numerical one is listed on the credit card, this in turn forces them to perform the translation in their head, slowing things down. While this may seem like a very minor point, the idea here is to make things as streamlined as possible.

There’s hope

I recently used Google Checkout and was pleasantly surprised that they had implemented simple things like this to keep the purchase process as pain free as possible. Adding a credit card to use for a purchase was much easier than for some other online payment systems I’ve used. The card’s number is automatically formatted for you, adding dashes where appropriate, and not forcing you to enter the numbers in some specific way.

Furthermore, you’re not required to select what type of credit card you’re using. Google Checkout seems to automatically determine what type of card you’re using – MC, Visa, Discover or Amex – based on the number itself, highlighting the appropriate image icon of that card. Kudos to them for removing a potentially redundant step. Additionally, the expiration date is entered in the same MM/YY format as is present on the credit card itself. You simply enter in the digits, and it’s converted for you – no drop-downs required!

Google may may not be the perfect “do no evil” company anymore, but one thing I like about their services is that they’re often easy to use. Most of them are simple, and score high points with me for usability, and Google Checkout was no different. Here, they took a different approach to the task, resulting an optimal solution between security and usability. Basically, by using simple techniques to lighten the burden on users, they gained an increase in usability without having to trade away anything in security.

With all the good that Google Checkout is providing to its users, it’s a shame that eBay continues to forbid its usage on their site as a method of payment. This choice was obviously made to protect Paypal, the eBay-owned rival payment service to Google Checkout. Perhaps, and hopefully, things will change in the future.

Basically, a graphical command line is a command line that pops up on screen when you activate a keyboard shortcut/combo. This command line allows you to easily launch any program, file or action by easily typing its name. This offers you the advantage that good CLIs offer – such as auto-complete and speed-of-use, while retaining the advantages of the GUI. I recently learned of a Launchy, a nice program for Windows that offers these features. (Sort of like Quicksilver for Windows)

More than just a command line

Besides its fairly mundane appearance (though Launchy can be customized with skins), the Launchy interface can actually be one of the most powerful aspects of using your computer. When Launchy is first installed and running, you won’t notice a difference – in fact, you won’t even notice a space-stealing system tray icon. The command line window is brought up by pressing a user-defined hot-key. (By default it is alt-space, but I changed mine to ctrl-space, since the alt-space is already mapped to bring up a context menu for the current window, allowing you to minimize/maximize it fairly fast.)

Then, you simply start typing the name of what program you’d like to launch, and Launchy will look for matches. The list of matches pops up in an auto-complete list, and furthermore, Launchy seems to remember your usage habits somewhat, so next time you start typing, it’ll bring up the matches first that were previously used. Launchy is automatically configured to scan for all programs/links in your start menu, and also can be set up to scan other directories of your choosing. It automatically rebuilds the index after a user-defined period of time, so things are kept up to date.

The advantage of such a system might be lost on traditional GUI users, but anyone who dives into the command line will realize its benefit. Typically, input through a keyboard to accomplish actions is far more efficient that using a mouse. Take the Start Menu, for example. A typical computer will have dozens of programs available for launch, and finding the one you want in a menu can be a time-consuming and tedious task. By using Launchy, you can simply type a few letters of the program’s name, and it’ll pop up as an option. Launching a program takes far less time.

There are also a bunch of included plugins that allow for additional functionality. You can, for example, easily access all of your Firefox bookmarks, and also browse through directories/files from the command line of Launchy, further making it an indispensable application. However, perhaps the best part of Launchy is the fact that it’s open-source – that’s right, it costs nothing. So grab a copy of Launchy today!

An alternative to Launchy, which I have not tried, is Colibri. Give it a try, and let me know what you think.

More on why it’s better

As this article best describes it, a combination of the command line and GUIs is truly a best of both worlds solution. CLIs offer a “high bandwidth” input interface, meaning the choice of applications you can launch with just a few keystrokes is huge; this translates into a quick launch time because you can easily find what you want. GUIs offer a “high bandwidth” output interface, meaning they can convey a lot of information back to the user with graphics such as icons, drop-down menus, and the like. Combining the two gives a nice interface like that of Launchy’s.

In particular, I liked Launchy because I’ve been looking for ways to improve my productivity on the computer. Besides putting my most-used programs in the main level of my Start Menu (thus allowing them to be launched with two keystrokes), I was at a bit of a loss at what to do with other programs that I use less frequently. Launchy has solved those problems, essentially allowing me to launch most any program fairly fast. Windows Vista offers a similar feature in its new Start Menu (finding a program by typing), but I’m still running Windows XP and have no desire to upgrade to Vista anytime soon.

Perhaps the only problem with Launchy, has nothing really to do with Launchy at all. It is in fact the Paradox of the Active User, something that I’ve written about before in relation to design. Basically, the paradox can be summed up with the phrase, “Old Habits Die Hard”. Once most users have learned how to accomplish a particular task, they won’t be keen to learn a new way, even if that way is faster and more efficient – basically, they don’t like to take the time to learn a better way, even if in the long run it pays off.

I’ve been somewhat like this, having only recently enabled/started using keyboard shortcuts in Gmail and Google Reader. However, I’m trying to break these habits and by using Launchy more, I hope to transition to using the keyboard more to perform tasks, rather than just relying on the familiar but slow mouse.

I recently begun to clean up and organize files on my desktop. It’s been about a year since I built it, so as you can image, there were files and documents scattered all over the HDD in various unorganized and cryptically-named folders. This chaotic mess of files was making it hard to find anything, even with search, so something had to be done. I endeavored to organize everything into the “My Documents” folder for easy access from a variety of programs, and then remembered why I’d stayed out of it in the first place – all the clutter that’s already there.

Preamble

What spawned this attempt at organization was my recent purchase of an additional 500 GB HDD. Not wanting it to fall into disorganization like the primary one, I decided I’d bring order from the start. Since I intended to use “My Documents” as a root for all of my stuff, I moved it off my Windows partition to the secondary HDD, so that it grow in size and not fill up my primary HDD. While the technical benefits from this might be mute, it does make things easier when you store all of your personal data on a separate drive or partition than your Windows one – if you ever need to reformat or reinstall, wiping the Windows partition won’t affect the partition your data is on.

Running into trouble

It was at this point that I noticed all the stuff that was already in My Documents, the reason that I never really used in the first place – it’s already too cluttered. Most games will put their save game files in “My Documents”, and while I’m not opposed to this (it makes backing up and finding your saved games easier), I don’t like how they’re stored there. Most games simply create a folder in the root of “My Documents”, so if you have a lot of games installed, your folder will already be cluttered. It would be much better if all them adhered to some sort of convention – for example, putting them in sub folder called “My Game Saves” or something similar. Strangely, some of them attempt to do so, such as Age of Empires 3, TES IV: Oblivion and Civilization 4, which put their save games in the “My Games” sub folder. But, it’s not consistent, even with the same publisher – for example, Flight Simulator X doesn’t follow the same convention as Age of Empires 3. (I realize I could probably move all the save games to their own sub folder and edit some games’ configuration files to reflect this, but it’d be a major PITA.)

Furthermore, applications also add their own folders to “My Documents”, such as Skype, Windows Live Messenger, and Yahoo! Widgets. It’s not that I don’t think it’s a good idea to pair application data with a user’s profile, I just have a problem with where it’s been put. Shouldn’t “My Documents” be for user-created data, such as their documents, photos and other files? A separate folder could be made to store all the data that is associated with games and applications. Perhaps this is just how my brain works. But, I like it when I can put all my important personal files in one folder, and then easily back that up to my external HDD regularly. Even if you have backup scheduling software, a setup like this would make things easier.

For now, I’m just going to create a sub-folder in “My Documents” called “Documents” that stores all my files, organized of course, into their own sub-folders.

Another key feature was the inclusion of many inputs. Not only does it support the standard DVI and VGA connectors expected of any LCD monitor, but it also has composite, component and S-video inputs, making this of jack-of-all trades when it comes to displays. It also has a 4-port USB hub and a memory card reader built in, adding extra value. About the only downside I can think of is that I now have a reason to upgrade to HD-DVD or Blu-ray for movies!

Wide open

This was another big jump for me, not only because of the resolution change but also because it’s the first widescreen monitor I’ve used. Initially, I was hesitant to move to a widescreen aspect ratio, since some games didn’t support it, and so you’d either get a weird stretched image or black bars on the sides of your screen, depending on the monitor and videocard used. However, with the increased prevalence of the widescreen format (either 16:9 or 16:10 aspect ratio), game developers are including support for it more and more. Sooner or later, widescreen will become the dominant format, I believe. Just look at laptops/notebooks – the majority of them come with a widescreen nowadays.

The benefits of a widescreen can be numerous. Firstly, they’re better for watching movies, since they’re closer to the aspect ratio, and thus maximize the space better, leaving less vertical black space. It can also be better for general desktop work, as the greater horizontal space gives more room, all things equal. For example, browsing in Firefox is a lot easier since there is more room for tabs, so you can have more of them open without the tabs overflowing to a new row, or requiring scrolling.

However, there are also some drawbacks, especially when browsing the web. If you’re like me, you always browse with a maximized window, so that websites take up the full width of the display. This can be problematic for websites that don’t have some sort of limit on the number of characters per line, or the line length. Usability research indicates that there is an optimal line length when it comes to reading text, whether that optimal length is just a preference or indicative of something more basic. It’s similar to how we like to see a body of text broken up into smaller paragraphs, separated by whitespace.

Without a limitation on the line length, widescreen formats can make the reading area of websites longer than optimal, and thus perhaps harder to read. This effect is amplified when you’re running at a high resolution such as 1920 x 1200, so beware of this. Additionally, some improperly designed layouts “break” when viewed at higher resolutions, simply because these higher resolutions were not considered when designing the site. Remember, most people run at a resolution of 1280 x 1024 or lower.

Duality

After upgrading to 24″ of screen real-estate, I gave my old Samsung 17″ LCD to my parents, replacing their old 17″ Samsung CRT. Since I hate seeing stuff go to waste, I decided to set it up as a secondary display on my PC for some dual-monitor action. Why would you need a secondary display when you already have 1920 x 1200 pixels of resolution? Why not? My first idea was to use the secondary display to hold communication applications like IRC and IM, so they are always in constant view and don’t need to be alt-tabbed to. This can be a good thing, or a bad thing.

Another nice use of a secondary display is during web-development. I can code on one screen, and view the output on the secondary – this can be helpful when you have a lot of windows open and don’t want to keep alt-tabbing to find the right one. It’s also nice when you have a full-screen game/movie running on the primary, and have applications like chat/IM that you want to keep an eye on in the secondary.

There are, of course, downsides. Besides being distracting, and possibly detrimental to productivity, this also takes up more (physical) desk space, and obviously uses more energy, which isn’t a good thing if you don’t like melting glaciers or ice caps.

The old days

One thing I noticed after firing up the old CRT was how much worse the display quality was compared to any LCD. Text was not as clear, or vibrant as on an LCD; in fact it looked almost greyish, compared with the crisp text on an LCD. I just don’t know how I stared at these things for so many years. Maybe that’s why I now require corrective vision. Or, maybe I’m just now spoiled.

Wait a minute!

Now, some of you will know that I’m no fan of Apple fanboys, (or fanboys in general), but Apple does get it right when it comes to usability – people generally find Macs easier to use, and more intuitive. While their current line of commercials (“Hello, I’m a Mac…”) may be annoying, they are in general correct for the majority of users who just want to “get things done”. This can be further seen in the success of the iPod – its control interface is second to none.

What’s wrong with the UI in Windows?

There’s nothing wrong with the UI in Windows – it works just fine for me, and I don’t find that it gets in the way when I’m trying to get things done. But, for some people, such things aren’t so intuitive, perhaps because they don’t live and breath computers like I do.

The quick launch bar that comes with Windows is okay, and so is the Start Menu – but an application Dock is bigger, more visible and thus is quicker to use for the average user, such as my Mom. (Though some would disagree)

The choices

It turns out there’s a lot of other people who also want a Dock like Apple’s in Windows, since there are a plethora of programs out there that accomplish this. The top three I found were MobyDock, RocketDock and Y’z Dock. I only had time to try out the first two, and there were many more that I didn’t bother to look at, but I was impressed.

Both programs support easy drag and drop operations, so you can add programs to the dock simply by dragging an existing shortcut onto it; removing the icons from the dock is just as easy. They can also be positioned virtually anywhere on the screen, with offsets from top/bottom/left/right being allowed. They also feature the nice “zoom” animations as featured on Apple’s version, and have a small memory footprint.

They’re also devoid of any confusing jumble of messy configuration dialogs – the settings pages are very simple and straightforward, and the apps “just work”, so you probably won’t need to even touch the configuration pages. This is the way software should work, at least software intended to be used by the masses. Too often, software comes with too many options pages, making configuration both confusing and tedious. Usability testing should be done to find out what’s intuitive, instead of making a bunch of cryptic settings.

Out of the two, MobyDock probably offered more features than RocketDock, offering built-in widgets for Weather, Screenshots and a Clock. However, it also seemed to be a bit buggy, as it crashed a few times, so I’ll be using RocketDock since it’s for the parents’ computer, and they don’t need to deal with that. MobyDock also seems to have stalled in development, with the latest version being put out way back on November 18th, 2003 – by contrast RocketDock still appears to be continually updated.

Kudos to the developers of these programs for not only making a useful piece of software, but also for making them freely availabe.