Skip to content

Game design flow

Flow page – Intro

This page is normally the first one in the game. It should contain the commercial presentation of the prize that can be won, eventually, it can have a movie or an animated GIF image for a nicer user experience.

All pages that are not Game, Winner or Loser, should have a button or image that has a call to action for the user, and by pressing it the user will be taken to the next screen.

image.png

This button or image should have the following settings on the Content ->  Action on Click area.

  • Select action – Go to flow page
  • Select flow page  - Go to next flow page

This configuration means that on click, the user will be taken to the next page from the flow, in the order that it’s configured in the Flow Page. Specifically, how the pages are displayed in the Flow pages section.

Flow page – Game

The Game page is the one that has the Game block on it and that will allow the user to play the actual game.

Once the Game block is added on a page, it will no longer be available in the Add block -> Add-ons -> Games section.

From the Game menu only some advanced padding and display settings can be changed. Game settings are specific to each type of game (scratch, wheel of fortune, etc.), can be edited from the Game menu (CTRL+G) and will be detailed in the respective sections.

image.png

Flow page – Winner Page / Loser Page

A winner page and loser page are needed to show the user that he won the prize or lost the game. Both these pages should have a button, text or image that has the following Action on click settings. These are already set by default in your pre-loaded templates, make sure that these are not changed only if you specifically need to change the redirections to external websites or app deep links.

  • Select action – Go to URL
  • URL - #redirectUrl#
  • Target – Same window

image.png

This ensures that the game is closed when the user clicks the image/button/text. In case it’s a winning game, the user will be shown the actual prize coupon that gives 100% discount (or bonus, or other offer type).

These pages also have an automatic redirect, so that the game is closed after 30 seconds (by default) of inactivity.

The same settings are configured for the above element (button, image, or text) that closes the game. These settings are configured by default in the Lobyco templates, so nothing should be normally changed here.

  • Redirect user – checked
  • Redirect – Redirect to url
  • Redirect URL - #redirectUrl#
  • Redirect after x seconds – 20/30 seconds
  • Redirect target – Same window

image.png

You can incorporate links to external websites or app deep links to other sections of the app within your flow. These links can be attached to images, buttons, or text elements. To ensure the app correctly recognizes and processes these links, they require specific formatting. The URL schema must be changed from https:// to lobyco://. For example, instead of using https://google.com, you should use lobyco://google.com.

To set up an external link, follow these steps: - Select action – Go to URL - URL – Your URL with the schema replaced (e.g., lobyco://google.com) - Target – Same window

Important: Failing to follow this format may cause the app to malfunction and prevent game statistics from being recorded accurately.