How Beardbrand generated 150K leads with a stylish personality quiz

A personality quiz is a sure-fire way to generate leads for your business. People love finding out stuff like what film star they look like most, what their spirit animal is, or what flavor they would be if they were born as a potato chip.

Beardbrand is an example of a company that has capitalized on people’s craving for quizzes. Beardbrand, which sells beard grooming products, used Typeform to create a quiz called ‘What type of beardsman are you?’. The quiz asks a bunch of questions about the respondent’s personality. The person is then taken to a landing page revealing what type of beardsman they are—and recommends a collection of products to match. Check it out for yourself:

Beardbrand have seen almost 150,000 people taking the quiz and it’s now become front and center of the company’s home page. Check out this article on our blog where we caught up with Beardbrand founder Eric Bandholz to talk about the idea behind the quiz, and the impact it has had on his business.

Here, we dissect Beardbrand’s form to reveal how you can create such a personality quiz to generate leads for your company.

How Beardbrand created its quiz

1. Before you fire up Typeform, spend some time planning out your personality quiz. First, figure out how many personality types you want and what these are. In Beardbrand’s case, the company mapped personality types to its product ranges (urban, outdoors, badass, traveler, and vintage) to send the person taking the quiz to a particular landing page.

Think up some multiple choice questions to ask, then come up with answers that best fit each personality test. Beardbrand used five questions to assess personality type. The company added five further questions that didn’t measure anything, to double the fun without complicating the logic any further. The first two questions that measure personality type are shown here:

2. Once you’re done figuring out your questions and answers, go ahead and log into Typeform. Beardbrand kicked off its lead-generating quiz with a Welcome Screen to entice people in. The team added an image featuring some cool illustrations of beardsmen, created by the company’s graphic designer. They also capitalized the Start button text to give it more impact.

3. Now create the first Multiple Choice question, adding the question and the answers that you sketched out earlier. Beardbrand made all of its questions ‘Required’, using the option in the question settings menu. People need to answer all the questions, or it messes up the calculations later on.

Beardbrand chose to enable the ‘Randomize’ option so that the order of the answers gets jumbled up every time.

4. Next, it’s time to apply a score to each answer, using the Branching and calculations feature. The scoring system will be used later to determine the personality type of the respondent. In Beardbrand’s case, for each Multiple Choice question:

• It adds +1 each time an “Urban” personality type answer has been chosen
• It adds +10 each time a “Traveler” answer has been chosen

• It adds +100 each time an “Outdoors” answer has been chosen
• It adds +1000 each time a “Badass” answer has been chosen

• It adds +10000 each time a “Vintage” answer has been chosen

Apply the scoring system to your form, swapping out the personality types above for the ones you decided on. We’ll explain why and how the scoring system is used to calculate personality type in Step 10.

5. Now build out the rest of your Multiple Choice questions, remembering to mark them all as ‘Required’.

6. For each question, use Branching and calculations to add scores to the answers to match the corresponding personality type (i.e. remember how we mapped multiples of 10 to the corresponding trait in step four?)

Make sure the same score is given to a specific personality trait answer across the different questions.

7. Beardbrand added an Email question to capture people’s contact details and subscribe them to their mailing list. This was made optional to give folks the option to skip if they don’t want to give out their info. It can also help to improve completion rates.

8. Now to create the Endings for each personality type. A different Ending screen is shown depending on the personality type of the respondent (we’ll explain how the logic works in just a second). Beardbrand set up six Endings–one for each personality type and another generic one for non-clear-cut results.

The Endings are identical up to this point, including the block caps “Show Results” button text, along with the obligatory comedy beard GIF.

9. Here is where the magic happens. At this point, Beardbrand applies the Button link feature to each Ending to send the person to a particular product page on its website depending on the personality type they came out as.

For instance, Ending A is shown to those who come as an ‘Urban’ beardsman (we’ll explain how to do this in the next step). The URL of the landing page for Beardbrand’s Urban product collection is added to the Button link section…

… for Ending B—which is shown to traveling types—the URL of the landing page for the Traveler product collection is inserted. This same process is repeated for the other personality types and their corresponding landing pages.

For the record, the landing pages look pretty sweet:

10. So, at long last, let’s talk about how you get the right Endings to show up based on the respondent’s personality type. For this, we’ll use Logic. Don’t panic, it looks complicated at first glance but once you try it out yourself you’ll be fine:

Look back to step four, where Beardbrand set up calculations so that:

1. The “units” (+1) track ‘Urban’-related answers

2. The “tens” (+10) track ‘Traveler’-related answers

3. The “hundreds” (+100) track ‘Outdoors’-related answers

4. The “thousands” (+1000) track ‘Badass’-related answers

5. The “tens of thousands” (+10000) track ‘Vintage’-related answers.

Using this system, you can figure out many times each of the personality types were indicated just by taking a glimpse at the total score. Imagine the case where the score is a five-digit number, say 10112.

Here’s a rudimentary graphic that shows how you can figure out how many answers relating to each personality type has been chosen by looking at the units, tens, hundreds, thousands, and tens of thousands:

In the case above, the person is clearly an ‘Urban’ beard wearer, so they will be sent to the appropriate Ending, which will include the link to the landing page with the Urban beard collection. Clever, huh?

11. Now you know how the scoring system works, you need to figure out all the possible combinations of scores that would lead to a particular personality type being the dominant one.

According to Beadbrand founder, Eric Bandholz: “there were 95 different results that quiz takers could get that would link to one of the core five personalities, and the rest would go to a sixth, generic personality”.

For each personality type, map out all the possible combinations that would lead to the respondent being that type. Here’s an example of all scores that would indicate the person was a ‘Traveler’, remembering that the “tens” (+10 being added to the score) are being used to track this personality type:

It’s probably better to jot all the combinations down on a piece of paper for each of the personality types like this, before applying them to the Logic in Typeform.

If you’re still struggling to figure out the combinations, check out the examples in this article, or use our personality quiz template.

12. Now it’s just a case of transferring all of those score combinations into Branching and calculations in Typeform. This tells your form which Ending to jump to based on the personality type.

In Beardbrand’s case, they had five personality types, plus one generic one, so this meant six Logic rules were set up. The Logic should be applied to the final question, which in their case is the Email question.

Here’s an example of how the Logic looks for the ‘Traveler’ personality type, whose combinations we jotted down above.

13. Having created the questions, added the scoring, and set the Logic to move people to custom Endings, Beardbrand just had some finishing touches left. The team decided to customize the form’s theme. This would make the quiz fit with their brand and provide a seamless appearance when embedded into the Beardbrand site.

14. Beardbrand has made the personality quiz front and center of their website. The eye-catching home page features a button that takes the user to a page where the quiz is embedded.

Here’s the home page:

And here’s the page where the form has been embedded:

You’ll find all the information you need on how to embed your form into a web page like this, in this Help Center article.

Now it’s over to you…

So there you have it, the secret to creating an engaging, interactive personality quiz that will have high quality leads flocking to your product pages. Feel free to go twizzle your mustache in celebration – just make sure you clean it after – preferably using one of Beardbrand’s grooming kits.

Want a quicker way to make a personality quiz? Check out this pre-made template and customize it to your needs.