First impressions stick, particularly in UX. After we noticed that new customers of our Yoast search engine optimisation for Shopify app had been skipping key steps or dropping off early, we knew our onboarding wasn’t working. Utilizing journey mapping and repair blueprints, we redesigned the expertise to be sooner, clearer, and extra supportive from the beginning. Right here’s how small, well-timed adjustments made a giant distinction.
Launching an improved onboarding expertise
We not too long ago launched a redesigned onboarding expertise to assist Shopify retailers arrange for achievement. Behind that replace is a much bigger story: how considerate UX choices, team-wide alignment, and repair design strategies reshaped the consumer expertise. And we imply that within the broadest sense, from discovery to giving customers the sensation that the app is working for them and serving to them succeed.
On this interview, we spoke with our UX designer, Tom Ottjes, who led the venture to unpack that course of. His solutions will supply a better take a look at the issues we wanted to unravel, the instruments he used to speak throughout groups, and the omnichannel adjustments that made the most important distinction.
Earlier than you begin studying, right here’s a fast animation displaying the assorted elements of the service blueprint we labored on. In fact, there’s way more, however we can not present you the whole lot.
From patterns to priorities
Earlier than redesigning a single display screen, the crew wanted a technique to perceive and talk what wasn’t working. They wanted to uncover what needed to change to repair the expertise for individuals in a means that additionally helped us obtain our firm targets. That’s the place service design instruments, notably buyer journey maps and repair blueprints, got here in.
Buyer journey mapping helped visualize what customers had been experiencing from discovery by means of set up and first use. It highlights not solely the steps clients take but additionally the place they grow to be confused, hesitant, or drop off. Based mostly on assist conversations, surveys, and analytics, the journey map revealed a number of points. A kind of points was an absence of early steering, which led to missed configuration steps, amongst different issues.
Earlier than we moved on to motion, we needed to outline success by figuring out KPIs. That is an important step. It is going to assist form the route of the service and expertise you may be designing. As a substitute of viewing onboarding as only a UI downside, the service blueprint mapped each consumer motion alongside the methods, processes, and folks behind them. This included content material, buyer assist, notifications, and dealing inside Shopify’s personal platform constraints.
As a result of it connects what’s seen to the consumer with what occurs behind the scenes, a service blueprint turned central to the venture. It gave each crew, from UX to improvement, assist, and advertising and marketing, a shared reference level. By mapping every section as its personal blueprint, the crew may prioritize fast wins whereas keeping track of a longer-term onboarding imaginative and prescient.
It turned a posh, cross-functional difficulty into one thing everybody may contribute to. The blueprint helped make enhancements simpler to design, construct, and take a look at in smaller, clearer elements.
An actual instance: Turning uncertainty into reassurance for bigger shops
One of many extra stunning and necessary insights from our service blueprinting course of was about scale. We found that whereas the app felt quick and responsive for smaller Shopify shops, bigger ones had a really completely different expertise. For outlets with tens of hundreds of merchandise and pages, the preliminary processing and indexing step may take wherever from a number of minutes to some hours.
The issue? We weren’t telling customers that. Small shops would see their information mirrored virtually immediately. Massive shops would land on a clean dashboard, with no indication that the system was nonetheless working within the background. From the consumer’s perspective, it appeared like nothing was occurring.
We addressed this with a sequence of small however intentional adjustments. First, we launched a correct loading state with messaging acknowledging what was occurring. Then, we added an e mail discipline to that display screen, giving customers the choice to be notified when setup was full. Once they enter their e mail, they obtain a affirmation message as soon as the whole lot is prepared.
It’s a small element, however one which shifts how the expertise feels. As a substitute of confusion or doubt, customers now get suggestions, a way of transparency, and a technique to re-engage later. And for us, it’s a concrete instance of why aligning the front-end and back-end by means of service design really issues.
Meet the designer
Meet the UX designer: Tom Ottjes
This interview is with Tom Ottjes, considered one of Yoast’s UX designers. He led the onboarding redesign for our Shopify app and was co-responsible for designing the Yoast AI options. With a number of years of expertise working throughout product and advertising and marketing, his method facilities on translating consumer habits into actionable design. A lot of his work focuses on simplifying complicated flows, enhancing consumer steering, and serving to groups perceive the client journey.
Tom, what downside had been you seeing that made this venture a precedence?
With our Yoast search engine optimisation for Shopify app, we try to ship actual, tangible worth to our customers. That begins with understanding their expertise from the second they set up the app. By means of a mixture of consumer surveys, interviews, assist request evaluation, and product analytics, we started to see clear patterns emerge.
There have been three fundamental friction factors we stored listening to and seeing:
- An absence of steering: Many customers merely didn’t know use the app successfully. They put in it however weren’t certain what to do subsequent to optimize their retailer.
- Unclear worth supply: We seen that essential steps, like finishing the ‘Website illustration’ settings, which unlock rapid search engine optimisation advantages, had been usually skipped. That informed us customers weren’t seeing the connection between setup actions and actual outcomes.
- Hesitation to interact with the free trial: Customers had been cautious of testing the app, not sure of what the trial included or whether or not it was really risk-free.
All of those insights pointed to at least one factor: the onboarding expertise wasn’t doing its job. It wasn’t guiding, reassuring, or demonstrating worth early sufficient. We visualized all these points in an in depth buyer journey map, serving to us to zoom out and see broader patterns. We discovered completely different consumer varieties, the place they dropped off, and what confused them. That map turned a key alignment device and helped us body the onboarding redesign as a top-priority venture.
What would success seem like for you from the consumer’s perspective?
From the consumer’s standpoint, success meant feeling assured and supported from the very first interplay with our app. We needed customers to land within the onboarding circulate and instantly perceive two issues: how the app will help them enhance their Shopify retailer’s search engine optimisation, and what steps to take first to see outcomes.
That meant providing a smoother, extra intuitive expertise. An expertise that clearly communicated worth upfront, supplied improved steering round preliminary setup steps, and highlighted key options. It also needs to guarantee customers that making an attempt the app was protected and worthwhile.
First, we needed to assist customers shortly perceive the complete worth of the app. As well as, we needed customers to finish key onboarding actions comparable to filling out their ‘Website illustration’ settings and exploring core options related to their retailer. Emotionally, we aimed for a way of readability, belief, and motivation to proceed.
In the end, if a consumer may say, ‘I do know precisely what this app does, what I must do, and I can already see it working for me,’ then we knew we had been heading in the right direction.
Are you able to clarify your service design course of and the way it helped the groups?
After mapping the present onboarding journey and figuring out the important thing ache factors, we knew we didn’t simply want a greater UI. We wanted a extra holistic service expertise. That’s the place service blueprinting got here in.
We began by defining clear KPIs to measure the impression of our adjustments, comparable to completion charges for vital onboarding steps, time to worth, and have discovery. These metrics gave us a shared definition of success and helped form the route of the consumer expertise.
Then we used the service blueprinting methodology to reimagine onboarding as an entire service. A service blueprint maps the relationships between individuals, processes, and touchpoints tied to a buyer journey. It helped us visualize each what the consumer sees and the whole lot occurring behind the scenes to assist that have, from content material technique to buyer assist workflows to engineering necessities.
This systems-level view was important in aligning a number of groups, like UX, improvement, advertising and marketing, and assist. Everybody may see how their work linked to the consumer’s expertise and the place coordination was wanted. It additionally helped us establish inside gaps, inefficiencies, or dependencies early, so we may design round them.
To maneuver shortly and ship worth incrementally, we broke the optimized onboarding journey into phases, prioritizing what would have essentially the most rapid impression for customers. That method lets us ship enhancements sooner whereas staying grounded in a long-term imaginative and prescient for the onboarding expertise.
We approached the entire effort utilizing a service design mindset. We zoomed out to know the system customers work together with, not simply the screens they see. Service blueprinting helped us take what customers had been experiencing (empathy and perception), establish inside blockers, and construction releases round clear hypotheses. It wasn’t nearly delivering onboarding, however about enhancing the service behind it.
How are you monitoring whether or not it’s serving to customers get began sooner?
From the beginning, we knew that redesigning onboarding wasn’t nearly launching one thing new. We needed to show it made a distinction. So, we outlined clear KPIs to measure the impression of our adjustments. To make this measurable, we constructed the monitoring infrastructure wanted to observe consumer habits at every step.
However we didn’t cease at numbers. We additionally included qualitative buyer listening instruments, issues like in-app suggestions, assist conversations, and interviews. As we needed to know how customers really feel as they transfer by means of onboarding.
Are there nonetheless enhancements to make?
Completely, as a result of onboarding isn’t really ‘completed.’ It’s an evolving expertise, and we see it as a steady alternative to raised assist our customers.
The following section of our optimized onboarding journey will concentrate on deepening the steering we offer, serving to customers transcend setup and begin making extra significant enhancements to their retailer. We’re how we are able to higher floor insights, recommend subsequent steps primarily based on context, and empower customers to unlock much more worth with confidence.
Whereas I can’t share all the small print simply but, I can say this: we’re not stopping at getting customers by means of the door. We’re centered on serving to them thrive as soon as they’re inside.
Good issues are coming. As all the time, we’re listening intently to our customers to verify what we construct really meets their wants.
Professional suggestions for getting began with service blueprinting
Pondering of utilizing service blueprinting in your personal work? Right here are some things that helped us:
- Begin with an actual journey: Mapping is most helpful when it’s grounded in precise consumer habits. Use assist information, interviews, and analytics to anchor the blueprint in actual issues.
- Outline what “success” means upfront: Earlier than mapping, align your crew on what outcomes you’re working towards (e.g., sooner time to worth, fewer drop-offs).
- Map front-end + back-end: Don’t simply monitor what customers see. Embody inside methods, assist workflows, engineering dependencies, and something that influences the expertise.
- Maintain roles seen: Present which crew is chargeable for which course of. It retains conversations centered and collaboration smoother.
- Don’t overcomplicate: A blueprint doesn’t should be a refined artifact. Begin easy. The worth is in getting groups aligned, not in the way it seems.
Blueprinting doesn’t change good UX analysis or design, however it’s a robust technique to join them to the broader expertise. In case you’re engaged on something cross-functional, it’s completely price making an attempt.
A shared understanding drives actual change
This venture wasn’t nearly delivery a brand new circulate. We needed to design with a transparent, shared understanding of our customers and the processes that assist them.
Our service blueprint turned out to be an ideal device to align groups round a single purpose: serving to customers shortly see the worth of the Yoast search engine optimisation for Shopify app. Alongside the best way, we uncovered friction, mapped dependencies, and constructed towards one thing extra constant, supportive, and efficient.
Considerate onboarding is the beginning of the whole lot that follows. By making these early minutes really feel clear, calm, and grounded in actual outcomes, we’ve not solely improved setup instances and reached our KPIs but additionally modified how we work, design, and pay attention collectively.
The work continues, specializing in function onboarding, improved steering, and even future WordPress experiences. Collectively, we’ll apply these classes any longer. We’ll design by placing customers first, construct teamwork on transparency, and create experiences that information, not simply onboard.
