Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision
Previous revision
gdevelop5:tutorials:geometry-monster:3-introducing-main-character [2019/12/02 17:32]
end3r url fix
gdevelop5:tutorials:geometry-monster:3-introducing-main-character [2021/11/22 23:06] (current)
Line 6: Line 6:
 Now when the scene itself is ready, it looks kind of empty - let's add something to it! Now when the scene itself is ready, it looks kind of empty - let's add something to it!
  
-{{ :gdevelop5:tutorials:geometry-monster:17.png |}}+{{ :gdevelop5:tutorials:geometry-monster:17.png?direct|}}
  
 We will be able to do that by clicking on the "Add a new object" button in the "Objects" panel on the right. We will be able to do that by clicking on the "Add a new object" button in the "Objects" panel on the right.
  
-{{ :gdevelop5:tutorials:geometry-monster:18.png |}}+{{ :gdevelop5:tutorials:geometry-monster:18.png?direct|}}
  
 It will open a popup where a list of available options is showed. Those vary from sprites, through text, to particle emitters, shape painters, and text inputs. Select the "Sprite", which is explained as the animated object which can be used for most elements of a game. It will open a popup where a list of available options is showed. Those vary from sprites, through text, to particle emitters, shape painters, and text inputs. Select the "Sprite", which is explained as the animated object which can be used for most elements of a game.
  
-{{ :gdevelop5:tutorials:geometry-monster:19.png |}}+{{ :gdevelop5:tutorials:geometry-monster:19.png?direct|}}
  
 Another popup will appear, but now with the options to customize our new object. We will call him "Monster", and he will be our main character in the game: collecting items and being cute at the same time. Another popup will appear, but now with the options to customize our new object. We will call him "Monster", and he will be our main character in the game: collecting items and being cute at the same time.
  
-{{ :gdevelop5:tutorials:geometry-monster:20.png |}}+{{ :gdevelop5:tutorials:geometry-monster:20.png?direct|}}
  
 After giving him his new name, let's add some images that will represent him on the scene and in the game. Click on the "Add an animation" button to open a file select window. After giving him his new name, let's add some images that will represent him on the scene and in the game. Click on the "Add an animation" button to open a file select window.
  
-{{ :gdevelop5:tutorials:geometry-monster:21.png |}}+{{ :gdevelop5:tutorials:geometry-monster:21.png?direct|}}
  
 Navigate to the folder where the images are (you can download them from {{ :gdevelop5:tutorials:geometry-monster-sources.zip |here}}), select all that you want to add, and then click "Open". Navigate to the folder where the images are (you can download them from {{ :gdevelop5:tutorials:geometry-monster-sources.zip |here}}), select all that you want to add, and then click "Open".
  
-{{ :gdevelop5:tutorials:geometry-monster:22.png |}}+{{ :gdevelop5:tutorials:geometry-monster:22.png?direct|}}
  
 GDevelop will show the message saying those files are outside of the project folder, so the recommended next step is to allow copying them onto the project folder first before we do anything with them. Click "Ok" to do that. GDevelop will show the message saying those files are outside of the project folder, so the recommended next step is to allow copying them onto the project folder first before we do anything with them. Click "Ok" to do that.
  
-{{ :gdevelop5:tutorials:geometry-monster:23.png |}}+{{ :gdevelop5:tutorials:geometry-monster:23.png?direct|}}
  
 All the images we just imported will serve as the idle animation - one that is played when nothing is happening. The animation is looped, so it will look like the Monster is closing and opening his eyes every once in a while indefinitely. All the images we just imported will serve as the idle animation - one that is played when nothing is happening. The animation is looped, so it will look like the Monster is closing and opening his eyes every once in a while indefinitely.
Line 40: Line 40:
 You can also edit images in Piskel or preview the animation itself if you want to. You can also edit images in Piskel or preview the animation itself if you want to.
  
-{{ :gdevelop5:tutorials:geometry-monster:24.png |}}+{{ :gdevelop5:tutorials:geometry-monster:24.png?direct|}}
  
 When everything is done, click on "Apply" to save the changes. When everything is done, click on "Apply" to save the changes.
  
-{{ :gdevelop5:tutorials:geometry-monster:25.png |}}+{{ :gdevelop5:tutorials:geometry-monster:25.png?direct|}}
  
 Now you can see our little Monster's icon in the right panel, under the "Objects" list. Isn't he cute? Now you can see our little Monster's icon in the right panel, under the "Objects" list. Isn't he cute?
Line 50: Line 50:
 To make the scene look a little bit more interesting we will add a background color to it. Right click on the scene, and select "Scene properties" from the context menu. It will open a popup with some options - we are interested in setting the "Scene background color" to something on which the Monster will look stylish. To make the scene look a little bit more interesting we will add a background color to it. Right click on the scene, and select "Scene properties" from the context menu. It will open a popup with some options - we are interested in setting the "Scene background color" to something on which the Monster will look stylish.
  
-{{ :gdevelop5:tutorials:geometry-monster:26.png |}}+{{ :gdevelop5:tutorials:geometry-monster:26.png?direct|}}
  
 Click on the color picker on the right and chose a color - ours is `#560921`. Click on the color picker on the right and chose a color - ours is `#560921`.
  
-{{ :gdevelop5:tutorials:geometry-monster:27.png |}}+{{ :gdevelop5:tutorials:geometry-monster:27.png?direct|}}
  
 After confirming, the scene's background color will change to what was selected - success! After confirming, the scene's background color will change to what was selected - success!