Play Stack Tower

A colorful timing game built with plain JavaScript and canvas. Tap to drop each sliding block and stack the tower as high as you can. Play solo or duel a friend.

This is a real, playable game, not a screenshot. A block slides across the top of the tower and you tap to drop it, keeping the overlap and shedding the rest. It is built with no library, just a render loop, a rectangle overlap test, and a tower that scrolls, which makes it a clean example of timing and intersection. After you play, the sections below show how it works.

How to play

A block slides back and forth across the top of the tower. Tap the board, click, or press Space to drop it. The part that lands on the block below stays, and any overhang breaks off and falls, which makes the next block narrower. Time it so the block lands squarely, and if you nail a near perfect drop the width is kept and you score extra. Miss the stack completely and the run ends. In Solo you build as high as you can. In the 2 player duel you take turns adding to the same tower, and whoever can no longer land a block hands the win to the other player.

How this game is built

Stack Tower is a tiny lesson in timing, intersection, and a moving camera.

The sliding block and the loop

The active block moves a little every frame and bounces off the edges, a steady motion driven by the game loop. Its speed rises as the tower grows.

The drop and the overlap

When you drop, the code finds the overlap between the falling block and the one below, keeps that slice, and sheds the rest. Finding where two rectangles intersect is the same maths as collision detection.

A tower that scrolls

Rather than move a camera, the tower is drawn relative to its height, so each new block pushes the rest down the screen and the action stays in view, a simple take on the rendering in rendering.

Score, turns, and the end

The height, the perfect bonus, whose turn it is, and the game over state are plain values the screen reads, the heart of game state management, and your tap is one well timed input.

Why timing and a steady loop matter

This game lives or dies on the gap between what you see and when you tap. That same responsiveness is what separates an app that feels instant from one that feels laggy: a steady update loop, input handled the moment it arrives, and no wasted frames. It is the practical side of the loops in realtime systems. When the drop feels fair, the loop and input are doing their job.

Frequently asked questions

How do I play Stack Tower?

A block slides across the top. Tap, click, or press Space to drop it onto the stack. Overhang falls off and narrows the tower, so line each block up and try to build high.

What is a perfect drop?

If you drop a block almost exactly on top of the one below, no overhang breaks off, the tower keeps its full width, and you earn a small bonus. Chaining perfects is the key to a tall tower.

What is the 2 player duel?

Two players take turns adding blocks to the same tower. Each good placement scores for that player, and when someone can no longer land a block the other player wins on score.

How does this relate to real programming?

It models a steady update loop, a rectangle intersection test, and input handled the instant it happens, the same building blocks behind responsive interfaces and game engines.