We’re Knock. 👋 We give engineering and product teams the tools they need to build delightful notification experiences into their products. In this post we cover how we designed our onboarding experience to help teams get started in Knock as quickly as possible.
We believe in self-service products at Knock. We want any developer, engineering manager, or product manager interested in building a better notification experience for their customers to be able to sign up for Knock and see what it can do for them.
But making your product self-service comes with its own risks for you as a business. Instead of a live demo where you can respond to your customer’s questions in real time, a self-service product has to stand on its own. You have to intuit customer questions before they happen, then answer them within the context of your product.
This is where a great onboarding flow comes in.
A great onboarding flow situates new users when they arrive in your product for the first time. It tells them what they’re in your product to accomplish and the user journey they'll follow to complete it. As a product builder, it gives you a temporary staging area in your UI to help new users but doesn't overload the rest of your product with tips that regular users might find frustrating.
In this post we share a number of learnings in designing our own user onboarding flow at Knock:
- building your onboarding flow around a single magic moment
- designing your in-app onboarding flow to help users reach that moment
- the out-of-app onboarding tools you can use to help get them there
Our onboarding experience has been a big part of helping our customers find value with Knock and we hope it does the same for yours.
Start with one goal
A great onboarding flow is an act of focus and discipline. It chooses a single objective for a new user and then helps them reach it. If you can only choose one goal to direct a new customer towards, you want it to be experiencing the magic moment of your product.
The Knock magic moment is when a customer sends their first notification using our product. It doesn’t have to be a notification sent in their production environment, a test notification is fine. We designed our onboarding flow to help our new customers get to that moment in as few steps as possible.
Here’s a walkthrough of our onboarding flow. It takes our users through the three key steps and concepts required to start sending notifications in Knock, and then helps them send their first notification using our product. At the end, we give them a nudge towards how to start sending that same notification in production so they can get real value out of our product.
Five ways to help users in your onboarding flow
Guide users to action with context
Knock is a product used by both developers and their product manager counterparts. Because of this, we wanted our onboarding flow to give users all of the context they need when they're directed to complete a given action.
The first step of our onboarding flow is a configuration setup that can only be performed in our dashboard. We give the user an affordance to “Create a channel” and use a small tag in the upper right corner to show them this takes place in the dashboard.
Compare this to the next step of our onboarding flow which our customers perform via the API. Here, the affordance links to our documentation on identifying users via our API (and we include a “For developers” section that includes their secret key, so they don’t need to go looking for it and get distracted from the task at hand.) Again, we’ve used an “API” tag in the top-right corner to help give the customer context as to where this step will take place.
We found inspiration for this contextual onboarding flow from Stripe, which does a great job of giving developers the resources they need in context when onboarding their products.
Choose the path of greatest learning. The “identify users” example above presents a good learning moment about maintaining focus in an onboarding flow and helping users learn what they need to. Though our customers can create users in our dashboard for testing purposes, here we guide them to do so via the API as that’s the method customers use when they ship Knock to production.
In this case, we chose to surface a single method in our onboarding flow, rather than present a choice to the user. This gives them less to think about and helps keep them on track to get to our magic moment.
Show your user the progress they’ve made
This is a common best practice for onboarding flows. You want your customer to have a clear answer to “how many steps do I have left to complete?” and “how many I have completed so far?”
For our onboarding experience, we pulled inspiration from Shopify’s onboarding flow. Within the onboarding flow alone, there are multiple elements signaling which items you’ve completed, from the progress bars in the top right to the navigation tabs of the onboarding flow itself.
An important detail about our progress bar: it records a user's progress, even when they don't complete an action within the flow itself. That way we don't waste our users' time with completing redundant actions in the onboarding flow that they've already completed elsewhere in our product.
Make it easy to get back to onboarding materials
A given user’s onboarding journey is never a straight line. People naturally will want to explore parts of your product as they learn more about it. With that in mind, your onboarding flow should be easy to get back to.
At Knock, we include our onboarding flow as a sidebar navigation item so it’s easy for users to get back to. You’ll notice that we’re also including a progress indicator here to nudge them towards completing the flow and reaching our product’s magic moment.
Let users opt out
Some prefer to learn in their own way, and that’s cool, too. There’s nothing worse than an onboarding experience that you have no choice but to click through, or that hangs around in your UI forever.
We give customers a handy button for dismissing our onboarding experience either when they’ve completed the onboarding flow, or simply want to figure it out on their own.
Keep it short, with off-ramps to explore advanced features
It’s tempting to keep adding steps to your onboarding flow. Your product is great and you want to keep showing it off to your new customer. Resist the urge to do this. You want your onboarding flow to feel manageable to users, not like a never-ending to-do list.
We cap our onboarding flow at five steps. Once our customer has gotten to the end of that, we let them know where they can keep learning about our product and a good next goal for them to progress towards (shipping Knock to production).
What happens outside of your product
So far this post has focused primarily on the onboarding flows that happen within your product. It’s important to remember the other tools you can use to help new customers find value when signing up for your product.
Your sign up flow
Your sign-up flow is a great resource for helping your users opt-in to materials that will help them find value in your product. We’re huge fans of Linear at Knock and used their own sign-up flow for inspiration for our “Stay updated” page below. The page links to a number of potentially helpful resources, including our Slack community and Twitter profile.
Your notifications
Knock uses a few different types of notifications to help users get into the app and find value once they’ve arrived.
Invite emails
We send users invitation emails when they receive an invite from another user. We use Knock to build smart delays into any reminders that should be sent to a user who hasn’t logged in after a few days.
Magic link emails
We use passwordless authentication to help our users get into Knock. It’s more secure and they don’t need to remember what their password is for future sessions.
Request access emails
In enterprise software, new users often need access to their organization’s account when they first sign up for the product. Our join account flow lets them do this by sending an access request to the owner of the account.
Welcome notifications
Finally, once a user gets into our app, we use our in-app feed to welcome them to our product in real time. This includes a single CTA to visit our documentation. After this message is sent, we send a welcome email with a number of helpful links to get started in Knock.
In summary
All onboarding experiences have one thing in common: they end. And now this post will, too.
Our onboarding experience has helped our customers find value with Knock faster and give us better feedback about our product. We hope this post helps you do the same.
If you’re a product manager, a designer, or an engineer setting out to build your own onboarding flow, let us know what you thought and whether we can help.