ALL CASE STUDIES
CONTACT
Using remote usability tests to validate a shop redesign
In the fall of 2016, the littleBits team undertook the task of relaunching their e-commerce platform including the shop and checkout experience. After years maintaining a heavily modified e-commerce platform, a new enterprise-level system was needed in order to scale as the business grew.
Due to a crunch in design resources at the time, a consultant was initially brought in to redesign the e-commerce site. When littleBits design resources freed up, the digital team took over the design of the littleBits shop and new site architecture.
My role during the project:
The consultant had made good inroads at simplifying the structure of the littleBits shop, but I knew we could simplify it even further. I standardized the layout of the product cards and simplified the information to the essential points the user needed to make an initial product selection.
The team had determined that we would split the shop from the post-purchase community platform to help focus the shopping experience. I proposed several new navigation options to account for the new site architecture.
I recreated the consultant's wireframe (left) so that we could test performance against my optimized wireframes (Right) using the wireframe style.
I developed a testing plan that to help us determine which new shop design option was most effective and which navigation option was easiest to navigate. I wrote usability test scripts for our current site, the consultant's wireframes, and my optimized wireframes. I ran these three sets of tests on usertesting.com with users that matched our target demographic.
Example of the tasks from one of the usability tests run on usertesting.com.
I reviewed all of the test videos and made notes of the successes and failures that I observed. I consolidated the notes from all of the participants so that I could identify qualitative trends. I also pulled the statistics from the test results, so I could quantify the task completion rate and time on task.
Reviewing a usability test video on usertesting.com and taking notes in-line.
The usability tests on our current site confirmed the structure of our shop was too complicated. The updated wireframes I created performed the best in terms of task completion rate and time to complete a task. We also determined which new navigation paradigm was easiest for users to navigate.
General observations I made that were included in the stakeholder presentation created by my boss.
The most important insight I uncovered was that we needed to provide more guidance for users in selecting the right kit for their child. I recommended that we revamp our "How It Works" page and include a buying guide or add compare functionality to our shop. Unfortunately, due to timing, we would not be able to address this before the holiday season.
I consulted with our UI designer as she evolved the design of the shop page and navigation structure. Once she completed the designs, I helped her set up additional usability tests to confirm changes that were made during design.
Final comps of the shop home page showing the final design of the product cards.
As development progressed and our launch date approached, I worked closely with our developer and UI designer to address any issues that arose. Despite the many adjustments we needed to make on the fly, we were able to launch the new e-commerce platform by our deadline.
It was a whirlwind trying to launch a new e-commerce platform weeks before Black Friday. After the dust settled from the holiday season, we found that our conversion rate had more than doubled. While there was still more work to be done to address the issues we uncovered during usability testing, we had made a significant impact during the most important sales quarter of the year.
