Skip to content

Liquid Hopscotch in play

Floor · Foot sensor, Touch, Mouse

Liquid Hopscotch

Step on a numbered tile and the colored liquid inside splashes away from your foot — a hopscotch floor with nothing to explain.

Surface: Floor projection or a touch panel/monitor, 16:9. 1920×1080 recommended; other 16:9 sizes fill the picture and other shapes get black bars.
Input: A touch panel or touch monitor works as it is, no LiDAR sensor needed; a mouse works for testing. Several people at once need multi-touch. To play on the floor, add a foot sensor that sends touch signals, such as an MP Series floor unit (drivers not included).
PC: Windows PC with Chrome or Edge (one-click kiosk launcher included), or Chrome on a Mac, plus speakers for the sound. No internet needed.

Free · Windows & macOS · 19 KB · Download appears right after the form

See it with real people

In real use

See it with real people

A player hopping across numbered tiles on a small portable floor unit at an exhibition in Korea.

Filmed in Korea on an earlier build, so any on-screen text is in Korean. The evaluation build is in English.

Watch on YouTube See more real installs

Who it's for

Made for spaces like yours

Kids cafés, family entertainment centers and mall play zones
Family days, fairs and brand events that want an activity with no instructions
Lobbies with a floor projection that should look alive between visitors

What it does for you

For you and your visitors

Nothing to teach: no score, no rounds, no words on screen. Visitors can hop from 1 to 8 or just stomp around; the board answers every step and does not check the order.
Several people can play at once on a multi-touch sensor. Each foot is tracked on its own, and holding a foot down keeps pushing the liquid.
It never looks switched off: with nobody on the floor, one tile gives a small silent ripple every few seconds.
Set up in minutes, run it yourself: it runs offline, and a staff panel on the Esc key turns the board to face your entrance and sets splash strength and volume. A six-tile board and a no-numbers option are one setting away.

One step on tile 3: its liquid scatters away from the foot and swells while the other tiles stay calm.

Four feet down at once: each is tracked on its own, and a foot held in place keeps pushing the liquid away from it.

One setting changes the board to six plain rectangles, each with its own colors and liquid thickness.

With the numbers turned off, the floor is only color and moving liquid.

The default direction: set for a floor walked left to right, so on a screen like this the numbers lie on their side. A setting turns the board in 90-degree steps.

Staff press Esc to turn the board and set splash strength, drop size, reaction speed and volume.

Hardware

Runs on MP Series

Runs on MP Series floor units, or on any 16:9 projector with a floor sensor that sends touch. It also runs on a touch panel or touch monitor, with no sensor.

See the MP Series

Make it yours

Change it yourself, or let us

These settings live in customize/config.js inside the download. Edit, save, reload.

Setting	What it changes	Default
Board`board.layout`	"hopscotch" = eight tiles in the hopscotch shape. "tiles" = six plain rectangles, each with its own colors and liquid thickness.	`hopscotch`
Board direction`board.rotation`	0, 90, 180 or 270. At 90, tile 1 is at the left and numbers read upright for someone walking left to right. Also on the Esc panel.	`90`
Numbers`board.show_numbers`	false = no numbers, only color and liquid.	`true`
Splash strength`liquid.speed`	How far and fast a step throws the liquid (0.2–3).	`1.4`
Drop size`liquid.drop_size`	Size of the drops (0.5–2.2).	`1.0`
Reaction speed`liquid.reaction`	How quickly drops swell, change color and calm down (0.3–3). Lower = a slower, heavier feel.	`1.3`
Idle ripple`liquid.idle_ripple_seconds`	With nobody on the floor, one tile gives a small silent ripple this often (1–60 seconds). 0 = off.	`4`
Sound`audio.enabled`	true/false. All sounds are generated in the browser.	`true`
Volume`audio.volume`	Sound volume from 0 (silent) to 100.	`50`
Background sound`audio.ambient`	Soft chord and water wash under the step sounds (true/false).	`true`
Hover as step`input.hover_as_step`	true = moving the pointer counts as a step, without pressing. Only for a sensor that moves the mouse pointer and never presses.	`false`
Hide mouse pointer`display.hide_cursor`	Hides the pointer over the board for kiosk use; set false while testing with a mouse. The Esc panel always shows it.	`true`
Your logo`logo.file`	Path to a PNG or JPG placed in the folder (e.g. customize/logo.png), shown in the middle of the board and turned with the numbers. Empty = no logo.	empty
Logo size`logo.height`	Logo height in pixels on a 1920×1080 picture (40–400); it scales with the window.	`160`

Need more than settings?

Your logo and colors, another language, your own questions or content, or a new piece on the same idea.

Specs

Technical details

Package size: Windows & macOS: 19 KB 19,684 bytes
Operating system: Windows & macOS
Entry file: index.html
Resolution: 1920x1080
Orientation: Landscape
Offline: Yes, no internet needed
UI language: English
Input: Foot sensor, Touch, Mouse
Players: Several at once (multi-touch)
Session length: Free play — no rounds
Version: 1.1 · built Nov 2, 2026

Checksums (SHA-256)

hopscotch-liquid-tiles-all.zip4b9a1ab4d2e01cc6ab9c1032fa4fd4f40dfc9f08171cd7524b8244d1cafd3b2c

Related pieces

You might also try

Floor · Foot sensor, Touch, Mouse

Floor Aquarium

Turns a floor into a living reef: each step ripples the water and sends schools of 3D fish scattering.

Free evaluation buildEnglish

Floor · Foot sensor, Touch, Mouse, Keyboard

Piano Floor

Thirteen giant keys on the floor: step to play, and frogs, squirrels and deer pop up as the music goes.

Free evaluation buildEnglishReal use

Floor · Foot sensor, Touch, Mouse

Balloon Pop

Balloons rise across the floor and players stomp them for points: chase a top-10 score alone, or race a friend on mirrored balloons.

Free evaluation buildEnglish