Chunking Data – Testing with Wireframes

So we are speaking about chunking up data, that is grouping information so it is easier for users to find what they want on corporate sites. A wireframe may be used to discover through testing the best groups or chunks of information to present to end users. Wireframes are used prior to extensive development, such as the graphics and functionality (look and feel). This can be a very effective way to test while reducing cost and time to market.

"Chunks" or "chunking' is the technical term actually used in the user interface design information industry for similar groups or buckets of information.

A wireframe is an outline, like an information blueprint - it is used to convey structure, taxonomy or that is related or grouped information in lists, which removes the pressure of immediately deciding what the site should look like, and more importantly details what the information model will be. The appearance is in many cases secondary to the main information on a corporate website, but it may be the first thing a customer focuses on, therefore it remains very important.

For our example a senior user experience architect, based on experience, divided the information presented on your corporate site into chunks. Using these information chunks she created the following wireframe, which represents your primary customer facing Web page:

Company Logo Sign In

Local Application Language 2 Search

1st Product 2nd Product 3rd Product

sub product sub product

Free Items Sales Unique Purchase topic topic topic

customer focused versatile reason to buy

Policy Contact Us Locations Shop Support Billing

Wireframes such as this one can be used in user centered design to help your decision making process about what should be on the main page. It will show if it makes sense how to navigate successfully to sub-pages. It is used to ask users what they would choose or what they would expect to see under each of the links. In this wireframe everything is a link, except the company logo, because the user is already on the main page.

This layout of information may differ a great deal from your existing site, this is just a virtual case study – if it were a real one – the wireframe would reflect your customers and your business needs. The next step would be to test it internally with you and your teams, tweak the wireframe and test it with a few customers. It is supposed to be generic looking, unfinished – just to see if the information is expected, and generally in the right locations.

We can also ask about the expected functionality under the selections that your customers and potential customers make. Other techniques include cognitive walkthrough, heuristic evaluation, and a site visit (where UI test visits a customer at their environment such as their office or home), as well as other usability testing. We can use paper prototypes to introduce other information links. Should you have a “Feedback” link for example?

We can use paper cut outs of the words and phases to see if they work in other configurations in this layout. A usability next step might be using the wireframe to test real users to see:

1. What they click on

2. Do they get expected results?

3. What else happens?

4. Can the presentation, the logical groupings be improved?

After massaging the content, context, location, and functional plans, then the look or skin will be added, based on the demographics that data mining uncovers about your customers.

This look, combined with the functionality of the site will in part generate a 'feel', which informs the customer a great deal about doing business with you. These things combined can make the user experience satisfying along the way.

Next time: What do all those Web Design Top Ten Lists mean? How are they useful?