Skip to content

Simplicity On The Web: Designing To Hide Features

Making websites easy to use is something desired and appreciated by users. No wonder why. Computers are becoming more and more powerful but humans not. Accepted or not, human processing power has not been growing as fast as technology -we suppose we improved, at least a little bit, right? right??- For this reason, as designers we should try to keep websites as simple as possible.

Many companies have build successful empires thanks to simplicity of their products: Microsoft in the 90′s, Apple and Google in this decade. Making simple products is a totally viable business model, you don’t have to add more features to improve the value of a product.

Sometimes we have the problem that a feature is not really necessary for all our targeted users but it has to be there for some of them. One of the rules to make websites simple or to make websites look simple is to hide features.

Hiding features is a trick used by many successful companies. Here I show you some example tricks:

 Can you see the "customize" link on the embed link? YouTube hides some extra features (and complexity) in this link.

YouTube Design Example A

YouTube Design Example B

 

AOL is also hiding some extra information and features under those buttons.

AOL Design Example A

AOL Design Example B

 

Basecamp is simplifying the search results making the search by default for only one project. In this example, Basecamp is not "graphically" hiding a feature, it’s simplifying through functionality.

Basecamp Usability Example

 

Ebay is hidding a huge category list under one single button (Categories).

Ebay Usability Example A

Ebay Usability Example B

 

Facebook simplifies the homepage a great deal hiding some of the applications under the "More" link.

Facebook Design Example

 

Google is really good at this. Under the "more" link they hide many product offers (Upper left corner). "Advanced Search" and "Preferences" are hiding a lot of complexity and options for the Google search.

Google Design Example

 

 AddThis.com builts a successful business simplifying the users and developers life. A simple idea becoming the last shout on social bookmarking…

Grin Example A

Grin B

 

Can you see the "Listing and payment details" sentence? The "Show" link adds some simplicity to this already busy Ebay product description.

Ebay Design Example C

Ebay Design Example D

 

iStockphoto hides an extremely powerful search tool under the Advanced Search link.

Istock Usability Example A

Istock Design Example B

 

Thinkvitamin.com hides extra information under the "All Features" button.

Vitamin Design Exmaple

 

Can you find the "Page Options" link? Yahoo hides personalization options under it.

Yahoo Design Example A

Yahoo Design Exmple B 

 These were only a few design example from some mayor websites. I hope you enjoyed!

 

Categories: Good Design, Interfaces, Usability, Web.

Comment Feed

14 Responses

  1. Great post, One more for the team in the features war.

  2. Good use of examples. All the images are great.

    With all the easy-to-use Javascript libraries out there (jQuery, Mootools, Prototype), it’s never been easier to hide features. Hopefully more designers will start to do so, and decrease the amount of cluttered layouts on the internet.

  3. Well done post,
    Hiding is quite an import subject in the interface design phase.

  4. “Hidden features” are features that most users won’t find unless someone tells them.

    Users won’t spend time searching for “hidden features”: they only find them by accident.

    kinkyMarch 22, 2008 @ 7:39 pm
  5. It’s all about removing/hiding the obvious, and adding the meaningful.

  6. I actually just posted about this same topic recently. I called it “revealing interfaces” and it’s a way to remove complexity from User Interfaces.

    http://www.jeremyjohnsononline.com/2008/03/06/revealing-interfaces/

    I believe User Interfaces have crossed the road from expected complexity to “why can’t it be as simple as…” – which is a challenge for Designers, and a win for the users.

  7. @kinky, you’re right.

    I only recently found the “hidden” stuff at istockphoto after using their site for months. But I just never had a need to click on my control panel or even the advanced search (thought their meta search engine sucks). Photographers are brutal keyword spammers it seems.

  8. One of my favorite examples of this is the Ministry Index tab at the top of the Stonebriar Church website. http://www.stonebriar.org/

    Insightful article, BTW.
    Thanks.

  9. Hey Jeremy (Davis), thanks for that example. It’s great!

    Thanks for comments!

    Alex

  10. http://www.artifacting.com/blog does a great job of this by putting all of there blogpost meta-data in a sliding menu by clicking each blog posts title.

  11. hidden gold



Some HTML is OK

or, reply to this post via trackback.

Continuing the Discussion

  1. [...] Simplicity On The Web: Designing To Hide Features [...]

  2. [...] Simplicity On The Web: Designing To Hide Features? UI ?????????, ??????????????, ????????????? [...]