User-Centered Design

Slam-dunk site building methods for the user experience

You’ve found the site, now you need one piece of information that you’re sure is there. But where? After several clicks into a maze of dead-end and wrong way streets, you give up. You scream, “I can’t find the information I’m looking for!” So you leave the site, another disappointed user left stranded and frustrated on the Information Stupor Highway. We believe that Websites need to be intuitive and predictable. Structured according to the mental model of the user.

Building the prototypes

Long before the finished product is uploaded to the host server, we model a site’s structure by creating two types of construction: wireframe and graphical.

These preliminary structures serve as prototypes. The wireframe rests on ActiveCanvas’ development server. The graphic prototype is delivered via static images.

Wireframe Prototype

The wireframe prototype includes text, structure, and navigation but not graphics. It allow us to concentrate on the copy and framework of the site without being influenced by it’s look and feel. As with any prototype, the wireframe can change through successive iterations.

Graphical Prototype

Graphics are constructed and placed within the site structure. Nonsense text is inserted where text would normally be. This allows us to focus on the look and feel without being distracted by the text.

How users view a site

Information is placed in the wireframe according to how individuals typically view information. For example, users usually look first at the headlines, then the article summaries, and then captions, and ignore graphics. Concise meaningful titles and headers help the user understand the content and meaning of a Web page. They ignore information low on the page, or anything that looks like advertisement.

In organizing the content, we keep the number of user clicks to a minimum to avoid user confusion. And we keep the navigation scheme visible throughout so the user always knows where they are on any page.

How users read a site

A concise style of writing is vital. Text is written to be scanable. Tone is objective, not promotional. We use highlighted words, bullet lists, and one key idea per paragraph when possible.

Once the client approves the wireframe and graphical prototypes, we combine all the elements into the final version.

Everyone benefits

This site building method is good for the designer because the wireframes and graphical prototypes takes less time to build. Changes are easier and no time is wasted. In fact, it speeds the final phase of the project by practically eliminating further iterations.

It’s good for the client because it provides a simple interface for the approval process. In the wireframe, clients pay attention to language and accuracy. In the graphical prototype they aren’t distracted with the copy. It helps everyone on the project team focus on the original site goals.

Ultimately, it’s good for the user. And that’s where the rubber meets the road.