Revealing Interfaces

ling inter faceS... revea (aka. Progress ive Disc u losure 2.0) ction A quick introd http://ﬂickr.com/photos/knowprose/103650244/

Q. What is a revealing interface? http://www.janchipchase.com/blog/archives/2007/12/hiding_complexi_1.html

A. An interface that hides complexity until initiated. http://www.janchipchase.com/blog/archives/2007/12/hiding_complexi_1.html

Revealing Interfaces... » can be initiated with a click or a hover. » lead people to explore the site and uncover “power” features. » can reveal more information without leaving the page. » create a certain joy when exposing just what someone is looking for. » can be used for site navigation or single elements/actions. Amazon.com “Your Lists” interactive element

Revealing Interfaces not only hide complexity, but reduce the number of separate pages needed to complete a task.

“Hiding complexity through ingenious mechanical doors or tiny display screens is an overt form of deception. If the deceit feels less like malevolence, more like magic, then hidden complexities become more of a treat than a nuisance.” - John Maeda http://lawsofsimplicity.com/

“Progressive disclosure is the best tool so far: show people the basics first, and once they understand that, allow them to get to the expert features. But don't show everything all at once or you will only confuse people and they will waste endless time messing with features that they don't need yet” - Jakob Nielsen (2000) http://developers.slashdot.org/article.pl?sid=00/03/03/096223&mode=thread

Revealing Interfaces are similar but not equal to Progressive Disclosure (which has been around for many, many years)

The main difference is: The main difference is between Progressive Disclosure and a Revealing Interface is that PD is used mostly for step-by-step processes, where RI can be more fluid – it may reveal an action, a list, site navigation, some photos or just more information for a product or area. But the underlining theme: “removing initial complexity” stays the same! Want to know more about Progressive Disclosure? http://www.useit.com/alertbox/progressive-disclosure.html http://www.time-tripper.com/uipatterns/Progressive_Disclosure http://experiencedynamics.blogs.com/site_search_usability/2004/03/progressive_dis.html

Examples of Re vealing Interfaces

Target.com

Yahoo / flickr

Microsoft

Google

Amazon.com

Netflix.com

songza.com

Apple.com

tripadvisor.com

linkedin.com

More Examples

http://www.nintendo.com/

http://www.handmark.com

https://www.linkedin.com/

http://extjs.com/deploy/dev/examples/menu/menus.html

http://www.istockphoto.com/

So next time you’re creating an interface, conceal complexity and create a simpler experience for your audience.

Jeremy Johnson Hello! I’m an interaction designer (among other things) living and Designing in the Dallas, TX area. By day I create interfaces, evangelize user experience, paint with pixels, as well as try to create change within my organization. At night I consume video games, movies, TV and other electronic media - while saving a little time to take a photo here and there. Learn More: http://www.jeremyjohnsononline.com/

http://www.jeremyjohnsononline.com	431
http://www.usercentered.de	262
http://kr.iamvip.net	177
http://blog.scrnshots.com	114
http://knightopia.com	94
http://jack918.tistory.com	31
http://www.slideshare.net	19
http://simpleandopen.blogspot.com	15
http://katti.secondbrain.com	10
http://www.hanrss.com	2
http://209.85.135.104	2
http://www.netvibes.com	1
http://209.85.227.132	1
http://216.239.59.132	1
http://surf.googlemashups.com	1
http://hectormartinmoreno.wordpress.com	1

Revealing Interfaces

by Jeremy Johnson on Mar 05, 2008

Accessibility

Categories

Tags

Upload Details

Usage Rights

16 Embeds 1,162

Statistics

Revealing Interfaces — Presentation Transcript