#onboarding example

by Taige Zhang

Facebook is rolling out a new feature called Graph Search. It's in beta right now and not available to everyone (request early access at Graph Search) but if you're eager to take a look, we'll show you what Graph Search looks like.

I also want to highlight Graph Search's first time user experience. It's interesting to see how web companies launch new features. I think this feature tour is excellence because its minimal yet effective. Let's see how they expose their new feature to users.

Once Graph Search is made available to you, you'll see the "take a tour" tooltip on your FB newsfeed. Click on it to start the tour. 

Then FB introduces you to the search bar UI and asks you to make your first search while greying out the rest of facebook. Like Google, it auto suggests some searches for you.  

Next, Facebook explains how you can use simple phrases to further explore the search item you are interested in.

It tells you this is where friend summaries and relationships are displayed.

Finally, the interactive product tutorial is over. It now asks you do your own search and gives some examples.

This is a video of the Facebook Graph Search Tutorial.

--

Facebook reached 1 billion users in October 2012. That's a lot of users. I think many people are interested in how Facebook tours its product and onboards users. Let's see how this world-class company onboards...

1. Facebook Sign Up Process. These days Facebook pushes you to sign up if you go to facebook.com or profile pages including fan pages. They present you to a modal popup with a sign up form and if you try to take action such as message, you'll be directed to a plain sign up page.

Profile page - Login in or sign up modal popup

Profile page - after you close modal popup

Profile page- redirect page when you try to interact with person or organization

  2. Sign Up Funnel. Once you've signed up, Facebook puts you through 3 important funnels that will greatly increase the value of Facebook for the user i.e. convert new users into active users.

1. Find your friends

And when you try to skip find your friends

2. Fill in Profile info

3. Set your Profile picture

3. Facebook's Timeline Product Tour. Once you've completed the onboarding tasks, Facebook give you the option to take a tour. The tour is semi-interactive. For example, you can upload a profile picture directly from the product tour, but not upload a cover photo, add information about yourself, nor post stories.

1A. Profile picture - if you haven't uploaded a profile picture, you can do it from the tour.

1B. Cover Photo - introduces user to cover photo.

2. Add your basic info - points out where you can find your basic info.

3. Tell your story - highlights where you can post stories.

Lastly, Facebook also provides a way for users to re-take the tour.

Conclusion. Facebook and Google+ both also have excellent videos and feature pages that gets users excited and invested in the idea. See feature pages of Google + and Facebook Timeline.

These great companies have also taken another step to increase conversions by building custom interactive tours that teach users how to use the applications inside the application itself. The best way to teach someone how something works is in context (i.e. in-application.) Both these companies are addressing the issue of onboarding users properly. Showing users where things are within the app is a lot more effective than showing it on a video; however, where they fall short is actually letting users complete the tasks during the tour. For example, you can't actually edit your profile or share stories during the tour. Facebook seems to want users to complete tasks during the tour given it has added the functionality to add a profile picture within a tooltip; yet it may be difficult or unprofitable to build a custom jQuery tour solution that allows other tasks such as sharing a story.

I wonder if they have heard of Kera, a simple way to create and deploy interactive tours for your web application.