1. Home
  2. All Components
  3. Puzzle Game Component

Puzzle Game Component


What Is the Puzzle Game Component 

The Puzzle Game Component enables you to create a customizable drag-and-drop puzzle Marketing Game. You can define the puzzle’s difficulty by adjusting the horizontal and vertical grid size. You can also change the puzzle image to make it align with your brand identity and marketing campaign’s theme.  

What steps are involved in playing the puzzle game 

  • Click or Touch to Grab: Users can select a puzzle piece by clicking on it with their mouse or tapping with their finger. 
  • Drag to Move: While holding down the mouse button or touching the screen, users drag the selected puzzle piece to the desired position. 
  • Drop to Swap: Users must release the mouse button or lift their finger to drop the puzzle piece. It will swap places with the piece at current position. 
  • Repeat Until Complete: Users continue dragging and dropping pieces until the puzzle is complete. You can add an image or pattern to guide players in placing the pieces in the correct order. 

How to Configure 

This section will guide you through the configuration options available for the Puzzle Game Component, helping you design an engaging online game for your marketing campaign. 

Game Settings 

  • Puzzle Image: Set the Puzzle Image. Ensure that the image has a square aspect ratio. 
  • Horizontal Grid Size: Set the horizontal grid size for the puzzle. Ensure that the size is a positive value. 
  • Vertical Grid Size: Set the vertical grid size for the puzzle. Ensure that the size is a positive value. 


Use the actions to bind with your custom button. 

  • Reset: Reset the puzzle game with a fresh randomized puzzle position. 


  • Puzzle Completed: Triggered when the puzzle is completed. 
Updated on April 30, 2024

Was this article helpful?

Related Articles