Running Phaser as a Chrome Application

When I was testing out different mobile platforms for my new Lynda.com course, HTML5 Game Development with Phaser, I wanted to also explore how everything runs in both desktop and mobile browsers. Just pulling something up in Chrome for Android (for instance) works wonderfully… but you have to deal with browser chrome.

I found a neat way to get around that and allow use of the prepared icon set to function as a shortcut to launch the game inside a nice, simple Chrome engine instance without all the browser UI.

WindowsTaskbar This works for Chrome, in both the desktop (Windows 8.1, above) and mobile Android. I cannot speak for OSX or iOS… and haven’t tried other browsers either.

screensflow
On Android…

  1. Use the Chrome browser to navigate to the URL of our Phaser game.
  2. Hit the Android SETTINGS button and choose “Add to homescreen”.
  3. The shortcut (using our prepared icon!) will appear on the homescreen.
  4. Use this to launch a chrome-less version of the game!

windowsshortcutFor desktop…

  1. Use the Chrome browser to navigate to the URL of our Phaser game.
  2. Enter Chrome settings and choose “Create application shortcuts…”.chromedesktop You can add the shortcut to either the Desktop or the Taskbar (or both) in Windows. 
  3. Click “Create” and the shortcut (using our prepared icon!) will appear at the selected locations.
  4. Use either to launch a chrome-less version of the game!