Case Study
UI Design and Usability Testing:
BuyingRight Web App
“While using each interface, feel free to think aloud and express any reactions, confusions, or suggestions that come to mind.”
Goals
Design and test three UI prototypes for a novel online-shopping web app, then re-design the interface based on usability findings.
The platform enables users to build personal “value-profiles” by sorting phrases extracted from product reviews; an algorithm then offers personalized product recommendations based on the consumer’s value profile.
Approach / Methods
UI Prototyping.
We designed three interactive UI prototypes using JustInMind software. Each prototype featured a different interaction and visual layout for sorting phrases and applying filters.
Usability Testing - overview.
We conducted “discount” usability testing (term coined by Jakob Nielsen) with 6 participants to rapidly evaluate the three interfaces. Each participant completed the same task—sorting phrases, selecting filters, and receiving a product recommendation—with each of the three prototypes in a randomized order.
Qualitative feedback.
We closely observed participants’ interactions during the tasks and encouraged them to “think-aloud” by narrating their actions / thought processes and providing in-the-moment impressions. Additionally, we asked post-task questions to explore observed/reported difficulties, and to solicit overall preferences and suggestions.
Quantitative performance data.
To objectively compare the three prototypes, we collected quantitative data performance including task time, mouse travel distance (with visual heat maps), and ease of use ratings.
Heuristic review.
In addition to the usability test findings, we reviewed the prototype interfaces based on established Human Factors principles to identify strengths and weaknesses. We applied these heuristic principles when redesigning the interface.
Outputs
Redesigned Interface.
We redesigned the interface based on the qualitative and quantitative usability test findings, as well as heuristic principles. Though beyond the usability test scope, we also designed the Recommendations Screen according to feedback provided by a couple participants and heuristic principles.
Usability testing report.
We developed a detailed report describing the project background, protocol, usability testing results, and redesign.
View full report (pdf).