# How to make a browser game that works on phones

## Most people will try your game on a phone, so it needs touch controls, a layout that fits a small screen, and sound that starts after a tap. Go Bananas builds these into every game it makes.

A browser game runs on phones with nothing to install: the player opens a link and plays. But a phone is not a small computer. There is no keyboard, the screen can be 320 pixels wide, the processor is slower, and some browsers refuse to play sound until the player touches the screen. This guide explains what changes on a phone, what Go Bananas already does for you, and how to test and improve your game on a real device.

## What changes on a phone

**Touch instead of keys.** Arrow keys, the space bar and the mouse don't exist. Every action needs something to tap, drag or swipe, and fingers are less precise than a mouse pointer. A button that is easy to click on a laptop can be too small to hit with a thumb.

**Small screens.** The narrowest phones are about 320 pixels wide in the browser. Score counters, health bars and menus that fit comfortably on a monitor can cover half the play area on a phone. Players also turn their phones sideways, so the game has to adjust when the screen changes shape.

**Performance.** Phones have less memory and slower graphics than most computers. Large images, heavy 3D models and photo-real 3D scenes load slowly and can make a game stutter.

**Sound after a tap.** On iPhone, a web page can't play sound until the player has touched the screen at least once. A game that tries to play music before the first tap stays silent.

## What Go Bananas builds in

When Go Bananas makes a game, the AI is told to treat phones as a requirement, not an afterthought. Every new game is meant to work on screens as narrow as 320 pixels. In practice, that means:

- **Touch controls that match the game type.** 3D games get a virtual joystick on the left side of the screen, drag-to-look on the right, and action buttons about 60 pixels across. Board games use tap-to-select, with touch targets of at least 40 pixels.
- **Buttons big enough for a thumb.** On-screen buttons are at least 44 pixels, a common minimum for comfortable tapping.
- **A HUD that stays out of the way.** Scores and status text are kept off the play area, and their font sizes scale with the screen instead of staying fixed.
- **Sharp graphics on high-density screens.** The game canvas fills the screen and is scaled for the phone's pixel density, so it doesn't look blurry on modern displays.
- **Resizing when the phone turns.** Games react when the window changes size, so turning the phone sideways reshapes the layout.
- **Taps where you expect them.** Touch positions are converted to the game's own coordinates, so a tap lands where your finger is, even on a scaled canvas.
- **Sound that works on iPhone.** Every game gets a sound helper that unlocks audio on the first tap and follows the site's mute button. You don't have to write any special code for it.

None of this is guaranteed to be perfect for every idea, so test your game on a phone before you share it.

## Playing full screen

Inside a game, open the game's **Menu** and choose full screen. On phones that don't allow a web page to go full screen, Go Bananas tells you so and suggests turning the phone sideways instead, which gives the game more room.

## Adding Go Bananas to your home screen

You can add Go Bananas to your phone's home screen so it opens like an app, without the browser's address bar. Where the browser supports it, Go Bananas offers to install itself. On iPhone, it shows the steps to do it from Safari, and if you're using another browser on iPhone, it asks you to open the page in Safari first, because only Safari can add it to the home screen there.

## Testing on a real phone

A desktop browser's phone preview is a good start, but it doesn't show how controls feel under a thumb, how fast the game loads on mobile data, or whether the sound starts. Test on a real phone:

1. **Published games:** open the game on Go Bananas and use the QR code ("Scan to play on mobile"). Point your phone's camera at it and the game opens on the phone.
2. **Drafts:** a draft is private, so the QR code isn't offered. Sign in to your account on the phone and open the game from your drafts.
3. Play for a few minutes with the phone upright and sideways. Check that every button is easy to hit, that nothing important is hidden behind the score or the menu, and that the sound starts after your first tap.
4. Try it on mobile data as well as Wi-Fi if your game uses large pictures or 3D files.

## Asking for phone-specific changes

If something doesn't work well on a phone, describe the problem in the edit chat in plain words. Be specific about what you saw and where. For example:

- "On phones, the jump button is too small. Make it twice as big and move it to the bottom right corner."
- "The score text covers the top of the board on a small phone. Move it to a thin bar above the board."
- "Add on-screen left and right arrows for phones, and hide them on computers."
- "When I turn my phone sideways, the game doesn't fill the screen. Make it resize to the new screen size."
- "The 3D scene is slow on my phone. Use fewer trees and simpler shadows on phones."

Edits usually take under a minute, and each one is saved as a new version, so you can go back if a change makes things worse.

## Keeping files small for phones

The files you add to a game have the biggest effect on loading time. A few rules of thumb:

- **Pictures:** use pictures no bigger than they appear on screen. A background shown at 1,080 pixels wide doesn't need to be 6,000 pixels wide. WebP files are usually much smaller than PNG or JPEG at the same quality. See [WebP files in browser games](/formats/webp).
- **3D models:** GLB is the best format for 3D models. Keep the number of polygons and the texture sizes modest. FBX models uploaded to Go Bananas are converted to GLB with their textures shrunk to 512 by 512 pixels, which helps on phones. See [GLB files in browser games](/formats/glb).
- **Photo-real 3D scenes (Gaussian splats):** these look impressive but are heavy on phones. Go Bananas thins them when you upload them, to 500,000 points for PLY files and 300,000 splats for SPZ files, but they can still be slow on older phones. See [PLY files in browser games](/formats/ply).
- **Sound:** every audio upload is converted to a compressed MP3, and each file is limited to 5 MB and 120 seconds, so sound rarely causes loading problems.

## A quick phone checklist

Before you share your game, check that:

- Every action can be done by touch.
- Buttons are easy to hit with a thumb.
- The score and menus don't cover the play area on a small screen.
- The game resizes when you turn the phone.
- Sound starts after the first tap, and the mute button silences it.
- It loads in a reasonable time on mobile data.

## Related

- [How to make a video game](/guides/how-to-make-a-video-game)
- [Game design basics](/guides/game-design-basics)
- [How to describe a game so the AI builds what you want](/guides/how-to-describe-a-game)
- [How to make a 3D game](/guides/3d-games)
- [Adding sound and music to your game](/guides/sound-and-music)
- [How to make a multiplayer game](/guides/multiplayer-games)
- [How to publish and share your game](/guides/publish-and-share)
- [Make and play games from ChatGPT or Claude](/guides/chatgpt-and-claude)
- [All file formats](/formats)