How to port an existing game to mobile?

Phaser 2 / CE
1

Hey everybody,

I’m a college student who had to teach himself how to use Phaser for a project, as well as Javascript since I had no experience with either technique.
It went rather well and I have a rather decent space invaders clone that I coded myself step by step.
The problem is that as an extra requirement my teachers have asked if I can port the game to smartphones and control the ship by tilting the smartphone.
I can find some instructions on how to make a brand new mobile game, but I was wondering if there were any existing resources that teach you how to port a game to mobile?

Right now I don’t even know how to test a game on smartphone as a test, so I need to learn both that as well as how to use the tilting controls.

I would like to make it clear that I was an absolute noob at Javascript at the start of this project and my knowledge of the program is still rather basic. Atop of that English is not my first language so my apologies for any errors in this question!

2

I guess the simplest way to build a native app with Phaser is using PhoneGap Build

To get the orientation of your device use:

function handleOrientation(event) {
  let absolute = event.absolute
  let alpha = event.alpha
  let beta = event.beta
  let gamma = event.gamma

  console.log(alpha,beta,gamma)
}

window.addEventListener('deviceorientation', handleOrientation, true)

I just started yesterday to make a Phaser PhoneGap Template. You can download it on Github. It is not finished yet, but works great on Android.

Just put your game code inside /app/www, zip the files inside the app folder and upload it to PhoneGap Build

As example, I have put your deviceorientation example inside /app/www/index.html.

3

I’ve made a live tutorial on my youtube channel but it’s in french, you can look at the correspondant github repository on my account to see how the code is organised

https://www.youtube.com/watch?v=lsCwMjZXOo4

The english part is an article on medium here

This is said, pesonnally i prefere if you post your game on itch.io because it’s also mobile friendly but you need an internet connection, just take a look at my account on itch I’ve commited everything on my github account

4

Phone Gap is a long-term standby mentioned by @yannick. But I’ve recently discovered Capacitor (Ionic Framework) which they boast to be “… a spiritual successor to Apache Cordova and Adobe PhoneGap, with inspiration from other popular cross-platform tools like React Native and Turbolinks, but focused entirely on enabling modern web apps to run on all major platforms with ease.”

I’ve been playing with it, and believe you might find it helpful. AND will impress your professor that you’re using the most current technologies.

Here’s some background on tilting and a 48-page pdf about using it.

5

Thanks for all the replies everyone!
I’m using itch.io for now as a tool to quickly test if my game works on a smartphone and I might look into phonegap once I’ve got it all up and running!

1 Like
6

There is a lot of interesting options to explore on itch.io so for example if you want to make a mobile friendly game just take this example https://github.com/nazimboudeffa/kenney-rpg-urban-pack-phaser-game it’s a WiP so I may change the repo name because I am coding my city

init: function(){
    if (!game.device.desktop) {
      game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL;
      //screen.orientation.lock('landscape');//on itch it's diffrent
}

and don’t miss to choose the orientation when you edit your game
As i told you, codova mobile 2D games are made when there is no internet connection but it’s just my point of view

1 Like