Should A Website Design Show Its Precious Algorithm?

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. 

The Amazon.com approach

Amazon show recommendations everywhere, they do that also as a marketing tool because they know that users love recommendations.  Amazon is so good recommending because they have a huge base of customers buying all those products to recommend. They also have a good algorithm but they don’t hide it as a precious secret, note "These recommendations are based on items you own".

Amazon Algorithm A

 

This is very important: Amazon is recommending a book because the user bought a "similar" one before. Amazon knows that recommending this way is dangerous and it offers a way to fix it.

Amazon Algorithm B

 

Here there is a pop-up window to solve the potential problem. Amazon might be recommending a book because the user bought a similar one, but that one could have been a gift for another person.

Amazon Algorithm C

 

Amazon is not only showing a part of how its algorithm works but it also asks users for input to improve results. Here there is another important thing to check: is it OK to ask users questions to improve website recommendation algorithms or should these algorithms be intelligent enough to avoid bothering users?

Amazon Algorithm D

 

The Amazon recommendation algorithm in action:

Amazon Algorithm E

 

The Last.fm approach

Last.fm, the music recommendation website, adopted a different design solution. At it, users don’t know where the recommendations come from. One might guess but nobody really knows if those artists are there because the user likes other similar artists or because someone is paying to push artists into that list. There is no message like "we recommend Shakira because you like Beyonce".

A valid approach? Last.fm makes a good job recommending music without disturbing users. On the other side this kind of state of user ignorance could be translated into a drop in trust.

Last.fm Recommendations A

 

Last.fm also has a radio set for each user with special recommendations. Here the recommendation algorithm behavior could be easier guessed, the player has controls to "love" or to ban a song. There is a serious problem here, once you ban a son there is no way back.

Last.fm Recommendations B  

 

StumbleUpon

StumbleUpon is a web browser plugin that let users discover new websites based on recommendations and ratings done by other users and the user himself. StumbleUpon works fine and improves the recommendation quality as the user rates more websites.

Like Last.fm, StumbleUpon also decided not to show the user why a particular website was recommended to him.  In this case the algorithm might be too complicated and [I guess] they decided to improve usability taking out additional information. But keep in mind that a lack of information also negatively impacts on usability and trust.

StumbleUpon Bar Recommendation Algorithm

 

External Resources About Recommendation Systems

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

- How Netflix Recommendations Works

- Recommender Systems on Wikipedia

Just Undo It: Designing To Recover From Mistakes

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):  

The Google Case

Google is great implementing undo-options. The best example is the Gmail design, with which the user can delete emails knowing that if he makes a mistake undoing will be extremely easy.

Gmail Undo Option

 

Unfortunately Google is not using undo options in all its tools. Google Calendar works like an old school application asking users if they do really want to delete an event. This makes Google Calendar less efficient and makes users waste their time (I must confess that I love Google Calendar anyways).

Google Calendar Event Deletion

 

Undo Feature Could Improve Sales

At Wal-Mart users do not fear clicking on the "Add To Cart" button because they know that deleting items from the shopping cart is easy. Making users’ life easy does not only improve the overall website usability but it also builds trust that could be translated into more sales.

Wal-Mart Undo Design Add To Cart

 

The Wal-Mart shopping cart: deleting items is easy.

Wal-Mart Undo Design Shopping Cart

 

Writing Without Thinking

 37signals knows very well the power of undoing. After leaving a comment on Basecamp an "Edit (for another 15 minutes)" link is displayed. This gives users the advantage of writing comments fast and the power of undoing/editing after posting.

Basecamp Undo Feature

 

Your Sheet Is Gone, Forever

I couldn’t find an Undo button on the Zoho Sheet application. Indeed, when I was trying to delete a sheet I got a message alerting me that there is no going back for that action. This is bad.

Zoho Sheets Design

 

The glorious undo: On the other hand, Google Spreadsheets has an undo button.

Google Spreadsheets Undo Button

 

Although having an undo button is nice, I would prefer not to be asked each time I want to delete something. Imagine how much time could be saved if this question would be avoided?

Google Spreadsheets 

 

Search Box Design, Things To Keep In Mind

Search boxes are very important elements in the web: if customers can not find what they are looking for they will not be able to buy it. Reality is as simple as that.  

Designing a good search box is not that easy, things to keep in mind:

1. Position of the search box

2. Wording

3. Behavior

4. How the search button should look like

Here I put together some examples of search box designs: 

 

 The Amazon.com design has several things to point out:

1. The search box is in a prominent position. This is important in huge sites like Amazon where the people use the search as navigation option.

2. By default the search works website-wide.

3. Users can search in specific categories.

4. "GO" as search button. I would say that something different from "Go" or "Search" would not work properly.

 

The Amazon search in detail:

 

Safari Books Online has a, maybe, too complicated search box. It’s nice that they placed a link to the advanced search page but, then, why giving so many options to the basic search box design?

Safari Search Box A

Giving so many options in the "simple" search could confuse users… if they are not able to find products they would not be able to buy them…

Safari Search Box B

 

Google is the queen of the search boxes. Simplicity at its best. Remember that Google was the first making the search user friendly? (and accurate).

Google Search Box

 

Use the button to help users

The Facebook friend search box has a dangerous design, it’s not standard as it lacks of a seach button. I would not recommend to think that all users would understand things in such an intuitive way as designers or programmers could do.  

Facebook Search Box Design

 

Ebay labels the search button "Search". No chance to confuse users.

Ebay Search Box Design

 

Notice the button names at Yahoo, they clearly tell users where they are searching; the web or images.

Yahoo Web Search Box Design

Yahoo Image Search Box Design

 

If you place a button try to make it look like a button. Etsy.com has a flat button that does not really look like a button. If possible, make buttons 3D and more users will be able to understand your interface.

Etsy Search Box Button Design 

 

Predict entries

Part of usability is the behavior of a feature. The Google Docs search box helps users as they get suggested results while typing.

Google Docs Search Box Design

 

Search Box Position

I don’t know the reason why but placing the search box on the upper right corner seems to be the standard. Users look for it there. 

Netflix Search Box Position

 

Clean Air Gardening places a small search box on the left corner. Placing the search box under the the logo could make it more visible but it is dangerous to make it so small and to place it on a non standard position.

 Clean Air Gardening Search Box Position

 

Proper wording

Best Buy use some extra wording to help customers. Sometimes using "Search for" instead of just "Search" could make the search box even more meaningful. Notice how the "in" (all categories) could add even more benefit to users.

Best Buy Wording on Search Box

 This examples are taken from the web, I’m not trying to attack anybody. Keep in mind that a bad design could be the result of the lack of money or time.