Infographics are a way to represent information. They should be easy and quick to understand as they usually allow the reader to compare date and see details that, before, were hidden.

I live in the Bavarian capital, Munich, one of the biggest cities in Germany. Here, every year the Oktoberfest, a huge beer-drinking party, takes place. Looking for information I’ve found the consumption of beer and roast chicken since the year 1980. I’ve also found the number of visitors and put all that data together.

As one plays with the graph, it is possible to see that as the number of visitors was going down, the liters of beers has been growing, with a huge jump in the last decade. This means that the people are drinking more alcohol (I’m not judging this behavior, just showing the numbers).

I thought it was interesting to notice how a graphic could open our eyes and wanted to share it with you:

Do you deliver information to users per email? If so, try to:

Send users information that is relevant to them

Designing a newsletter that is "usable" is not an easy task but benefits could be huge: more visits and sales could be reached through good newsletter usability and marketing. Let me show you the iTunes Store "alert me" newsletter example:

The iTunes Store Newsletter

On March 13th I was criticizing Apple for sending me advertisement of an old album that I have and I listen to very often. I was wondering why they were bothering me offering an album that I already have?

 The Newsletter Now: Björk

 Yesterday I received a new iTunes Newsletter recommending me albums of my favorite artist: Björk. There are 2 important things here:

- iTunes knows that Björk is my favorite artist and sends me album recommendations of her,

- iTunes recommends me Björk albums that I don’t have (yet!)

Lesson

Send users information only when this is relevant to them. Recommend only products they might like to buy and they will happily click.

Wordpress is a greet blog tool that I have been using for some time. The new version 2.5 has some improvements, specially on design.

1. Default color. By default the old WordPress interface used to come with a horrible strong blue. The new one comes with a web2.0 pastel palette. This is something that our eyes can be happy about.

2. Wording. If a feature or button is not labeled properly users are going to have a hard time finding it or discovering what this feature is for. An example is the "Presentation" tab on the old wordpress administration that was hiding the design-related features of the blog. I remember having some trouble to find this features the first time I used WordPress. Now the tab is called "Design". Great!

3. Organization. A good little move to improve usability was to reorganize the menu. Write, Manage, Design and Comments are on the left, the rest was move to another corner. This puts the important stuff together and makes the administration page look simpler.

One of the great things about web2.0 is the use of social power to create product recommendations. For example, Amazon.com recommends books from similar authors and Last.fm recommends similar artists.

It’s more than magic

Behind those recommendations there are [usually] complicated algorithms looking for recommendations patterns and similarities among users.

In my opinion there are 3 important issues regarding recommendation algorithms:

1. The more users a website has, the better the recommendations.

2. The more users a website has, the higher the calculation price,

3. Should a website show users how the algorithm works?

There are different approaches  regarding the last point. Should the algorithm be kept as something precious that other websites should not access? An algorithm could improve its performance if the user gets at least some information about the way it works (see Amazon example). On the other side, letting users know about the algorithm could make the recommendation system hackable and someone could take advantage of that to promote his products.

This issues should be kept in mind at the moment to decide to show information or questions to improve the algorithm:

1. Making questions to users could make the system hackable (negative).

2. Hiding those questions would make a website look smarter and additional usability problems could be avoided (positive).

3. Not making those questions could decrease recommendation quality (negative).

Below there are some examples of recommendation algorithms embedded in websites design. 

External Resources About Recommendation Systems

- Amazon.com Recommendations: Item-to-Item Collaborative Filtering (PDF file)

- How Netflix Recommendations Works

- Recommender Systems on Wikipedia

John Maeda’s book The Laws of Simplicity gives an explanation about what simplicity means and how it could be applied. He doesn’t write much about the web, he develops the subject in a more general way; simplicity in the every day life, I would say. He promotes the 10 laws of simplicity: Reduce, Organize, Time, Learn, Differences, Context, Emotion, Trust, Failure and The One.

Maeda explains his law number 8, Trust, with a real world example. On it, he says that making an item return at stores an easy process improves customer trust (easy undoing of a purchase). If the purchase is correctable customers will have the feeling that shopping is simple.

Why should we make web design more trusty?

Maeda’s law number 8 could be easily applied to web design. Allowing users to undo actions on a web page could:

1. Make a website more trusty.

2. Save users’ time as it encourages fast actions ("it can be undone anyways").

3. Give the feeling that using a website is easier than others.

4. Improve a brand image (because of the previous 3 points).

Implementing undo features on the web requires more design work and extra programming, but rewards could be great. I’ve found some examples on the web where undo features are applied (or could be):  

Internationalization is part of a website`s usability. It means not only to make a website available in other languages but also to provide local content and support for local currency, measures and other settings.

Users like websites in their own language and that could be translated into more visits. For example, in a conference in Germany I learned that Germans are not very interested on trying websites in foreign languages, and that’s although most Germans speak good English. I think this happens almost everywhere in the world.

Specially Europeans have been very fast in making their platforms available in different languages. An example of improving competitiveness through usability could be seen on family tree websites.

Geni is a great website but it’s only available in English language. On the other hand, Verwandt.de, the German "copy" has been fast making the website available in different languages. For this reason, Verwandt is growing faster in Europe and Latin America.

Verwandt has done a good internationalization work, they have also changed the name to meet local language. For example, "It’s our tree" in English and "Mi parentela" in Spanish.

Explaining errors is one of the basic concepts in usability for the web. It is as simple and obvious as telling the user what was wrong and how to solve that problem.

"It is important that error messages are clear…"

There are many ways of explaining errors, like going back to the web form marking the erroneous fields. It is important that error messages are clear, avoid things like "error 4055".

Digg, the social bookmarking website, displays from time to time an error message at the end of the submission procedure. I don’t really know why this happens because the error message is not clear, no solution is proposed and there is no entry about that on the FAQ section. The user experience could not be worse in this situation.

See previous entries about this topic.

Why a merge between Microsoft and Yahoo! could be bad for the designer community? We know how bad Internet Explorer is and we also know that Microsoft does not want to adopt many standards. Even worse, its tactics to promote IE are a little bit obscure.

Bad Company + Bad Company = Really Bad Company

Yesterday I was checking the MSN Game Zone, a MSN section that has some free online games. I was shocked when I read that MSN Games can only be played if the user has Internet Explorer. Then I thought, maybe this is not fine and maybe a merge of Microsoft and Yahoo! is not a good idea.

What if Microsoft makes most of Yahoo! services IE-only compatible? Then, a software that does not respect standards will become more and more popular. This means more headaches for web designers and that websites will start having more bugs, with a decrease in quality, usability and user experience. 

Improving your website branding could increase the time visitors stay. Many users get into a page and if they don’t easily notice what the website is for, they leave, forever.

"To be effective, a tagline should be clear and exact…"

One way of showing what your site is for is adding a tagline to your logo design. A tagline is the word of phrase usually written below a logo. To be effective, a tagline should be clear and exact, without fancy wording.

Kohls.com "expect great things" does not tell anything. In this case the tagline is totally useless.

Lowe’s "Let’s Build Something Together" is a better usability approach, but users still have to think a little bit to know what Lowe’s is selling.

Thottbot "World of Warcraft Database" is an excellent tagline example that tells users straight away but the site is for.

Reddit provides an example of poor usability during the site submission form. They try to make fun of users’ errors. If the user enters a wrong CAPTCHA the website displays a "your letters stink" message.

"websites should have meaningful and explanatory error messages…"

Even worse, the instructions of what to do with that weird image (many users don’t know what a CAPTCHA is) were inside the "human?" field, so after entering something there the instructions disappear.

Error messages are not something users like seeing. Usually they are frustrating, so websites should have meaningful and explanatory error messages, they should tell users how to resolve the problem. Remember that if your users are not allow to finish a process, you might be loosing money.

Remember that after an error users usually want an explanatory message that helps them reach their goal (e.g. for example buying something at your site!)