Conducting usability tests to improve interaction design.

CONDITIONS

When I joined the team, Mailform had built a basic mail-sending app, breaking the inputs up into steps on separate web pages, complete with hard page loads between pages. It's like the interaction equivalent of Brutalism - maybe not so elegant but it mostly worked, with low drop-off rates between steps. However, during moderated in-person usability tests with potential customers, I found a few problems.

USABILITY TESTING

Five people graciously let me observe them test the app with the goal of sending a real piece of mail. I noted anything out of the ordinary. Fortunately, everyone was able to mail a document, but not without issue.

Test Notes

Sketch of the product with test notes and some brainstormed interaction ideas

THE PROBLEM

So, I'm going to focus on just one takeaway from the testing, the bit where Sarah said after she uploaded a file from the home page, "Wait, did my file get uploaded?".

Originally, the user uploaded a PDF and was immediately taken to the next screen, "Destination" in the (above) sketch. It seemed and still seems efficient, in my opinion. But, it wasn't working for Sarah, she needed feedback that her file was indeed uploaded.

INTERACTIVE SOLUTION

In the sketch, I was on my way to a solution which basically comes down to giving the user the correct feedback so they can be sure of what they're doing. Sarah needs confirmation that her file was correctly uploaded.

This interaction REALLY melts down if you were to try to upload a large file over a slow connection. The page would hang and the user would think the app was broken/bugged.

For the final design, after a file is uploaded, a graphic of the file is dynamically displayed with an upload animation. We also included an option to upload more documents to the order.

RESULTS

Sarah was happy with this solution and it also increased the average order size by allowing multiple documents to be uploaded.