User journeys should feel invisible
How we used content to create a connected user experience for the launch of Shopify Fulfillment Network
This article was co-written by Shannon Murphy and Amélie Sirois.
Imagine you’ve just been served an ad for a dinner deal at your neighborhood pizza spot. You head to their website and place an order. But the website doesn’t say whether they received your order and there’s no email confirming your pizza’s being prepared.
After waiting for what feels like forever, the pie finally arrives. But… It’s square, has extra cheese, the mushrooms are missing, and comes with cutlery. While it’s technically still pizza, and definitely still delicious, it’s not what you thought you were getting. From the ad you saw, to browsing the website, and then the final product, there were lots of people involved in each step of your journey to deliciousness. And even though they shared a common goal of getting you pizza, your experience was confusing and disconnected.
That’s because a shared goal doesn’t always result in a connected experience for the user.
Whether it was ordering food or shopping online, you’ve probably had a confusing digital experience. And fractured journeys are not only frustrating, they erode users’ trust even after the first hiccup.
Differences in tone, terminology, and visuals create confusion and discourage users from completing whatever it is they set out to do. We work hard to offer services and products our users need or want, but if confusion deters them from their task, everyone loses. That said, building trust across a user journey isn’t easy. Especially if a different team controls each step in that journey. As UX professionals, we must advocate for consistency and collaborate with empathy every step of the way so we can deliver an impactful user experience.
This post will explore how content designers from different teams, Shannon and Amélie, collaborated to create a connected user experience to support the launch of Shopify Fulfillment Network.
Rallying around our goal
Back in June 2019, Shopify announced the launch of Shopify Fulfillment Network at Unite, our annual Partner conference. And it was unlike anything we’d shipped before.
To support this announcement, we had to rally around two main goals:
- Get as many merchants as possible to show interest in our fulfillment network.
- Gauge logistics providers’ interest in partnering with us to expand the fulfillment network.
Basically, we needed a massive pool of leads in the funnel to put Shopify Fulfillment Network to the test and get resources to evolve the service.
And so, our journey begins here.
Our cross-disciplinary team was formed to deliver on those goals. Content designers, product designers, product managers, product marketers, and developers from marketing and product teams joined forces to create a fluid journey for merchants, across channels.
Our early content considerations
As we kicked off the project, there were a few constraints to keep in mind:
- Draw language from the announcement, including the press release and social media tactics.
- Drive all traffic to a single destination where target audiences would show interest.
As content designers from two different teams, we collaborated to ensure our message was consistent — from the announcement to the start of the user journey, all the way to the Shopify admin and the end of the user journey.
Bringing our goal to life
This product launch had two audiences, each with unique needs. This meant the calls to action would be slightly different for each audience:
- Get Shopify merchants, our primary audience, to apply for early access to the fulfillment network.
- Get logistics providers, our secondary audience, to request information about the fulfillment network.
In this article, we’ll explain how we used content to create an invisible journey for our primary audience: merchants.
We began exploring different options. What channels did we have to work with? What was possible with technical and time constraints? What did merchants need? How could we clearly articulate the benefit to merchants? How could we achieve our business goals with the right amount of friction?
Some of our ideas involved a landing page, form fields, email campaigns, the Shopify admin, and the sales team. With feedback from our stakeholders, we landed on a simple, straightforward journey to maximize the number of leads:
- Send all traffic from the higher funnel touch points (press release, social media, etc.) to a single landing page.
- Guide merchants on the landing page to a primary call to action to apply to join the fulfillment network.
- Prompt merchants to log in to their Shopify store to apply.
- Serve the merchants a confirmation message in their admin to let them know they’d successfully applied.
Step 1: Articulating the benefit
Our small but mighty landing page had to do a lot of heavy lifting:
- Communicate the high-level benefits of Shopify Fulfillment Network
- Compel two distinct audiences to take action
- Capture leads for each audience
- Set proper expectations, as this was an early launch and not all merchants or logistics providers would be accepted
Shopify Fulfillment Network was launching in the United States in English only, so we had few language and technical constraints.
Making content compromises
As UXers, we strive to create the best possible user experience. But we also have to balance business goals with user needs, feedback, and constraints. While we believed it would be ideal to create two unique journeys for each unique audience, there were concerns we’d dilute sign ups if we split traffic from the first steps of the journey. With a high volume of leads being a priority, the team decided to guide both audiences to the same landing page. As content designers, we ensured the message focused on merchants, our primary audience, while giving logistics providers a way to show interest.
Step 2: Capturing leads
The second part of the journey was created so merchants could explicitly show interest in Shopify Fulfillment Network by applying.
We debated long and hard about the best way to do this. Some ideas were to:
- Create a detailed form, so merchants would understand what they were applying for.
- Connect merchants to our sales team, so they could find out if the fulfillment network was the right solution for them.
- Use our Store URL page to capture their store address, so merchants could apply with a few clicks.
Because our goal was to get as many merchants as we could to apply, we chose to avoid friction and used our Store URL page. Merchants would simply enter their store URL to log in, and they would have successfully applied.
Although the solution supported our goal, the Store URL page presented an important usability challenge: it was so efficient and frictionless, we worried merchants wouldn’t notice that they had completed their task.
Uncertain or confused users tend to call Support for reassurance. It’s not only costly; it’s bad UX because it erodes trust.
Using content to reduce ambiguity
Here’s how we used content to reduce the risk of uncertainty caused by our solution.
On the landing page we:
- Incorporated a keyword from our Store URL page
By including “log in” on the page’s primary action, we set the expectation that merchants would have to log in to successfully carry out the task.
- Connected the keyword with a compelling call to action
The task was to apply for early access to Shopify Fulfillment Network. “Log in to apply” clearly described that merchants would successfully apply by logging in.
- Clarified the audience
By using the words “log in to apply,” we were able to make it clear that this button was for existing Shopify merchants.
Ending our journey
We built a system empathetic to merchants that aligned with our business goals. But our job wasn’t done. We had to leave merchants feeling like they had a positive experience while setting accurate expectations for the future.
Step 3: Confirming success
We agreed that once merchants had logged in with their store URL, we’d take them to a success page in their store admin. A crystal clear message would help merchants feel confident they had completed their task.
Because applying to the fulfillment network through our Store URL page was fairly frictionless, we needed to let merchants know:
- They’d successfully applied to be considered for early access to our fulfillment service.
- We’d collect information about their business to decide whether it was a good fit.
- They’d be contacted by email within 48 hours.
- Getting accepted to the network wasn’t a guarantee.
Although the solution made sense for our linear experience, showing the success message in merchants’ store admin presented another usability challenge: merchants would be in a familiar space but would have never seen that success page before. We worried the solution would conflict with their expectations and create uncertainty.
Using content to boost user confidence
Here’s how we used content to manage merchants’ expectations, reduce the risk of uncertainty, and confirm their task was done.
On the success page we:
- Confirmed the task was successful
The word “success” is quite reassuring if there’s a risk users aren’t convinced they successfully did something.
- Used keywords from previous touch points
Consistency is key to building trust, so we reused the word “applying” from the call to action in the title to confirm that merchants had completed their task to apply.
We also included the name of Shopify Fulfillment Network so there would be no confusion as to what merchants had applied for.
- Confirmed their identity
Another way to let our merchants know we had received their application was to personalize the message by naming them.
Making visual design compromises
Compromises are hard to make. We believed visual design should play a bigger role on the success page to make merchants’ journey feel even more connected. Including some visual cues from the page in the success page could help merchants feel more confident that they had completed their task as expected.
While it seems simple, it was a controversial idea: repeating visual design from the website in the Shopify admin didn’t align with our style guide, Polaris. There was no precedent for it.
Our opinion was that the style infraction was negligible in this scenario. It was unlikely merchants would ever feel the need to find their way back to that success page. It was more important for the differences between channels, teams, and styles involved in the journey to stay invisible to merchants.
We passionately advocated for this. Some colleagues agreed with us, others didn’t. In the end, we lost the argument because it was inconsistent with our system style. We committed to the solution, and moved on. We had at least made sure content would play a strong role in creating a unified experience for merchants.
One connected team, one connected experience
Did we ship perfection? No. Are there parts of this experience we still think of revisiting? Yes. But creating connected experiences is also about:
- Joining forces across teams instead of focusing on who owns what, to create a journey for your audience that is integrated and seamless between channels
- Committing to a solution as a member of one team, in spite of compromises you may need to make in order to achieve a common goal
What matters is that the project was successful. We needed a group of several merchants to put Shopify Fulfillment Network to the test, plus candidates to grow our fulfillment service over time.
Drumroll: we exceeded our early access goals!
The bottom line: being passionate, having a vision, and advocating for users is everyone’s responsibility, not just the UX team. But when team members disagree on the best solution, remember that you all want what’s best for the audience — assume positive intent. So go ahead, bring your expert opinions to the debate, but be ready to make compromises and be flexible enough to recognize when it’s time to disagree and commit to move the project forward. Have strong opinions, but don’t hold on too strong. If you don’t ship it, you won’t learn, and you won’t achieve your goal.
The inner workings of the company should be invisible to our users. How we’re organized, which team controls what part of the experience — none of that matters to our users, so it shouldn’t matter to us. Let’s sew the seams of our diverse channels and teams. Let’s unite and combine our talents to create experiences for our users that are truly connected, seamless, and unified.
