To the front pageThe Interaction Designer's Coffee Break - Weekly postings and quarterly articles about interaction design  
  To the front pageSign inTo the frontpageSearch in GUUUI postingsAbout GUUUI  




Rapid web prototyping

A survey conducted by GUUUI confirmed that there's currently no consensus on what's the best tool to use for web prototyping and that many are not content with the tools they are using. The first article in the Q3 2002 issue of GUUUI presents the results of this survey. The second shows how the diagramming tool Visio can meet a wide range of the interaction designers' requirements.


Henrik Olsen - September 30, 2002

Permanent link Comments (0)

See also: GUUUI articles (11) 



Adventures in Low Fidelity: Designing Search for Egreetings

Cris Farnum's story of a redesign of Egreetings proves the importance of testing early prototypes, by showing how even experienced interaction designers can be wrong and how we have to accept that usability tests can fail concepts, which we believe to be superior.

The article is also an interesting case on testing paper prototypes - or "tabletops", as Farnum calls it. I especially like their use of laminated printouts of screens, which the users can write on with a thin whiteboard marker.


  • The article Adventures in Low Fidelity: Designing Search for Egreetings Open link in new window

Henrik Olsen - August 01, 2002

Permanent link Comments (0)

See also: Cases and Examples (28)  Usability testing (68) 



Survival of the fittest through iterative design

Comparing iterative design with Darwin's concept of natural selection, John S. Rhodes from explains why iterative design and testing are important.

Natural selection happens through the production of many offsprings, each with their unique differences. The ones that are strong and fit in a way that make them succeed in their environment, will survive. That's why many quick and dirty prototypes (offsprings) and continuous testing (selection in a natural environment) are important to a successful development workflow.


  • Evolution, Usability, and Web Design Open link in new window

Henrik Olsen - July 30, 2002

Permanent link Comments (0)

See also: Tips and guidelines (95)  The design process (24)  Usability testing (68) 



Prototyping for Tiny Fingers by Marc Rettig (1994)

This fairly short article about paper prototyping covers how to do them but is more concerned with why they work. The interesting aspect of this technique (fmm) is the notion of 'playing' the computer; I have experienced students creating fairly complex interactions that they could simulate 'by hand'. The article also highlights some of the problems with hi-fi prototyping - the time it takes, the fact the users tend to focus on the gloss and the understandable resistance on the part of developers to change them. This kind of technique is akin to the performance design method (interactionary) which also seems like a brilliant technique to use with students (so there is no hiding from the comments of your peers or tutors). It is a shame though that the scan is of such poor quality!


  • Prototyping for Tiny Fingers - original article (pdf) Open link in new window
  • Overview of Paper Prototyping Technique (from the European Usability Support Centres)) Open link in new window
  • INTERACTIONARY - Sports for design training and team building Open link in new window
  • INTERACTIONARY - Sports for design training and team building Open link in new window

ben hyde - July 18, 2002

Permanent link Comments (3)



The art of UI prototyping

Scott Berkun's primer on prototyping explains the why, when and how of user interface prototyping for web and software designs.

To Berkun, prototyping is a means of exploring ideas, ensuring quality and save time and resources: "Even the brightest people make mistakes. This is especially true for teams of people. Somehow, as a project moves forward, small assumptions and well-intentioned but poor decisions accumulate, turning hours of work into a lousy user experience. The smart teams eliminate their mistakes before they ship by using a technique called UI prototyping. Combined with usability studies, prototypes keep teams headed in the right direction."


  • The art of UI prototyping Open link in new window

Henrik Olsen - July 04, 2002

Permanent link Comments (0)



Extraordinary prototyping tool

Group for User Interface Design has developed a quite extraordinary piece of software for prototyping called DENIM, which is free for download at their web site. With the tool you sketch sitemaps, storyboards and page layout by hand and work seamlessly between the different levels of detail by zooming in on items.

Unfortunately the tool is developed for pen interaction and is very hard to use with a mouse. But if you have a pen tablet or a touch screen you might find it handy.

But check out the video presentation anyhow


  • The prototyping tool DENIM Open link in new window

Henrik Olsen - May 12, 2002

Permanent link Comments (0)

See also: Tools (106) 



Usability Toolkit

InfoDesign has a section with a lot of free usability toolkit materials including descriptions of usability techniques and downloadable tools such as guidelines, check lists, examples and software.


  • The toolkit at Open link in new window

Henrik Olsen - April 09, 2002

Permanent link Comments (0)

See also: Tools (106)  Expert reviews (11)  Card sorting (13)  User research (23)  Personas (19)  Usability testing (68) 



In this article CTO of tells how they learned through experience that a top-down approach to Web development is doomed to fail.

Going through an iterative process with prototyping and usability testing, a makeover of resulted in an increase of the conversion rates (the percentage of visitors who make a purchase) by 75 percent.


  • The article How to make sure the customer comes first Open link in new window

Henrik Olsen - March 26, 2002

Permanent link Comments (0)

See also: Usability testing (68)  Cases and Examples (28) 



Advantages of paper prototyping

According to Carolyn Snyder, the advantages of paper prototyping compared to computer-based prototypes are:
- You don't have to struggle with computers
- It's faster to do changes
- Its takes days instead of weeks
- It requires zero coding
- You avoid nit-picky feedback
- You encourage creativity

And according to Carol Snyder users responds positively to paper prototypes if they are briefed appropriately.


  • The article Paper Prototyping Open link in new window

Henrik Olsen - January 08, 2002

Permanent link Comments (1)

<< Back | More posts >>

Browse GUUUI postings

Methods and the design process

Prototyping and wireframing (119)  Usability testing (68)  Cost-justification and ROI (27)  User research (23)  Personas (19)  The design process (24)  Eye-tracking (14)  Card sorting (13)  Web traffic analysis (12)  Expert reviews (11)  Implementing user-centred design (9)  Site and flow diagramming (6)  Envisionments (4)  Use Cases (3) 

Design elements

Navigation (63)  Web page design (40)  Search (27)  Text (24)  Forms (30)  Links (19)  Guidelines and Standards (15)  Site design (14)  Ads (9)  Design patterns (8)  Sections (8)  Shopping Carts (9)  Error handling (7)  Home pages (9)  Help (3)  E-mails (3)  Sitemaps (2)  Personalization (1)  Print-friendly (1)  Landing pages (5) 

General aspects

E-commerce (27)  Persuasive design (21)  Visual design (19)  Information architecture (15)  Accessibility (13)  Search engines (7)  Credibility, Trust and Privacy (6)  Emotional design (10)  Simplicity vs. capability (7)  Web applications (6)  Intranets (3) 


Flash (6)  Download time (5)  Javascript (3)  URLs (3)  Browsers (3)  Web standards (2) 


Bad designs (20)  Cartoons (14)  Fun music and videos (13)  Funny tools and games (12)  Misc humor (8)  Fun with Jakob Nielsen (9)  Designs with humor (3)  Fun posters (5)  Funny 404 pages (2) 

Resource types

Research (129)  Tips and guidelines (95)  Tools (106)  Books (47)  Audio and video (48)  Interviews (30)  Cases and Examples (28)  Talks and presentations (18)  GUUUI articles (11)  Primers (14)  Online books (5)  Posters (5)  Glossaries (3)  People and organisations (3) 

Information sources

Blogs (12)  Websites (11)  Discussion lists (4)  News (3)  Newsletters (3)  Online magazines (3)  Wikis (1) 

  To the front pageSign inTo the frontpageSearch in GUUUI postingsAbout GUUUI