Aloha Bay: Tile Match | 500 Levels HTML5 Puzzle Game

Tile Match: Aloha Bay HTML5 Game

Tap three of a kind. Empty the pile. 500 levels on one beach.

Tile Match: Aloha Bay is a complete triple tile matching game built with the PlayCanvas engine. Tiles are piled up on the sand. Tap one and it drops into the wooden tray at the bottom of the screen. Get three of the same face into the tray and they clear. Empty the pile and the level is won. Fill all seven places in the tray without a match and it is lost.

The pile is stacked, so a tile under another tile cannot be taken until the one above it goes. Buried tiles are drawn dark so the player can see at a glance what the board will accept. Blocks of ice crack a stage at a time as sets are cleared, and striped beach towels flip open and shut over the tiles they cover.

The game opens directly on a level and deals the next one as soon as one is finished. There is no menu to walk through and no session to set up.

Game Features:

• 500 levels. Boards are composed at runtime from the level number, so the game has no level data file to download and a level always deals the same board
• A difficulty curve stored as measured data: tile count, stack depth and number of colours are set per level
• Ten tile faces on a single texture atlas, with seven of them picked per level so neighbouring levels do not look alike
• Stacked boards up to 114 tiles, with buried tiles dimmed and untappable
• Two obstacles: ice that cracks over three stages, and towels that flip open and shut as tiles are collected
• Three boosters. Fetch lifts a buried tile into the tray, Clear Away takes a whole set off the board, Turn Out reshuffles the faces. Each one refuses and refunds when there is nothing it can do
• A tutorial on level one that puts a finger on the tile it is talking about and waits for the player to move
• An idle hint that points at the tile which completes a set, not just any free tile
• Win screen, fail screen and a level intro card, all with their own artwork
• Portrait and landscape support with a separate painted backdrop for each
• Particle effects driven by a Unity prefab parser, so the effects are data rather than code
• No build step. 71 ES modules loaded natively by the engine, with no bundler and no toolchain to install

What You Get:

• The complete PlayCanvas project, ready to import and edit in the browser
• A playable HTML5 build that runs on any static host
• This documentation, covering the architecture, the rules and every value worth editing
• All source code, uncompiled and commented

Technical Requirements:

• Desktop browsers: Chrome 90+, Edge 90+, Firefox 88+, Safari 15+, Opera 76+. Internet Explorer is not supported.
• Mobile browsers: Chrome for Android 90+, Samsung Internet 14+, Safari on iOS 15+. Tested on iPhone SE to iPhone 15 Pro Max, Pixel 7 and iPad.
• Desktop and mobile from one build. Mouse and touch are both supported, and the layout keeps its proportions in portrait and landscape.
• Graphics: WebGL 2.0 with a WebGL 1.0 fallback. Hardware acceleration must be enabled.
• Hosting: any static file server. No PHP, no Node.js, no database, no build step — upload the folder and open it.
• Server note: .mjs files must be served as text/javascript. The documentation includes a troubleshooting section with the one-line fix for Apache, nginx and IIS.
• Size: about 15 MB on first load, cached afterwards. Online for the first load only.

Ready to publish as it is. The tiles, the backdrops and the characters are ordinary image assets, so the whole game can be moved to another setting by replacing files and editing one table.