Skip to main content

Slide Puzzle

Create your own custom slide puzzles using visual scripting!

puzzle demo

Open the Template​

To use the template in your Effect House project:

  1. Go to Templates
  2. Click the Interactive tab
  3. Select the Slide Puzzle template
puzzle template

Hierarchy​

There are two render groups in the Hierarchy panel:

  1. The UI render group contains the Counter, which calculates the number of moves taken to achieve the completed puzzle, and the Timer, which displays the time elapsed from the start until the end of the game.
  2. The General render group contains the Puzzle Tiles, as well as the completed puzzle image.
puzzle hierarchy

Assets​

The Assets panel contains the built-in assets for this template, like the puzzle piece materials and the completed puzzle image.

puzzle assets

Visual Scripting​

The Slide Puzzle Controller subgraph contains the core logic of the slide puzzle game. This is the only section you'll need to alter to customize and create your own puzzles!

puzzle vs

Each option works as follows:

  • Puzzle Texture: A custom image used as the final completed puzzle. Import and add your own textures here to create your own puzzle.
  • Texture Resolution: The length and width of the custom image
  • Difficulty: The number of times a piece will be shuffled. 1 is very easy, 5-6 is average, 8+ is difficult.
  • Show Timer: When checked, displays the timer; hides it otherwise.
  • Show Move Counter: When checked, displays the number of moves taken; hides it otherwise.
  • Show Complete Image on Win: When checked, shows the completed image on win. When unchecked, displays the tiles on win.
  • Primary Color: Alters the color of the puzzle frame and tile beveling
  • Secondary Color: Alters the frame color of the counter and timer
  • Text Color: Alters the color of the text
  • Tile to Hide (1-9, 0 for Random): Specifies which specific tile is hidden at the start of the game. Setting the value to 0 will hide a random tile.