SPACE MAHJONG STAR TILES

01

ABOUT THIS PROJECT

A challenge to create a puzzle of our choice for digital y2k escape room.

MY ROLE

I created the puzzle, the visuals and I developed it for web.

02

PROJECT DESCRIPTION

In this project I was challenged to come up with a puzzle. My inspiration was a mahjong game I used to play. I prototyped the puzzle with paper tiles and I had people playing the game like this. After each test session I made changes based on my observations until I came up with the final puzzle design, which I turned into an online playable game using html, javascript and css.

PAPER PROTOTYPE

First version of my paper prototype. Colourful tiles. The test result showed that it was too easy.

FINALISING PAPER PROTOTYPE

My prototype after making changes based on the test results. You can notice the same colour in most of the tiles and similar symbols that create confusion.

03

GRAPHIC ELEMENTS

Since the theme of the escape room was VHS 80s video games I decided to go with pixel art style for my graphics. I created the backgrounds, decorations, pixel gifs and the design of the tiles.

THE TILES

04

CODING

And finally I coded everything with html, css and javascript. I used p5.js to create a canvas and place all the tiles in a way that some are covering others and the ones underneath are inactive. Another problem I had to solve was how to make a tile inactive if it’s blocked from two other tiles from the left and right at the same time. My puzzle doesn’t have instructions, because this was the escape room criteria. But if you select two active tiles from the same kind they will disappear and eventually you will reach the game end and receive a code to open the next puzzle.

Next project