Friday, March 11, 2011

Dealing with complexity in UI design

An article on OSNews.com popped up in my RSS reader which caught my attention. It deals with how to design user interfaces and the balance between feature richness and a usable interface. Since this is the main focus of Stoffi I thought I should add my own thoughts to the author's article and relate that to how Stoffi works.

Complex versus Complicated
First of all the author Julian Fietkau talks about the words "complex" and "complicated". These two words are different in the sense that the former is objective while the latter is subjective. A complex system does not have to be complicated. Complexity is just a measurement of how something is structured, while whether a system is complicated or not lies within the perception of the individual. I think that this very much true and that's why it is possible to add features without adding bloat, if you do it right.

One example of such a feature that I at first considered to not add to Stoffi was the ability to manually check for upgrades. The Google Chrome web browser which has the ability to upgrade itself in the background does not let you control when the upgrade checks will be made or when they will be installed. At first I was going for the same but after a feature request I decided that I could add this feature without making Stoffi more complex.



The secret is in default behavior and adaptive interface settings. Stoffi will, by default, check for upgrades and install the automatically. But by just changing a single setting in a drop down box you will get access to more control over how Stoffi behaves.


When you change from "Upgrade automatically" to "Let me check for upgrades" Stoffi will add a button where you can check for upgrades, and when it does a progress bar will appear. This means that the interface changes depending on the user. It is simple by default, but can become powerful if you need it to.


Familiarity
Fietkau continues with touching on the issue of having to relearn different aspects of certain actions. He metions the book Don't Make Me Think which makes a great point about how users want their software to behave. An example of this is how Firefox added the ability to import your bookmarks and other data from Internet Explorer. This makes it more easy and attractive to switch to Firefox.

I am aiming at something similar with Stoffi. The first step was to add different shortcut profiles where you can select the one that you are most comfortable with, be it iTunes, Winamp or even Banshee or Rythmbox. You can use the same shortcuts for the actions that you are used to. But I have more plans to enhance this further. I want Stoffi to when it is first run, detect which players you already have installed and give you the ability to import all music and all playlists from that application while at the same time setting the keyboard shortcuts automatically. This will let you convert from your favorite player to Stoffi with one click and keep as much of your data and settings as possible, minimizing the work for you.


Stoffi also uses the familiarity with the Explorer interface and to some degree the same concept that iTunes, Banshee and many others use, namely to have a navigation pane to the left and content to the right. This makes you recognize the interface and the concepts of how the interface is structured. Stoffi want to be as you guess it is. We want your guesses to be correct as much as possible, which means that we must do our best to behave as you expect us to.

But if we for some reason do not behave as the user expects we need to make it clear why and how it is done instead.


Follow Up
I suggest that you go and read Fietkau's article, it is very good and has some nice points. Interface design is becoming more and more important in the software industry and it is necessary to discuss the various aspects of it.

He will write a follow up so keep an eye out. Maybe I will do another post then as well.