Intercom Tours help Koan’s product team deliver timely onboarding across our entire platform. Here’s how it all comes together.
A product with users is a product that has spent countless hours setting them up for success. Koan is no exception: our mission to help every team work with purpose has included investing in various aspects of onboarding, support, and in-app coaching.
Already being huge fans of Intercom for engaging existing customers’ support requests, we were thrilled when Intercom announced Tours in April. It provided us with the perfect tool to prototype, test, and refine our onboarding experience for new users.
More on that shortly, but first, let’s see if this sounds familiar…
Paved with Good Intentions?
Your team has spent hours honing the perfect design, carefully considering each interaction your users will make on their journey to success. You’ve provided everything they might need to immediately understand every step put before them—great design needs no explanation, right? ...then? It ships to production. And meets users face to face. 🤞
Even with diligence and care, a well designed app will often be introducing new concepts that require deeper explanation. This is especially true when the app is mapping a complex knowledge domain onto streamlined ways of accomplishing the tasks within it. For the more complex topics, the solution is often documentation in a knowledge base. But for delivering quick insights in-context, what solutions are available?
Your Destination is on the Right
The usual suspects, in no particular order:
Dedicated takeovers, often including a carousel or slides
Progress bars and checklists
The classic, humble tooltip
Guided tours using coach marks and in-app cues
To ensure a seamless onboarding experience for new Koan customers, we’ve leveraged these patterns in the form of a welcome message for setting context and communicating value; a simple, multi-step “handshake” for initial setup; and a success checklist to help users with inviting team members and entering their objectives and key results.
But, we found a gap between our “handshake” and “getting started” steps that needed filled with a thoughtful “walkthrough” step. For us, this includes introducing users to key concepts in our system such as Reflections, OKRs and Feedback. Serendipitously, Intercom launched Tours around the same time we made the decision to proceed with revamping our on-boarding experience.
Why Intercom Tours?
We already enjoy using Intercom Messages and Inbox for customer support and, well, they had great timing with their release of Tours! We happened to be evaluating other options at the time Tours was released and it solved a few lingering problems and concerns we had:
Sorting out who should see a specific on-boarding content is solved by combining rules based off the custom attributes we already have in the system for each user, such as how many teams the user is a member of and when they signed up.
The Tours editor allows control of content to be moved out of code, so updates can be made by anyone on the team.
We can send individual Tours to customers via chat to help solve a specific situation.
When things do go wrong with a Tour—because, this is the web, after all—it degrades gracefully when it detects missing elements, allowing your users to continue as they would have without the Tour in place.
There's something for everyone on the team to enjoy! And if you’re already an Intercom customer, these are quick wins.
Not only are Tours quick to create, target, and publish, but perhaps best of all they’re flexible thanks to the ability to share them via web links. This allows you to send them as replies in Messages within the Intercom platform, add them to emails, share them on social media—or even tie them together across multiple channels. Use them for on-boarding, use them for launching new features, use them for support situations. Maybe even use them for adding easter eggs!? Get creative!
The Editing Experience
The editor Intercom provides allows you to build up a Tour from individual steps which may include text, images, video, and basic interactions like clicking buttons and entering text. Each step may be modal (what Intercom calls a “post”) or attached to a specific element on the page (a “pointer”). In the latter case, the editor allows you to point and click elements to select them.
Under the hood the editor uses CSS selectors to target these elements. While not strictly required (unless you’re using hashed or otherwise dynamic class names) you may want to add “data-intercom-target” attributes anyway, due to how the editor highlights them, seen as the elements with pink outlines in this short video:
Of the three Tours we currently have published, all are hovering near 50% completion rates with a second-step engagement rate of 74% on our post-signup Tour. Encouraging numbers which are in line with and exceeding the average 64% engagement rate Intercom claims for their user base at large!
Probably the biggest thing we stumbled over initially was due to being such an early adopter—we started working on our first Tour the week Intercom released the feature! In the few weeks that have followed, they’ve rapidly shipped crucial missing features and some nice-to-haves:
The ability to “Duplicate” a Tour, which is useful due to a current lack of versioned history for edits
One sorely missing feature is branching. Currently, you'll need to use custom attributes to target slight variations—which makes Duplicate extra useful. Even then, we could really use a feature that allows branching based off which elements are currently visible, such as including an extra step to open our toggleable sidebar menu if it is closed.
If you’re doing significant testing of a Tour after you’ve published it, you may want to Duplicate the Tour so the analytics don’t get skewed.
Mind how youre bootstrapping the Intercom integration. Tours needs to have everything rendered before it can target the elements—if it isn’t there yet, Tours definitely can’t see it!
Intercom Tours was a timely solution for us at Koan, providing the right tool for the job at the right time. We’re enjoying the ease of use it brings with a set of features which is simple yet sufficient. It lowers the friction involved with content authoring and provides a quick route to deployment.
Also, I’d like to thank the Intercom customer support reps and engineers who fielded our questions along the way: Janelle, Annie, Samir, Andrew, and many others behind the scenes. Cheers and thanks much for a great addition to the Intercom suite!
Beyond the onboarding tour, Koan helps leaders reinforce strategic processes at every level of their organization through great practices like OKRs and status updates! Get started at koan.co.