Guides

Games

Suggest Edits

📣 Games are only supported on web and iOS. Android will be added at a later time.

Games are marketing levers to engage users and create excitement as part of the shopping process. They allow customers to earn prizes such as extra discounts, free delivery, etc.

Feature Overview

Game Popup

  • User landing on the website will see a popup for the game as soon as they log in
  • The popup gives the users the option to play or dismiss it
  • You can configure an interval for the next appearance of the popup (for dismisses)

Game Mechanics

  • Users can interact with the game and play
  • The popup may present various prizes available to win

Prize Award and Redemption

  • After playing the game, users are shown the prize they've won and instructions on how to redeem it.
  • All prize awarded are saved in the system for tracking purposes. See Game Results

Limitations

  • Users are restricted to playing each game only once

Game Types

Spinning Wheel

Configure different prize displays and probabilities for each prize display. User will spin wheel on the initial modaland their prize will be revealed (with confetti!) on the results modal. If user prompts the wheel again after they've played, the already played modal will display. 📣 It is best practice to configure an even amount of prizes for this game.

  1. Initial modal:
  1. Results modal
  1. Already played modal

Mystery Offer

Configure different prizes and probabilities for each mystery offer. User will reveal mystery offer on the initial modaland their prize will be revealed (with confetti!) on the results modal. If user prompts the mystery offer again after they've played, the already played modal will display.

  1. Initial modal
  1. Results modal
  1. Already Played modal

Detailed Rules and Guidance

Game Priority

  • For given dates, do not enable more than one game. Games are sorted by start date and games with a closer start date will be shown first.
  • Only one game per game type is supported at once. For example, there should never be 2 enabled spinning wheel games with overlapping dates, because only the one with the closer start date will appear.
  • We do support having one of each game type enabled at once. If a spinning wheel and mystery offer are both enabled, the game with the closer start date will display first. After the user plays the first game, the second game will be shown following the regular display rules.

Game Display

  • Customers must be logged in in order to see the game popup
    • If a customer’s session is still valid, the game will display as soon as they land on the site
    • If a customer’s session has expired or if the customer is a guest, the game will display after they log in or create an account
    • Critical pages where games are never shown, to avoid disruption of the shopping process:
      • Checkout
      • Order confirmation
      • All Account pages (including order history)
  • Customer can only play once per game. After they have played, the game will not be displayed again unless they click on a module to trigger display
  • When a customer clicks on a module to trigger the game:
    1. If the customer is logged in:
      1. If customer hasn’t played before → game is displayed (initial modal)
      2. If customer has played before → results modal is displayed (i.e. prize won by the customer)
        1. Result modal will have additional copy “You've already played! See your prize below.”
    2. If customer is in guest mode → triggers the login/create account modal. After the customer logs in/creates an account, game is triggered according to the rules above (see If the customer is logged in)

Foxtrot Configuration

Games: List View

When a user navigates to the Games page, user will see a list view of all created Games.

  • Type: Type of game. Either Spinning Wheel or Mystery Offer.
  • Name: Name of the game
  • Enabled: Shows if the game is enabled
  • Start Date: Start date of the game
  • End Date: End date of the game
  • Game Results: Link to the game results page filtered on that game

Games: Filter

  • Search and filter by Game Name
    • Case insensitive and partial search accepted

Games: Create and Update

To create or update a game, navigate to the Games page in Foxtrot

  • Select Create New Game to create a new game or click on an existing game to update settings

    • Type: Type of game. Either Spinning Wheel or Mystery Offer.

    • Name: Name of the game

    • Enabled: Shows if the game is enabled
      📣 For given dates, do not enable more than one game. Only one game at a time is supported.

    • Start Date: Start date of the game

    • End Date: End date of the game

    • Interval: If user dismisses the game without playing, Interval defines the time (in seconds) until the game can be shown again to the customer
      📣 We recommend to set the Interval to at least 86400 seconds (24 hours) in order to avoid spamming

    • Modal Background Color - Mystery Offer Only: Background color for display of mystery offer game.

      • This will be defaulted to the primary hex code color for your organization.

    • Terms & Conditions: Terms and conditions that display at the bottom of all game modals.

      • This will be defaulted to "Limit 1 per customer. Prize availability may vary. Terms apply."

    • Prizes: Add prizes available for customers to win

      • 📣 To optimize UX of the Spinning Wheel, add an even number of prizes. We recommend 12 prizes for the best display.
      • 📣 User is allowed to add up to 20 prizes

    • Prize Display - Spinning Wheel Only: Display shown on the segment of the wheel. Customer-facing field

      • Max 22 characters
      • Example: “10% off coupon”
      • Example: “Win an air Fryer”
      • 📣 We recommend to keep Prize Display as short as possible as there is limited space on the wheel segment. In particular, keep in mind that the wheel is also shown on smaller mobile-web screens.

    • Probability Percentage: Probability of the customer to win this prize

      • Enter 20 for 20%. Decimals are accepted
      • 📣 Sum of all prize percentages must be equal to 100%
      • 📣 In case a prize is not available anymore, we recommend to change the percentage to 0 instead of deleting the prize
      • With percentage = 0 , the prize will never be won but will still be displayed as a segment of the wheel
      • For tracking and UX purposes, avoid deleting prizes after the game has started

    • Results Copy: Display shown on the results modal after the customer wins the prize. The purpose of this field is to inform the customer of the prize won. Customer-facing field

      • Example: “Congrats, you won an air fryer!”
      • Example: “Congrats, you earned 10% off! Use promo code TENOFF.”
      • 📣 To give a promo code as a prize, you can include the promo code to use in this field (see example above). The promo code must be created ahead of time separately. Customers must also apply the promo code at checkout similar to any promo code. Auto-apply is not supported
      • 📣 For physical prizes, informing customers via message/email and prize delivery must be handled manually and outside of the system

    • Results Subcopy: Secondary display shown on the results modal after the customer wins the prize. We recommend to use this field for terms related to the prize or to share details with customers on how to get the prize. Customer-facing field

      • Example: “Promo code expires on 31th December. One use per account.”
      • Example: “Details on how to redeem your prize will be sent to you by email within 48 hours.”

  • CTA View game result (top left): After the game is created, you can view game results by clicking this button

Game Results: List View

Admin user can see results of each game to track prizes won by users. In addition, this information is also available on the Periscope BI tool.

This page can be filtered by customer email, game name and game ID.

  • Timestamp: Time and date the customer has played the game
  • Type: Type of game. Either Spinning Wheel or Mystery Offer.
  • Customer Email: Customer email
  • Game Name: Name of the game
  • Prize Display: Refers to the Prize Display set up on the game for the prize won by the customer
    • Prize display only applies to the Spinning Wheel game type.
  • Probability Percentage: Refers to the Probability Percentage set up on the game for the prize won by the customer
  • Results Copy: Refers to the Results Copy set up on the game for the prize won by the customer
  • Result Subcopy: Refers to the Results Subcopy set up on the game for the prize won by the customer

Games & Pages

Admin user can set up page modules to trigger games on homepage and landing pages.

Homepage modules supported

  • Carousel module
  • Tabular module

Landing Page modules supported

  • Landing Hero Banner

📣 Admins must use the modules above. Other modules are not supported.

Instructions

  • Set CTA Type = URL
  • Set CTA Reference = /spintowinto prompt the spinning wheel
  • Set CTA Reference = /mysteryofferto prompt the mystery offer

Customers clicking on the module will trigger the respective game. See Detailed Rules and Guidance for details.

Updated about 1 month ago