SaaS Product Welcome Page: How to Create an Engaging Experience

Creating a great first impression always counts – particularly in the SaaS world.

That means it’s critically important to get your welcome page right: you need to ensure it grabs your user’s attention, informs, and engages them.

That’s no mean feat. But in this article, we’ll look at how to craft welcome page designs that knit together into a cohesive onboarding experience.

TL;DR

• A product welcome page is the screen (or series of screens that greet your user when they open your app).
• A welcome page has two critical aims: to relay a welcome message which shows users they are using the right product and to boost engagement (and therefore product activation).
• There are three things to think about that help get your welcome message across: not leaving any of the empty states ’empty’ (i.e. customize with personal details), using modals where appropriate, and choosing to ‘show’ value by slotting them into the customer journey rather than just telling.
• When putting together a welcome page, there are lots of tactics to deploy to enhance the users’ experience, boost activation, and increase your opportunity to retain users.
• Focus on personalizing the welcome page, tailoring the onboarding process, using branching experience, and using modals rather than leaping straight to using a detailed product tour: a single page designed well, can do just as good a job.
• Another asset to include on a welcome page (in the right situation) are in-app messages. They are one of many tools designed to get users to their ‘aha’ moment faster.
• When you do decide to use product tours, keep them brief, and give users the option to skip them.
• Gamification, help widgets, and pre-populating with sample data are interactive options to consider including on a welcome page: all of them help engage users.
• Ready to start creating great product onboarding experiences for your users and properly welcome them? Get a Userpilot demo and see how we can help.

What is a welcome page?

In a nutshell, you can think of your product welcome page as the ‘front door’ to your application.

It usually consists of one (or a small sequence) of pages that greet your user when they open an app.

The most effective welcome pages look to focus a user’s attention on your core value proposition quickly while simultaneously getting them up to speed with how your product works practically.

A welcome page has two critical aims:

• To show your users they’re in the right place
• To boost activation and get new users to engage with your product

The welcome page sets the right expectations about the product

Building on our ‘front door’ analogy from earlier in the article, it’s important you give your users a sense of comfort and familiarity with your welcome page – as soon as they open their app, they’ll be asking themselves whether they’re in the right place if not.

A blank loading screen offers very little context, compared to an engaging welcome page (or series of pages).

The welcome page design prompts users to take action and increases activation

Once your new users are feeling confident they are using the right application, the next step to take is to draw them in with the design of your welcome page.

Think about how to tempt a user into taking the next action – because ultimately, you want to draw your users in, encourage them to engage with your product and features, and boost user activation.

Why? Because the activation point is typically defined as the tipping point where users start to get value from using your product.

It has a massive impact on revenue: as per the table below, you can see that by boosting activation by 25%, you’ll see a corresponding spike in revenue of 34%.

3 ways to make sure your welcome message gets across

So we’ve covered what a welcome page is, and the impact including one can have on whether your product is successful or not.

For savvy product managers, there are some critical principles to consider to ensure you get the most bang for your buck from a welcome page.

Let’s explore them.

Don’t leave the empty state empty

We spoke earlier about how un-engaging a blank loading screen was: once the app has loaded, as soon as the user sees your welcome page and it’s empty, they freeze.

They should instantly see a degree of personalization for their first-time experience: the minimum bar you should look to meet is referring to them by name.

There are many ways to take this further: think about their role, their use cases, and the sort of plan they’ve decided to go with.

You might think a personalized welcome page is ‘nice to have.’

But in fact, it’s an important way of reducing unnecessary churn. If you have a blanket message – for example, ‘upgrade to a free plan’ – then it’ll jar with users on a premium plan. And that could be enough to encourage a user to leave.

By customizing your empty screen page based on the valuable data you’ve gathered during signup, you’re automatically proving you have an understanding of who the user is, what they need, and that you have what it takes to meet those needs.

Greet new users with a welcome modal

Greeting your users with a simple message conveying your core value proposition – using a modal is a must-have for new users.

Show users the product value with demo content

“Show, don’t tell.”

The aphorism applies perfectly to the SaaS world.

Particularly for complex products within specific use cases, blocks of text are never going to properly convey the value your app offers. Instead, you need to use your welcome page as a way of demonstrating how your product works.

Using demo data that the user can play around with helps tremendously.

It’s a proven way to get users to experience an ‘Aha’ moment quickly, enabling those users to join the dots and set their expectations about how to navigate the product. Mixpanel does this really well.

How to create engaging first time experiences with welcome pages

With that set of principles in mind, this section of the article is going to dive into some specific tactics you can use when creating welcome pages that engage, entice, and activate new users.

Reiterate your value proposition while new users wait for the app to load

Don’t view a loading screen as ‘dead time’.

Take advantage of having your customer’s attention by hammering away your value proposition: Userpilot does a great job of this with an engaging graphic.

Personalize the first screen users see – don’t leave them staring at a white space

While some degree of personalization is essential – as we mentioned earlier, new users will expect at least their name to be populated.

But what’s more important is personalizing their first-time experience with relevant information and guidance for their specific use case.

We can see a fantastic example of creating different content that addresses different use cases below from Slack: this is about showing a new user what a new workspace is all about.

A fundamental tenet of effective communication is ‘if you’re speaking to everyone, you’re speaking to no one.’

That should inform how you think about crafting a welcome message.

You’re not flying blind here: you can use the data you collect during signup to craft an engaging series of welcome pages.

The flow below from Asana shows the range of information you might look to capture: their team name, their key activities, knowledge level, team members, and more.

Then use the data to personalize the empty screen with the information you’ve gathered to give then an excellent first impression of your application.

Start with a welcome modal rather than pushing users into a product tour

The first thing that comes to mind for many people when they think about welcoming new users: a product tour.

While there are certainly use cases for that type of functionality, in many situations a welcome modal is a much simpler way to do the job.

You have two options here.

If you’ve collected details during signup, you can do a bit of personalization here, reiterate what your product does, and encourage the user to take their first action.

Userpilot asks users to install the Chrome extension – which enables them to start realizing value from the tool.

If you haven’t gathered user data already, then you can actually do that within your welcome page using a microsurvey (like Postfity below).

Use in-app messages to get users started on the right foot

Using a modal is a great way of enticing your users in: but after users engage with it, what’s the next step?

You can use in-app messages, checklists, and tooltips as a way of pointing your users towards the functions that’ll help them get the most from your product.

Userpilot uses a ‘getting started’ checklist as an effective mechanism for driving users to take the next effective step.

Aim to deliver a fast AHA moment

We spoke briefly about an ‘aha moment‘ earlier in the article: the tipping point where things suddenly become clear to new users.

As a SaaS owner, you should be trying to craft welcome pages which propel users towards that moment as quickly as possible. It’s all about reducing time to value.

There’s lots of value to learn from how Calendly set up their welcome page.

Calendly lets a user book a test appointment with themselves, which reduces any anxiety about setting up a pointless meeting while demonstrating how easy to navigate Calendly’s simple UI is.

It’s a great balance of getting users deeply involved with the primary function of the application – booking meetings – without the anxiety of booking a call with a real colleague.

Offer new users a personalized experience with a branched user onboarding flow

No two users will experience your app in exactly the same way. Depending on their primary needs, their role, and a range of other factors, they should have vastly different experiences.

Let’s explore how Notion uses personalization to enhance its onboarding flow.

By figuring out whether a user is part of a team or a solo user, they can then make the call about whether to let them skip unnecessary steps and choose how they’d like to navigate your app.

This works for a complex tool as well.

The screen below from Jetadmin (a no-code tool) showcases how to do this neatly.

Make product tours an optional part of the user onboarding flow

Where a single welcome page can sometimes do the job, there are times you might feel a more detailed product tour is the only thing that will do the job.

Remember that you should always have the utmost respect for your users’ time: so if you do include a tour, then you should endeavor to keep it as brief and punchy as possible, and always include an option to skip it.

Give your users autonomy and let them take the lead to ‘trigger’ a tour, rather than auto-playing.

If we look at the flow from Heap, once a user has completed signup, they are shown a welcome screen with a clear prompt to take an action (in this case, setting up a dashboard) – and offers an optional tour explaining how to do it.

Display sample content on your welcome page and reduce user paralysis

Taking the first step in a new application can be daunting.

Using test data (or sample content) – as we can see below on a ‘Getting Started’ screen in Notion – can be a fantastic way to help your users grasp the product.

It means they don’t have to think about what format or structure to use, and helps them to make a quick start.

If you don’t want to get into that level of detail, another smart UI tip is to include brief instructions using sample content, that blends seamlessly into the UI.

Gamify the welcome page for better engagement

The last thing you want to do is bore your users.

Gamification can be a powerful tool to help deliver value sooner: it can enhance the onboarding experience by making it fun for users to pick up and nail tasks quickly.

ProdPad offers users a chance to extend their trial simply by taking different actions in the product itself: it’s a win-win.

Why?

Because the more time a user spends in ProdpPad, the greater the chance they’ll experience some value from using it.

Add a help widget on your welcome screen for instant support

Widgets are interactive tools that can help users get the most out of your application. Heap, below, has a widget that triggers an in-app resource center (and access to support via chat option).

While it’s great to have different options, the screen feels a little cluttered. A more effective UI decision would have been a simple ‘help’ button – then including multiple help options in the resource center.

Conclusion

In a hyper-competitive market, it’s incredibly important to give your users a great impression from the start.

The very first step they take in your product should feel natural and comfortable – and that means putting a great deal of time, effort, and attention into your product welcome page.

In this article, we’ve explored what a welcome page is, where you’d look to use them, and the principles of deploying them effectively.

But be mindful there isn’t a silver bullet: when crafting onboarding experiences, you need to think about all the tools at your disposal – and make decisions based on the context.

Want to build product experiences code-free? Book a demo call with our team and get started! Check out the banner below for more details.