▶Sagar Web Games

Home › Devlog

One game, every screen: how we design for phones and computers

2026-11-02 · Sagar Studio

Most of the people who play our games hold a phone upright. Many others sit at a computer with a wide screen, a mouse and a keyboard. We do not build two versions of a game: each game is one program that rearranges itself for the screen it is on.

Layout that changes with the screen

Every game has a layout step that runs whenever the screen changes size or turns. On an upright phone, a board game puts the board in the middle with the players above and below it; on a computer the same board sits in the centre with panels to the side. Buttons are sized for a thumb on a phone and for a mouse on a computer. We also keep the important parts away from the notch and the rounded corners of modern phones.

One set of controls, three kinds of input

Our games read touch, mouse and keyboard through the same small layer. A racing game steers with on-screen buttons or by tilting the phone, and with the arrow keys on a computer. A puzzle game is played by tapping or clicking. When two people play on one phone, each half of the screen listens to its own finger, so both can play at the same time.

Quick to start

The first page of the site is small, so it opens fast even on a slow connection. A game's own code and art load only when you open it, and the art is drawn by the game itself instead of being downloaded as large pictures. That keeps most games ready in a few seconds.

Testing on real sizes

Before a game is published we play every mode, to a win and a loss, on a phone-sized screen and on a desktop screen, and look at every screen for anything that overlaps, gets cut off or is too small to tap. It is not glamorous work, but it is the difference between a game that works on your phone and one that only works on ours.