Spotter | Changing the game properties and creating the atlas.

Before we create the interface we will need some graphics to use for the buttons and title. You could use shapes, text and font objects in Defold too, but it will look much better if we use pictures we made in a graphics program instead.

When we set up the atlas we might as well take the opportunity to include the pictures we will also use for the actual spot the difference game later too. Those images are larger than the default resolution we have been working with in previous tutorials so we are going to change that first.

1. In the assets panel, double click, 'game.project'. This is where all the generic settings for the game are stored.
2. Scroll down until you find, 'Display'. Change the width and height to be 1280 x 640. This will affect all the collections.

3. In the assets panel, right click 'main' and select, 'New...', 'Atlas'.
4. Name the atlas, 'graphics' and click, 'Create Atlas'.
5. Download the graphics you need for the game by right clicking this zip file and saving the linked file: graphics.zip
   
   The file contains these assets:
   
   

   button_level1.png	button_level2.png	cross.png	house.png	train.png
   tick.png	title.png

6. Unzip the graphics.zip file and move the graphics folder into the folder where you have saved your project. If you copied the files out of the zip file you will need to make sure you have a top level, 'graphics' folder.
7. In the outline panel of graphics.atlas, right click, 'Atlas' and select, 'Add Images...'
8. Select all the images (you can hold shift to select the first and last image) and click, 'OK'. Remember you can press F to zoom out in the editor window to see the graphics you have just added to the atlas.
9. Save the changes by pressing CTRL-S or 'File', 'Save All'.

We are now ready to build the interface for the title screen. Stage 2b >