My Quotes: A New Revenue Source for a Lab Supply Marketplace

MY ROLE

Lead Designer

Company

ZAGENO, a marketplace for scientific laboratory supplies

 

My Quotes, a key screen of this experience, on various devices

project summary

What we were trying to do, how we were going to do it, and how we were going to measure it

Business case

Quoted orders made up a large chunk of the company’s revenue, but had challenges making a profit. They were handled by legacy processes that relied on PDFs, emailing, and a lot of manual labor. This service didn’t track, measure, or monetize while producing a slow, painful customer experience.

Hypothesis: A better quotes experience with the advantages of a marketplace, order centralization, an approval flow, and accounting efficiencies would:

  1. Monetize quote transactions on our platform — grow our GMV (Gross Merchandise Value) by 25% with a commensurate increase in revenue.

  2. Increase engagement, trust and satisfaction with our platform

  3. Compete in an industry that already had mature quote capabilities

  4. Lay a robust foundation for more improvements, such as requesting a quote from within the platform

 

DISCOVERY

Our foundational design research, comprised of in-depth interviews with multiple types of marketplace users, provided the starting point for all design at ZAGENO.

I created this deck to distill the synthesis of our research and socialized it with the rest of the company

 

Customer interviews specifically around quotes

  • We confirmed there was healthy interest in adding Quotes to our existing platform

  • We clarified which scenarios and use cases were most important to our customers

  • We gained a good understanding of what NOT to do, like interfere with communications between customers and suppliers

 

When the Product team was ready to kick off the Quotes project, we decided to do a Design Sprint to firm up our thinking and approach to the project.

Artifacts and cheer in San Francisco

Based on Google’s 5-day Design Sprint process, we mapped, sketched, made decisions, wireframed and prototyped. We brought in seven stakeholders from the Product, Data, and Customer Success teams. They weighed in on how things were done currently, what were the painpoints for both customers and our operations team, and what prospective and current customers would value in this area.

Comments from participants

Participant comments collected during Design Sprint retro

Sprint Results
The Design Sprint clarified the parameters and priorities of the project: what we would do first, next and in the future. It also brought everyone on the same page.

 

planning

User Scenarios
The product manager, lead engineer, and I prioritized our potential user scenarios into Critical, Desired, Nice-to-Have, or Out of Scope. I started by designing the best user experience first as a north star, and then stepped it down for engineering feasibility and scoping purposes.

Google AI/OCR

The value of automatic data parsing for the customer was to alleviate the pain of manual data entry, and to bring quotes into the usual accounting flow.

We fed hundreds of quotes into Google AI to train it to parse quotes. Since that was not a fail-safe method—sometimes the system would get it wrong—I designed an interface which allowed the user to correct the data that had been brought in.

 
 

design process & feedback

The PM, Engineering Lead and I worked out the details of the design while showing to customers and providing for possible different user paths or system failures.

  1. Use cases After hashing out the high-level direction during the design sprint, the product manager and I came up with about 40 use cases. With our engineering lead, we prioritized those based on our available resources.

  2. Wireframe Prototypes Based on the ideal customer journey, I created quick wireframe prototypes to visually describe how the process should work.

  3. Internal Feedback & Socialization My team discussed the project internally, showing prototypes to stakeholders and SMEs for feedback. We iterated until we felt we had a successful user flow.

  4. Customer feedback We showed our cleaned-up wireframe prototype to customers for feedback and iterated the design based on that feedback.

 

We presented wireframe prototypes to several customers. The feedback validated that we were on the right track, while prompting us to change a few details.

For instance, we moved the selection of the supplier to the front of the process, so that the user wouldn’t go too far down the path before finding out their supplier was not an option.

 

Scroll to the right to see the basic flow in wireframe form:

The flow ended up being not significantly different from what we had hashed out during the design sprint.

 

Development

Final designs & specifications

The final specifications for the engineers included detailed specs of the new components, in all states, and key screens showing the layout and grid used for each page type across devices.

  • High resolution components for visual design

  • Responsive key screens to show entire high resolution page layouts across devices

  • Wireframe prototypes for behavior and flow

  • Design specifications to explain component behavior and any designs that need further clarification

This was a rather large project, with many iterations, flows, and components

 

Collaboration with Engineering

During the course of the project, engineers suggested additional UX patterns that would be quicker to implement, such as a different zoom-in UX pattern. This close collaboration made for a better, more efficient result.

Design Reviews

We did frequent design reviews in Storybook throughout the development phase to ensure that the components and pages were developed as designed.

 

outcome

428 quotes processed by 12 customers with 166 suppliers!

For customers: Ease of use, efficiency, better workflow
For ZAGENO: Time-saving, increase in stickiness

  • We rolled My Quotes out to Beta customers first, where we received overwhelming positive feedback about the design, calling it “easy to use” and “logical”.

  • A few months later, we rolled it out to all customers.

  • During the first two months of use, there have been 428 quotes processed on the platform with no human in the loop.

  • At this time, we know we have saved time for our Operations and Customer Success people for 428 quotes. This used to be done entirely through phone calls, emails, and other high-touch ways of communication. Now it’s entirely automated.

  • It is still too early to see if My Quotes has increased direct revenue or sales, but early indicators point to a higher satisfaction with the experience overall.

 

The first phase of My Quotes sets up a foundation for further experience improvements

 

next steps

Next phases will have more of a chance to move the needle on customer experience and company revenue:

  • “Sharing Quotes” — Allowing multiple people to order from the same quote

  • “Request a Quote” — Requesting quotes from suppliers through the platform

  • “Recurring Quote Orders” — A frequently used ordering pattern