Interactive prototypes · PixiJS
Casino interfaces, playable.
Not mockups and not videos. Two things you can actually play: a HUD drawn from the product’s own design tokens, and a complete five-reel slot with paylines, wilds, free spins and a jackpot. Both rendered with PixiJS on a canvas.
Stefan PopovićCreative designer · Popzify
What it actually does
A prototype earns its name by behaving, not by looking finished. Everything below is running — the rules, the states and the edge cases included.
Reels and spin
Five reels with staggered stops, a masked scroll, and symbols written only once a reel lands — the draw is never visible mid-flight. Turbo halves every duration.
Real rules
Weighted symbol draw, five fixed paylines, pays left to right from the first reel. Three, four and five of a kind pay different multiples, and the balance is checked before every spin.
Bet and autoplay
Stepper with clamped range and a max shortcut, both disabled while the reels move. Autoplay counts down, stops itself when the balance runs out, and can be stopped mid-run.
Drawer
Paytable, settings and spin history slide in over the game. Opening it moves focus into the drawer and Escape returns it.
Controller navigation
Arrow keys move the focus ring between controls, Enter activates, Escape closes. Focus skips anything currently disabled, which is why the ring never lands on a dead button.
One token set
Every colour, radius and spacing value is the same number as in the product's theme file. Nothing here is a one-off — the system renders the same whether the pixels come from the DOM or from a canvas.
Second prototype
Fortune Gems Deluxe — the whole machine
The HUD above is the chrome around a game. This is the game: five reels on weighted strips, twenty paylines, a wild that substitutes, a scatter that triggers free spins, four win tiers and a jackpot level. Click Spin, or press space.
Play money only — no wagering and no accounts. The declared RTP in the paytable is a configured figure, not a measured one.
Open full screen ↗Reels
Five reels on weighted strips, stopping right to left with vertical motion blur and a bounce on landing. Turbo halves every duration; space quick-stops a spin in flight.
Paylines
Twenty lines, paid right to left from the rightmost reel. Winning lines are drawn over the symbols and the winning cells spark and pulse, so the player can see why they were paid.
Wild and scatter
Wild substitutes for every symbol except the scatter and pays on its own. Three or more scatters anywhere award free spins, which is why they are counted across the grid rather than along a line.
Free spins
Ten to fifteen spins at a 2× multiplier, retriggerable, with the whole scene tinted for as long as the round lasts and a summary when it ends — the player should never have to wonder which mode they are in.
Win tiers
Big, giant, massive and jackpot, chosen by win-to-bet ratio, each with its own overlay, count-up and coin shower. Autoplay stops itself on a feature or a jackpot rather than spinning past it.
One canvas, one scale
Authored at 900×640 and scaled as a whole to the viewport, so all five reels survive a phone instead of the layout breaking apart.
Let's talk
One campaign or an ongoing feed — tell me what you publish and how often, and you get a plan and a price within 24 hours.