Spinners give your audience an engaging way of interacting with your brand. Try an example, HERE!

1. Create an experience and open up a screen in the Screen Editor

2. Click on ‘Add Element’ from the left hand menu, and add your Spinner by clicking the ‘Spinner’ button

   

3. There are several unique design controls for Spinner elements. Start by modifying the number of panels in your Spinner. 

   

4. Change the Indicator and Border Color if desired, as well as the Border Width on your Spinner

   

5. Use the next section to change the label and color of each panel 

   

6. Manage the odds of users landing on certain panels by clicking on ‘Edit Spinner Landing Odds.’ This will open up a menu where you can adjust the likelihood of a user landing on a certain panel using percentages. If the percentages that you set do not add up to 100% you won’t be able to save. 

   

7. You can also use the controls on the left hand menu to modify the text, the positioning of the Spinner, as well as the size of the spinner too. 

8. Once you are done customizing the look and feel of your Spinner, move on to setting up Overlay Responses by clicking on ‘Overlay Responses’ from the left hand menu. These are optional but they will allow you to display a customized 'answer bar' or a 'full screen' overlay to your audience depending on the panel that they land on. You are also able to control how long an Overlay Response displays before users are auto-advanced to the next screen by adjusting the ‘duration.’ 

   

9. Make sure you save all of your changes and navigate back to the Builder Map. You will see a branch off of the screen for each Spinner panel. This will allow you to send users down different pathways or to customize content for users based on what they spun.

Q: How do I add unique pop-up messages to each panel?

A: You can add a unique pop-up message to each panel by adding Overlay Responses to your screen. From the screen editor, click on 'Overlay Responses' on the left hand menu. This will bring you to a menu where you can customize the look and feel of your Overlay Responses for each panel. Refer to step eight within this article for more details!

Q: How do users advance to the next screen?

A: By default, after a spin is complete, the user will advance to the next screen after two seconds. You have the ability to adjust this duration. For example, if you want a user to wait five seconds before advancing to the next screen, then click on 'Overlay Responses' from the left hand menu within the Screen Editor. Enter '5 seconds' for the duration on each panel. You can modify the duration without adding an Overlay Response message.

Q: Whenever I land on a certain panel, I see a blank Overlay Response, but I did not add an Overlay Response to that panel.

A: If you plan to add an Overlay Response to one panel, then you should add one to all of your panels. If you choose the 'Full Screen' option, for example, but you don't add a message for each panel, then when users who land on a panel without a customized message will see the 'Full Screen' overlay color flash without any messaging.

Q: How can I send users down different paths based on what they landed on?
A: Each panel option has its own pathway which can be viewed in the Builder Map. To send users down specific pathways based on which panel they landed on, you can disconnect that panel pathway and connect it to a unique screen.

Q: Why use a spinner?
A: Spinners are fun to use! Some of the top use cases include:

1. Product Giveaways: use a spinner to giveaway a randomized product or service.  For instance, users can spin to win VIP tickets and have the rest of the panels be ‘Nope’, or giveaway randomized product samples.  

2. Discounts:  use a spinner to offer differing discount codes.  For instance, 30% OFF may be given out to 5% of users, where 10% OFF could be given to 95% of users. 

3. Pure engagement: the possibilities are endless:

   1. He loves me, he loves me not

   2. Future predictor - kind of like an 8-ball, where you ask a question and it provides a an answer

   3. Randomized outcome:  Which product would I buy?  Who knows, let fate decide! 

   4. ‘What should I do today?’ - give users a variety of actions such as ‘read a book’ or ‘watch a space documentary’

• Template Gallery

Keywords: spinner, product giveaway, discount codes, randomization