IMPROVING CUSTOM INK’S DESIGN LAB
In compliance with NDAs, some confidential information has been generalized or omitted.
All info below is my own, and does not necessarily reflect the views of the company.
OVERVIEW
Custom Ink is an e-commerce company providing an extensive and searchable catalog of promo products, allowing customers to design and customize them within a proprietary design platform.
THE PROBLEM
The Design Lab (DL) had only undergone one significant overhaul in its history. Since then, only break-fix actions for existing feature updates had been made, and competitors had comparable features that did not exist on our platform.
In addition to the above, there were common ecommerce best practices that were not being implemented. There were also inconsistencies in both visual design and functionality on desktop and mobile.
DESIRED OUTCOME
After implementation we expected improved usability, more customer engagement with the Lab, and an increase in orders placed.
Other internal benefits were also anticipated, such as reduced errors due to user friction during their design process, and time saved by Customer Care reps, both in phone calls and email outreach.
THE TEAM
While I consulted with the DL Product Manager, Engineering Team and other UX Designers within my group, I was the project lead, and sole designer.
PROJECT SCOPE & CONSTRAINTS
The scope of the project was to review and audit all current functionality, do an analysis of top competitors, research best practices for retail ecommerce products and present a roadmapped plan of attack, that included high fidelity design mockups in our established design system.
The output of the discovery process needed to keep in mind other changes that were already roadmapped for production. Certain features used these work items as jumping off points for the work I was doing.
There was also a considerable amount of work regarding negative space removal on artwork uploads that was being conducted by another designer, and also needed to be considered around proposed features for this project.
PROCESS
COMPETITIVE ANALYSIS:
I reviewed the full design funnel for 5 different competitors and outlined features that we did not have, or were not using to their full benefit. Such tasks involved the inputting and designing text, searching and adding design elements and clipart, uploading different art and imagery and what tools were being used and how they functioned.
Some of these features were:
• a way to duplicate any design element
• advanced text styling (letter spacing, line height adjustment, etc.)
• ability to upload multiple files at once
LEARNINGS ALONG THE WAY
During the internal interviews, a lot of varied
customer pain points were discussed. When conducting
the new round of user testing, we were going to need to be
very specific in the tasks we were compiling for users to execute.
The tests did in fact validate many of the points
we were considering, but there was still some
confusion over tasks being too complicated, even
after we felt we had broken them down to be very basic.
RESEARCH:
An array of previous, existing research had already been conducted internally over the years. I gathered, plotted and reviewed it all for information. This included a survey that had been done by the Design Resources Team and functionality from past quarterly outcome-based roadmapping and design vision sessions.
Quantitative data from Medallia, such as tracked CX measurements, and screen recordings from FullStory were reviewed for tailored insights into the user journey across the different parts of the platform. There had also been some previous rounds of unmoderated user testing in UserTesting.com that were reviewed.
Lastly, explorations had been done by 2 different engineering teams during a previous hackathon. I happened upon this info by coincidence, but it yielded the beginnings of at least 2 different workstreams that were prioritized in the first roll-out.
STAKEHOLDER INTERVIEWS:
Ten individual interviews were conducted with employees ranging from Merchandising to Customer Care to Logistics and Satisfaction. I also interviews 2 other designers from the larger UX Team who had worked on the previous design overhaul and other smaller features.
While the results of the interviews yielded many different ideas and desires, there were quite a few of the same pain points and requested features.
LEARNINGS ALONG THE WAY
There was a strong desire for the ability to upload
multiple files at once to a design, especially in the
case of branded gear for companies (for instance,
2 different logos: one for the front – left chest –
and another the back of the shirt).
The best way to execute this became an offshoot
and research and solutions were conducted quickly and
added as a workstream that superseded the other recommendations.
USER TESTING:
I conducted a new round of unmoderated user tests on UserTesting.com to validate some of the early learnings from the previous research. Many tasks were validated, and users’ designs and the recordings were used as evidence during the final proposal.
RECOMMENDATIONS AND DESIGNS:
Once all the data had been collected, parsed, compiled and sorted into different parts of the Design Labs functionality, the proposal was reviewed with the Product Manager and Engineering Team and recommendations were split into groups.
The Quality of Life (QoL) group contained “quick-win” tickets that were fast to execute and required little change to the codebase. These were things like:
The next group were prioritizations for the upcoming quarter, and included the following, which were deemed most important or relevant to current issues customers were having, and were also costing time for the Customer Care Team:
Lastly, the final group were itemized for future consideration These were either features that hinged on the execution from the previous group or other things that were not able to be slotted into the upcoming quarter. The plan was to pick them up individually should time allow after the QoL and next quarter items had moved into acceptance testing.
FINAL PROPOSALS
DUPLICATE BUTTON
Two different options were proposed for the duplication of design elements: One was on the design “canvas” as an action once the element was selected, and the other was in the tool’s “panel” where other tools were that could affect the element. In the end, and for the sake of consistency, both were implemented in the final proposal.
RECOLORED & REORDERED SIDEBAR
The original sidebar did not meet accessibility standards, so we worked on a light and dark version. Uploads (and their manipulation) encompassed most of the users’ design process, and in user testing we discovered that many people were looking for that tool first. Based on that, we also moved up the Uploads Tool to the top of the toolbar.
UPDATED UPLOADS & EDIT UPLOADS PANELS
Another discovery was that users were having trouble editing and manipulating their uploads, so we looked at both the panel and its editing counterpart.
IN CONCLUSION
The main thing that came out of this discovery was the concept of “design confidence.” Customers were being dropped into the Lab with a blank white t-shirt, and did not feel the courage to get started on a design. Furthermore, once they had a working design, they worried it was “not good.”
This new concept was slated to become a separate workstream in the upcoming year, and initial ideas for exploration on how this could be solved ranged from the ability to find and alter existing templates, to highlighting specific design needs through questions, to diving into how products were being selected before even getting started in the Lab.