Designing an intuitive user flow for inviting teammates
If you’re working on any sort of SaaS product that involves collaboration, it's vitally important to get the invite flow right.
It needs to be frictionless, but also well communicated and secure. It’s tricky to get right and there are plenty of edge cases to consider.
There are two common approaches used and Airtable is a SaaS product that uses both well. Let's go through how they do it, starting with the "invite by email" flow:
Invite by email
Invite by email is the default option in modal, which makes sense because it’s what people expect.
Before you send the invites, you can add an optional message and set the access permissions.
Some products opt to keep it simple by excluding the message option and deferring the access controls until after the invite is sent.
Personally, I like the optional message option because it lets you add more context. I also think it’s worth including access controls before the invite is sent, because that way it's clear that the people you invite won't be able to do anything you don't want them doing.
Airtable does a good job of adding these options without increasing friction. The optional message field is deemphasized and the access permission has a reasonable default.
"Owner" or "Creator" could mean different things in different products, so it's important to describe what they mean properly in this context (which Airtable also does well).
When your invite is sent, you can clearly see its status, but you can also fix any mistakes by cancelling the invite or updating the access permissions.
The invite email includes the invite message and does a good job of explaining what Airtable is and what to expect when you sign up.
The sign up page includes the invite message, a short description about the product, and a pre-filled email field, which makes it less likely for the invitee to drop out.
Once the invitee has signed up, they land on the Airtable dashboard with the workspace they were invited to in clear sight.
Some sort of welcome message or onboarding guide could be helpful here.
One thing many other products don't do is let the person who sent the invite know that the person they invited has signed up and is ready to collaborate. In this case, Airtable goes a step further by incentivising more invites with credits.
At this point the invite by email flow is complete. It's super straightforward and intuitive for both the person doing the inviting and the person being invited.
Invite by link
Inviting 10+ people by email would start to get tedious, which is where the option of using an invite link comes in. Although this option makes it way easier to invite more people at once, there are some security issues to consider.
For example, if an invite link somehow ends up being shared outside of the organisation, people would be able to sign up and see/share sensitive information.
Airtable make their invite links more secure in a couple of ways. Firstly, you can generate and cancel multiple invite links.
For example, you could generate a link, share it in Slack, then cancel it once you've seen that your teammates have signed up.
There's also an option to make the invite link only work for people who sign up with their work email. Let's take a look at how that flow works.
The first step is generating the share link. Before we generate the link, we can set the default access permissions for anyone who uses it.
We can also make it work for any email address or only with email addressed with a certain domain. We continue with the more secure option.
Once the link has been generated, we still have the option to delete it or change the default access permissions.
This is the page anyone who clicks on the link sees. At the top, it clearly states that we can only sign up with specific emails and by doing so we will get access to the "UX Design" workspace.
The email field has a "@uifeed.com" placeholder email, which is a lovely touch.
If you enter an email that doesn't use the uifeed.com domain, an error lets you know that you won't be able to sign up.
Once you've signed up, you don't actually get access to the workspace you were invited to. Instead, you go through the onboarding flow like a new user.
That's because until you verify your email address, Airtable has no way of knowing that you actually have access to a "@uifeed.com" email address.
The message at the bottom of the page lets you know that you have an invite pending and that you need to verify your email address to use it.
Once you've verified your email, you can access the workspace you were invited to.
This is the end of the "invite by link" flow. This option makes it easier to invite multiple teammates at once, but is slightly less intuitive for the people being invited.
Considerations with either approach
With either approach, there are a couple of potential issues to consider.
For example, it makes sense to only let people give others access permissions which are less than or equal to their own. As "Creator," I can't give anyone else "Owner" permissions.
Another thing to consider is how to deal with teammates and workspaces if the owner wants to delete their account. There are pros and cons depending on how you handle this. I've come across products that don't allow the owner to delete their account until they've removed teammates from it.
In Airtable's case, deleting your account while you own workspaces with teammates will not delete the workspace.
This type of scenario is where things get tricky. For example, it's unclear here who becomes the owner of a remaining workspace when the owner deletes their account. I don't know how best to handle these edge cases, but the earlier in the process they're considered, the better.
Designing the invite flow can be tricky, but it's vital to get right if having a good experience with your product relies on collaboration.
The most common and straightforward approach is inviting via email. When doing this, let the person doing the inviting add an invite message and set access permissions. Also, let them know when the person they invited signed up.
Consider adding the "invite by link" option if your customers invite many people at a time, but think through the security and UX implications of this approach.
If there's anything I missed or you have strong opinions about how the invite flow should work, I'd love to hear from you.
While Airtable's invite flow example is the best I've come across, you can learn more by checking out recordings of invite flows from a whole bunch of other SaaS products here.