The first version of our site had four games in it and none of them were pleasant on a phone. Every swipe meant to steer a snake also scrolled the page. The Tetris controls sat underneath a leaderboard, two screens below the board. The Breakout paddle lived exactly where your thumb was, so you could never see it.
The fix was to stop treating the games as part of a scrolling page. On a touch screen, starting a game now turns its section into a full-screen play mode: the page stops scrolling, the board is sized to the screen, the controls sit directly under it, and Android's back button takes you out again. In landscape the controls move beside the board, like a handheld.
Drag anywhere, not on the paddle
Breakout's paddle now follows the movement of your finger anywhere on the screen rather than its position. Your thumb can rest on the empty middle of the screen and the paddle stays visible at the bottom.
Testing with real touches
Mouse events are not touch events. Our test suite sends genuine touch input through the browser's DevTools protocol on a 360 pixel phone, a Pixel, a landscape phone and an unfolded Galaxy Fold, and checks that each game opens full screen, that the board and pad are fully visible, and that drags, taps, swipes and the back button all work. It caught a start button sitting just below the fold on small phones before anyone else did.
Every studio site has a contact form and a guestbook nobody signs. We wanted a wall that changes because people played, so ours is a game of Pentris: Tetris with the twelve pentominoes, the shapes you can make from five squares.
The rule is simple. When you top out, the bottom five rows of your board become the starting wall for the next player, signed with your initials. Clear a row someone else left behind and the feed says whose row you broke through. You are always playing against the mess the previous visitor made.
Small details that mattered
A hold slot and a three-piece preview make pentominoes fair; five-square pieces are much harder to place than four. A bonus for tight fits rewards the satisfying lock where a piece slots into a gap it was made for. A daily board gives everyone the same pieces and the same starting wall for a day, with its own leaderboard.
Pentris on the site: twelve five-square pieces, a hold slot and a three-piece preview.
Our studio's idea is that every game you grew up with was made of squares, so the homepage headline is made of them too. We set the line "We make games your thumb can't put down" in a heavy display face on a tiny hidden canvas, read back which pixels are filled, and turn each one into a brick.
Until you touch it, the game plays itself in attract mode, like an arcade cabinet in a shop window, and the bricks it breaks grow back. Move your mouse over it or tap it and it becomes yours. Clear the headline and the next level is a boss: our logo, built from armoured bricks that take three hits.
Why make it playable
Because the first thing a game studio's site should prove is that we care how things feel. The ball has a trail, the screen freezes for a few frames on a big hit, the combo colour heats up, and every brick has a sound. All of it is synthesised in the browser, so nothing extra downloads.
