You should be proud of your first game, but having a look at your project folder it looks a bit unorganized.
We have images, sounds and scripts all placed in the same folder. This is not a big problem when you are dealing with simple games like this one, but imagine a bigger project with a lot of images and sounds: you will end with a folder full of clutter.
That’s why you should create a folder called assets, with more folders in it called sprites and sounds where to place all your files. You can give your folders the names you want, but keep in mind there are the names I will be using in future books and tutorials. Now your project will look like this:
Now it’s more organized, and we just have to edit the preloading paths. This is how we change preload method in playGame object:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
preload: function() { game.load.spritesheet( "tiles", "assets/sprites/tiles.png", tileSize, tileSize ); game.load.audio( "select", ["assets/sounds/select.mp3", "assets/sounds/select.ogg"] ); game.load.audio( "right", ["assets/sounds/right.mp3", "assets/sounds/right.ogg"] ); game.load.audio( "wrong", ["assets/sounds/wrong.mp3", "assets/sounds/wrong.ogg"] ); } |
And the same concept applies to preload method in titleScreen:
1 2 3 4 5 |
preload: function() { game.load.spritesheet( "soundicons", "assets/sprites/soundicons.png", 80, 80 ); } |
And now we have the same working game, with more organization.
Download Source
File: organizing-folders-game.zip