Background

For this brief, we were tasked with finding a poorly designed website, and improving it as a mid-fidelity digital prototype. My team chose a Christmas store e-commerce website.

Testing, Heuristic Evaluation, & Content Inventory

Having established the primary use case of the web store as buying a product, we tested the use case with several different users and found that only 50% were able to complete the task, and all said they would not return to the website.

Users' comments reflected their fustration experienced while using the website:

I have no idea how to do this…I give up

and

I’m probably doing the wrong thing

We performed the tests using Camtasia screen and webcam recording software, followed by interviews with the users.

We performed heuristic evaluations and found unnecessary, distracting, inconsistent, and sometimes useless elements. The issues were ranked according to their severity and prioritised accordingly. A full content inventory of the website streamlined the process.

Sketching, Ideation, & Paper Prototype

With the problems uncovered in the previous phase, I created concept sketches for a new interface by considering the user flow into a more traditional pattern. I turned my ideas into a paper prototype which I then tested with users.

Some changes to the language used on elements as well as the checkout process were changed based on user observation and comments by users.

Digital Wireframe & Iteration

With the changes from the paper prototype tests, and by following established web store UI patterns, I created a digital prototype. This was then again tested with different user groups. Compared with the original website, the redesign was successful in that:

• All users completed the task they were given, compared with half in the original.
• In only one case did a user become confused at any stage, compared with all users in the original.