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  
   
 

BROWSE GUUUI POSTINGS

Navigation (63)  Web page design (41)  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) 
 

1

Cram product pages with feature specs

The standard recommendation for product page design is that we should focus on descriptive text about products' benefits rather than feature specs. But observing people shopping on various sites, Cyd Harrel found that customers often need specifics first. They typically scroll past general copy in their search for very specific and deal-breaking details that they want to have confirmed before considering putting the product to their list of options.

Links:

  • Take Your General Information and Shove It Open link in new window

Henrik Olsen - April 04, 2019

Permanent link Comments (0)

See also: Web page design (41)  E-commerce (28) 


 

2

Users ignore decorative images

In this article, Jakob Nielsen shows how eyetracking studies reveal that user pay close attention to images on websites that contain relevant information (such as product images), but completely ignore "fluffy pictures" that are purely decorative.

What Jakob forgets to mention is that eyetracking equipment only records eye fixations and not peripheral vision, that is, what we are able to see outside the center of gaze. So the studies don't prove that "feel-good" imagery fail their mission.

Links:

  • Photos as Web Content Open link in new window

Henrik Olsen - November 01, 2019

Permanent link Comments (1)

See also: Research (130)  Emotional design (10)  E-commerce (28)  Web page design (41) 


 

3

Use summaries on blog front pages

What's the best layout for a blog front page? To show full articles or to show summaries of the latest post?

According to research done by Jakob Nielsen, using summaries works best with blogs that people don't visit every day. They are better at drawing readers in as they offer a broader selection of subjects and increases the likelihood that they will find something that interests them.

Links:

  • Corporate Blogs: Front Page Structure Open link in new window

Henrik Olsen - August 10, 2019

Permanent link Comments (1)

See also: Web page design (41)  Text (24)  Home pages (9)  Research (130) 


 

4

Balsamiq Mockups

Balsamiq is an electronic mockup tool to develop desktop applications, web applications, web sites, RIA and iPhone applications. It uses a library of hand-drawn controls (intentionaly) which you can extend with your own.

There are multiple ways to share the wireframes (PNG, interlinked PDF pages, online versions,...) and to gather feedback. It is designed for collaboration, in face-to-face or online meetings.

"Put that pencil down - Using Balsamiq Mockups feels like you are drawing, but it's digital, so you can tweak and rearrange controls easily, and the end result is much cleaner. Teams can come up with a design and iterate over it in real-time in the course of a meeting."

Links:

  • Balsamiq Mockups: Product Tour & Features Open link in new window
  • Balsamiq Mockups: Online demo Open link in new window
  • Balsamiq Homepage Open link in new window

Pieter-Jan Pruuost - June 28, 2019

Permanent link Comments (0)

See also: Tools (106)  Web page design (41)  Prototyping and wireframing (120) 


 

5

Collection of results from A/B test

At Abtests.com you can find a growing collection of results from A/B test shared by fellow colleagues. Quite interesting to look though.

Links:

Henrik Olsen - January 16, 2019

Permanent link Comments (1)

See also: Web page design (41) 


 

6

Forget the fold - people expect to have to scroll

Watching over 800 user test sessions, cxpartners report to have seen the page fold as a barrier to users on only 3 occations. In addition, eye tracking studies commonly show a strong hotspot over the scrollbar, indicating that people expect to have to scroll.

Cxpartners gives the following advise on how to deal with the fold:

- Don't cram everything above the fold. Use whitespace and imagery to encourage scrolling.

- Don't use stark, horizontal lines as they discourage scrolling

- Avoid the use of in-page scroll bars - the browser scrollbar is an indicator of the amount of content on the page

Links:

Henrik Olsen - January 10, 2019

Permanent link Comments (0)

See also: Research (130)  Web page design (41) 


 

7

Jakob Nielsen interview by Webdesigner Depot

Webdesigner Depot has been lucky to get an interview with Jakob Nielsen himself.

Among other things, they talk about:

- How recruiting representative users is the only place you shouldn't skimp in a usability test everything else is negotiable and can be done on the cheap.
- That even though some studies have found that many don't use breadcrumbs, Jakob finds them useful because they are lightweight design elements, harmless to those not using them.
- That it's ok with Jakob that designers make hard-to-use artistic websites when they don't serve a utilitarian purpose.

Links:

Henrik Olsen - September 28, 2019

Permanent link Comments (0)

See also: Interviews (30)  Navigation (63)  Usability testing (71) 


 

8

The usability of real-time feedback in forms

To better understand the usability of inline validation in forms - that is, forms that provide real-time feedback as people fill in answers - Luke Wroblewski set up a usability test comparing different types of form feedback.

Though the participants were confused when simple questions, such as a person's name, were marked "correct", he found that they were faster, more successful, less error-prone, and more satisfied when they used a form with inline validation.

Also, giving feedback after the particpants finished typing - rather than while they were typing - helped the participants complete the forms more quickly.

Links:

Henrik Olsen - September 07, 2019

Permanent link Comments (0)

See also: Research (130)  Forms (30) 


 

9

Craigslist redesigned

Wired has asked some leading designers to give the Craigslist user-interface a lift.

Links:

Henrik Olsen - August 29, 2019

Permanent link Comments (0)

See also: Site design (14) 


 

10

Tips on how to design forms

To find out how to design user-friendly forms, cxpartner have tested four registrations forms at Yahoo! Mail, Googlemail, Hotmail and eBay.

Here are their recommendations based on the study:
- Use a simple vertical layout and vertical aligned labels where possible
- If vertical aligned labels are not possible, use bold left-aligned labels
- When more than one field is placed on a line, ensure that they are designed to look like a single piece of information
- Emphasize the headers if you want users to read them
- If optional fields are needed, make them clear instead of using asterisks for mandatory fields
- Use single field for numbers or postcodes, allow input in various forms
- Let users focus on their task and avoid distractions
- Use real time feedback carefully
- If possible, place tips at the side of the relevant fields
- Provide users with a progress indicator showing them the steps involved to complete the form

Links:

Henrik Olsen - June 02, 2019

Permanent link Comments (0)

See also: Forms (30)  Research (130)  Tips and guidelines (95) 


 
<< Back | More posts >>

Browse GUUUI postings

Methods and the design process

Prototyping and wireframing (120)  Usability testing (71)  Cost-justification and ROI (28)  User research (24)  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 (41)  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 (28)  Persuasive design (23)  Visual design (20)  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) 

Technology

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

Humour

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 (130)  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