Showing posts with label Usability. Show all posts
Showing posts with label Usability. Show all posts

Thursday, September 20, 2012

To Carousal or Not

In an effort to squeeze more content on web pages, designers sometimes turn to novel navigation features such as carousels that advance or rotate objects in a fixed space. These are great for displaying related products or showing facets of the same product, such as pants presented in different colors or with different tailoring options (cuffed or not, straight vs. relaxed cut, etc.). Some carousels are relatively simple slide-show-like implementations, while others present selectable objects in a 3-D, circular view.

For ThanksGiving, I am offering 5 exclusive website templates for just $3.99. Purchase Here.

This carousel, used on, effectively displays related products within a small space.  It clearly communicates the total number of pages or items available.

When using novel interaction such as a carousel, web site designers and content writers need to remember usability basics such as reinforcing a sense of place and keeping users in control. For example, common usability problems we have seen with carousels include:

1. Users can easily lose track of what they have previously viewed when sites do not display how many items or sets of items exist or their current location within the set.

This type of carousel makes users work harder to remember which items they have previously viewed, especially if items are not visually distinctive or otherwise memorable.

One site we tested displayed content below the carousel when an item was selected. Users were not always aware of which item was selected, and some did not associate the dynamic content with the carousel selection at all.

2. Complex navigation within a carousel can be very problematic. Rich navigation is possible using a carousel model, whereby the carousel changes “pages” that each present their own set of navigation opportunities via links or embedded objects.  We have seen users become lost or miss key messages within this type of navigation scheme.  Interaction designers need to take extra care to convey location and navigation options through labels, headings, and other visual cues.

Saturday, August 18, 2012

Who came first - Content or Design

Well, I believe that to make good design you should know what content is. It’s because design is about how to deliver content the right way. On the other hand, not only content matters, but also form of delivery, medium (read “design”) could make a competitive advantage, become a key idea of customer’s business.

But, obviously, it’s not about content only, there is user study, context of usage, company possibilities and business interest. All these things should influence design.

Get as much of the content before designing as you can.

I've long believed that real data delivers really effective design. Using actual content, information, and activity throughout the design process to inform and guide decisions results in product designs that scale well and communicate effectively.

For ThanksGiving, I am offering 5 exclusive website templates for just $3.99. Purchase Here.

This philosophy could be thought of as "death to lorem ipsum". Lorem Ipsum, in case you are wondering, is dummy text originally used in the print industry to lay out page designs. It has since been re-appropriated byWeb designers (and worse yet software designers) to lay out Web site and application designs.

Using dummy content or fake information in the Web design process can result in products with unrealistic assumptions and potentially serious design flaws. A seemingly elegant design can quickly begin to bloat with unexpected content or break under the weight of actual activity. Fake data can ensure a nice looking layout but it doesn't reflect what a living, breathing application must endure. Real data does.

It's also important to note that Lorem Ipsum can cause you to make some awful design decisions if you are relying on a certain volume of content that will not actually be there in the end, whether it be too much or too little.

Friday, May 25, 2012

Milliseconds count - Some Tips on Designing Menus

A lot of sites these days think that “keeping everything in easy reach” means nesting navigation menus so visitors can get to something deep within the site without clicking on any other pages. As a result,you find a lot of drop-down menus that then trigger a secondary menu that “flies out” from the side.

For ThanksGiving, I am offering 5 Exclusive Website Templates for just $3.99. Purchase Here.

Well, let me be blunt: This technique may be useful, but there’s a long road from useful to usable.Try navigating one of these with your finger or a TV controller and you’ll quickly curse the designer. And even with a mouse, it can be tricky to grab the word or phrase on which you want to click. That said, there are a couple of very basic things you can do that will dramatically improve usability.

Make sure that the clickable area is larger than just the words in the link. You really don’t want to make these active areas too small.

Make sure you give people enough time to maneuver the cursor into position. Although I hate to get into technical nitty-gritty, the timing issue is really quite important, so let me share some of the current best practices:

Let the cursor “hover” over a link for about half a second before triggering any menu expansion.

After an animated menu has been triggered, it should display as quickly as possible—in less than 1/10 second if possible.

When the visitor moves the cursor away from the menu, wait half a second before you collapse the menu. This gives people a chance to move the cursor more sloppily as they navigate and cut corners, thus reducing the need to stay strictly within the active areas of the menu

That said, when the menu does collapse, it should do so as quickly as it appeared.

From a functionality point-of-view, make sure to check the timing of these actions on a slow device and not just on your own faster-than-lightning computer. In general, you should also be checking your overall server response times on a dial-up connection and not just on broadband. You’d be surprised at how many people don’t have any access to broadband, particularly in rural areas. And if you are working in an international environment, keep in mind that outside North America, Europe, and a few countries along the Pacific rim, there are many regions that still have no broadband access at all, but merely slow dial-up and mobile connections.

By delaying the collapse of a dropdown/fly-out menu, visitors can move the cursor directly on the diagonal without triggering other menu items or losing the one they wanted to click.