Elastic Path Commerce
Product Free Trial

Launching a B2B SaaS Product in a brand new way

 

UX Design

Project Summary

Imagine trying to sell a SaaS Enterprise product with no free trial. 

That was situation my company, Elastic Path, was in. 

We needed to increase our leads, expose partners and prospects to our product and help onboard folks who otherwise would have to dig deep into the documentation to understand it.It was never designed to allow for a free trial, nor had the architecture to support it.

So what did we do?

Over the course of six months, I worked with a cross-departmental team in order to develop our first public-facing free trial of our eCommerce Product offering.

We researched, designed, built, tested and finally launched the free trial in September 2018.

What was the result?

164 Enterprise Leads Directly in the funnel. The deployment time was decreased from 3 days to less than 7 minutes.

So how did we get there? I lead the design through six key phases: research, journey mapping, prototyping, UI design, user testing and final polish.

Challenges

Elastic Path’s Commerce platform was single tenant, which means one prospect per trial. There was no way this could scale effectively.

Also, our sales team had no way of determining if a prospect was worthy of a demo or not. 

We didn’t really know if prospects wanted to learn more about our software before buying. But we did know that customers found the interface difficult and cumbersome to use with no guidance or instruction.

Research Phase

Initially, my job was to understand the problems more thoroughly, both from a company perspective as well as prospect perspective. I conducted two brainstorming sessions with the presales technical consultant to understand what a “five star” experience would be like. We looked at a high level systems view to understand the various touchpoints and which products would be involved.

Additionally, I looked at modern SaaS companies offering similar free trials, both for ecommerce as well as outside our industry. I mapped out their journeys on a high level, and identified what I thought were the winning aspects that enticed visitors and created more opportunities in the sales funnel.

I explored the web analytics and search words for “elastic path demo” to see what level of desire existed in the marketplace.

Finally, I worked with our product marketing, customer success and support teams in order to identify and solidify our Technical User persona. I gathered data from support requests, partner integrators, as well as chat conversations from our chatbot to create an empathy map and truly understand their needs.

Identifying Pain Points

It turns out that the current system of getting qualified prospects to try out the Product was tedious and required the cooperation of many people. It was time consuming and left room for human error. To help identify the key pain points, I mapped out a user flow and highlighted areas of friction.

Key pain points:

  • NDA took time to generate
  • time to generate demo environment was long
  • who is the owner of the demo?
  • no one to guide user through the journey
  • confused customers overwhelm support with questions
  • customer have trouble learning how to deploy

Mapping the Customer Journey

As this project would encompass multiple departments, I wanted to understand what the complete journey would entail from an end-to-end experience.

Based on our target persona, we wanted to allow the user to experience both a user friendly interface, as well as have the freedom to explore the ecommerce backend and see how their input affected the system.

Over the course of two session, collaborated with six different teammates from support, sales and education by completing a white- boarding exercise. Everyone wrote down an element of the user journey that they identified as being important to the experience.

We then clustered the cards together based on similar characteristics. Those that were seen as beneficial to the user’s journey were written on yellow stickies, and those areas that highlighted possible friction were written on blue stickies.

Our six phases included:

  1. The Discovery Phase – the marketing campaign and ways to promote the trial
  2. The sign up Phase – capturing the user’s data
  3. The initialization Phase – where the user would introduced to the Product and follow the initial learning guides
  4. The Customize Phase – where the user would be able to change certain store items, adjust settings, etc.
  5. The Review Phase – where the user could take a step back and see their updates applied to a real-time storefront setting
  6. The Migration Phase – where, ideally, the user would want to take their “starter store” to the next step and migrate to a more feature complete trial further down the sales funnel

Wireframe / Prototyping Phase

To save time, I created the wireframes directly in Axure, because I wanted to capture more than simple screen flows. I wanted to convey the individual wireframes as well as the flow in the same prototype. I also wanted to prototype consistent variables that would be shared across the experience.

Working on the UI

After multiple rounds of feedback and testing, I art directed the work of an external designer to create the final look and feel of the dashboard, while remaining consistent with our newly created brand.

The Waiting Period

One issue that arose during the prototyping phase was the realization that due to technical challenges, the user would be presented with a static screen for 7-9 minutes while the instance was being generated.

We were concerned during user testing that they would potentially bounce during that period of time and the trial would not continue.

To mitigate that happening, I suggested we produce a quick getting started video that would keep prospects engaged on the page, and give them a preview of what they might expect once they gain access to the learning environment.

The technical development team also proposed spinning up pre-instances in a queing system that would be ready instantaneously. This would work well, provided we could manage the maximum number of signup requests per day. 

User Testing Time

First, I set up a testing strategy. I then conducted over 20 user testing sessions with both customers and partners who matched our target personas.

Over Zoom, I recorded their experiences with a “talking-out-loud” exercise, as they went through our free trial generation and onboarding.

I think transcribed the user testing data into spreadsheets.

 

I feel dropped in without a map.”

-Feedback from User

Research Results

I mapped the data to the 10 Heuristics of Usability to see if I could identify common patterns or issues that arose.

It turns out, there were several.

Firstly, users felt needed context and an introduction to all three areas before beginning tutorials. If they were “dropped in” to the dashboard, they needed to know what was most relevant for their journey.

Users also felt they needed a “knowledge center” mechanism to retrigger walkthrough tutorials after completing them. We wanted them to know how to relearn specific store setup flows, as they required many steps.

Finally, we discovered that the “Wow moment” became the moment users saw a new item added to their storefront. This part of the trial walkthroughs could be highlighted, as we discovered those who completed this step were almost twice as likely to continue exploring the trial than those who did not.

Polish and Launch

With only a few short weeks for QA and polish, we had no time to waste. I designed modifications to the free trial, to account for the user testing feedback.

I also made sure to align the UI with our new rebrand that was happening simultaneously. We wanted key brand elements to be blue, but found ways to contrast key UI elements with our secondary orange colour, such as our help guides and secondary CTA buttons.

Lessons Learned?

The internal release and public beta launch were successful. We gained many quality leads in the pipeline, took the strain off our customer support, and made our Technical Sales Team incredibly happy.

Still, there were a few key learnings:

  1. Try to avoid creating a free trial during a rebrand if possible (inconsistencies abound!)
  2. Engage marketing campaign efforts earlier (to avoid costly overruns)
  3. Work more closely with Education team to make sure Pendo analytics matched the learning flows
  4. Always prompt the user to perform the next step in their guided flow
  5. Assign a support person if possible to triage prospect issues – don’t rely solely on Sales to reach out
Back to Portfolio
Privacy Settings
We use cookies to enhance your experience while using our website. If you are using our Services via a browser you can restrict, block or remove cookies through your web browser settings. We also use content and scripts from third parties that may use tracking technologies. You can selectively provide your consent below to allow such third party embeds. For complete information about the cookies we use, data we collect and how we process them, please check our Privacy Policy
Youtube
Consent to display content from Youtube
Vimeo
Consent to display content from Vimeo
Google Maps
Consent to display content from Google