ORARIAN \ Portfolio \ HP PDI Case Study  







Hewlett Packard Printing and Digital Imaging Product Advisor

Hewlett Packard's Printing and Digital Imaging product line is their core set of products that just about everyone equates with HP. Unfortunately HP makes so many products, it's had for customers to figure out which one to buy. HP, through their solutions partner Selectica, hired Imagesmith to develop a new interface and flow for their current printer advisor.

A small team of Imagesmith staff and contractors worked on this project for about seven months. I was the project manager and information architect, working mostly with one contract designer, Tom Vinzce. Early on in the process, we had another IA work on the flow with the team, Rick Carmichael. The user testing was done by Marianne Bishop and myself.

The HP team was comprised of senior level marketing individuals—we were able to leverage their experience and marketing expertise to resolve questions of user definition and identity, and information seeking goals.Much of the length of the project timeline was due to only meeting once a week with most of the key decision makers.

Ultimately, the team solved all of the client's problems with the original advisor. During development we also sat on a committee to help develop new standards for HP Web application user interfaces. Due to the success of this project, Imagesmith was hired to work on several other projects with similar interactive requirements and challenges.

The Process

We defined an initial flow for how the Advisor would work. This was done before we really had details about all of the product lines, but it helped us build a model for all of the products. Along with this flow, we began to define more formally how the process would map out, and designed a low-resolution user interface to accompany this.

HP PDI - initial flow diagram

Download the HP PDI initial flow (PDF 119K)


HP PDI - low res UI


After much work with the HP team and the engineers at Selectica, we came up with what we called the product determinant factors. This was a list of questions asked for each product line and the key product specs that differentiated products in a line. This was build out based on the flow we had already defined.

HP PDI - product determinant factors

Download sample of Determinant Factors (PDF 67K)


After building the determinant factors on the questions we would ask the user, we began to sketch out user interface elements needed to provide the most freedom and flexibility for the user. These interfaces were designed with the HP interface guidelines in mind, as we were working on a project that had to be incorporated directly into their look-and-feel. This also meant we could start very rough, knowing that their guidelines would help hone our designs.

As a side note, we were invited to be part of their (web user interface) Early Adopter's Committee. Due to the timing of our project, we were the only application development team using HP's revised interface guidelines. This allowed us the opportunity to help influence their new user interface, helping them solve some problems with interactivity and user freedom. Alas, some of the solutions we came up with ultimately didn't get approved—that is partly why the interface for the current Advisor doesn't look exactly like the screen shot below.

HTML Prototype & User Testing

We built a faux-functional HTML prototype and did user testing. This prototype presented what a user would interact with and how pages would react to choices they made. It of course didn't show the actual choices a user would make, since it wasn't hooked to a database.

As a side note, I found the women we user tested to be much more comfortable with getting results inconsistent with their choices (due to it being faux-functional). Even though we told everyone this was not truly interactive, the men invariably had troubles.

The tests were designed around user profiles built up in discussions with HP. We built user scenarios and goals, tasks that we felt users would want to accomplish, as well as context for user testers who might not exactly match the profiles (like a young woman who is not in college, but we want her to accomplish a task as if she was a college student). We also designed a user testing script, with an exit survey.

After testing and presenting the results to HP, we made several small (and a few large) changes to the flow and user interface. We produced a user testing report for HP, of which the following screen shot was included with call-outs. We then moved forward with developing the final interface and documentation. The screen shot below shows redundancy in buttons, something that confused some of our testers.

HP PDI - user testing call out


In addition to screen shots and all HTML-based graphical elements, we provided Selectica with lots of documentation to make sure that the final application met all specifications. One document was the ingredients list. This defined all the elements on a page, in text, much like a check list.

Ingredients list sample (PDF 7K)

After completion, the product was launched with multiple references throughout the HP site, and of course contextual links were placed throughout the shopping and product pages. Below is a screen shot of the application right after launch. Call-out details are noted below.

HP PDI - screen shot

(a) the steps in the process are clearly shown in the upper left content area, with the current step in bold. Users could click to any step they wanted—except for the grayed out one, due to logic limitations (you can't compare without first selecting from the found set of products).

(b) throughout the first step, the "products found" display, in the upper-right, shows how many products fit their chosen criteria so far, with a list of the options they have selected so far (i.e. "Printer, Black and White, Personal", etc.).

(c) this screen shot shows step 2, where the user sees a list of the 3 products found that fit their chosen criteria. From here they see the four main decision-making criteria for this product line: price, B&W print speed (we made sure the user knew it was for draft mode), B&W Print Quality and Duty Cycle (there wasn't any data for the products shown in the screen shot—a big reason to make sure that the data you feel is valuable is always available). These criteria were defined by HP marketing staff, the ideal individuals to identify this valuable information.


Related Links


© 1998–2007 Scott Robinson