Repository navigation
Expand file tree
/
Copy pathHello_World.htm
More file actions
109 lines (109 loc) · 10.2 KB
/
Copy pathHello_World.htm
File metadata and controls
109 lines (109 loc) · 10.2 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
<?xml version="1.0" encoding="utf-8" ?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="generator" content="Adobe RoboHelp 2022" />
<title>Hello World: GameMaker!</title>
<link rel="stylesheet" type="text/css" href="assets/css/default.css" />
<meta name="template" content="assets/masterpages/Manual_Page.htt" />
<meta name="rh-authors" content="Gurpreet S. Matharoo" />
</head>
<body>
<h1><span data-field="title" data-format="default">Hello World: GameMaker!</span></h1>
<p>This page guides you through starting <strong><span data-keyref="GameMaker Name">GameMaker</span></strong> for the first time and creating your first program. We'll finish by creating a build that you can share with others.</p>
<h2>Create a Project</h2>
<p>On the Start Screen, create a new project:</p>
<p><img class="center" src="assets/Images/Introduction/QS_NewProject.png" />Follow these steps for your first project:</p>
<ol class="colour">
<li>Select "<strong>Game</strong>" as the project type</li>
<li>Select "<strong>Blank Game</strong>" as the template</li>
<li>Enter a "<strong>Project Name</strong>" and click "<strong>Let's Go</strong>!"</li>
</ol>
<h2>Basic Assets</h2>
<p>This will open your project, with the following IDE sections present:</p>
<p><img class="center" src="assets/Images/Introduction/QS_Workspace.png" />In the Asset Browser, click <img class="icon" height="18" src="assets/Images/Icons/Icon_AddParticleEmitter.png" width="18" /> to create a Sprite asset.</p>
<p><img alt="Resources Menu" class="center" src="assets/Images/Introduction/QS_ResourcesMenu.png" />Double-click on "<strong>Sprites</strong>" or click "<strong>Create</strong>" after selecting "<strong>Sprites</strong>".</p>
<h3>Sprites</h3>
<p>What you've just created is a <strong>Sprite</strong> asset. You can assign this to an <strong>Object</strong> and it will appear in your game as an interactive object.</p>
<p><img alt="The Sprite Editor" class="center" src="assets/Images/QS_Guide/QS_Sprites_SpriteEditor.png" />In the <a href="The_Asset_Editors/Sprites.htm">Editor</a>, click on "<strong>Edit Image</strong>" to open <a data-xref="{title}" href="The_Asset_Editors/Image_Editor.htm">The Image Editor</a> to draw your Sprite, or click on "<strong>Import</strong>" to import an image file to use as your Sprite.</p>
<h3>Objects</h3>
<p>Back in the Asset Browser, create an <strong>Object</strong> asset.</p>
<p><img alt="Resources Menu" class="center" src="assets/Images/Introduction/QS_ResourcesMenu.png" />This will open <a data-xref="{title}" href="The_Asset_Editors/Objects.htm">The Object Editor</a> and display the Object's properties in <a data-xref="{title}" href="IDE_Tools/The_Inspector.htm">The Inspector</a>.</p>
<p>Find the option for the <strong>Object</strong>'s <strong>Sprite</strong> and assign the Sprite you created in the previous step.</p>
<p><img alt="The Asset Explorer" class="center" src="assets/Images/Asset_Editors/Editor_Objects_AssetExplorer.png" />Now your <strong>Object</strong> has a <strong>Sprite</strong> assigned to it.</p>
<p>Your image has found life in your game, as you can now interact with it.</p>
<h2>Basic Programming</h2>
<p>To interact with your Object, make use of <strong>Events</strong>.</p>
<p>Click the "<strong>Add Event</strong>" button in your Object's "Events" window:</p>
<p><img alt="The Object Editor Events" class="center" src="assets/Images/QS_Guide/QS_ObjectEditor_Events.png" style="cursor: nesw-resize;" />Pick the event of your choice from this list. For our Hello World, we're going to add two events:</p>
<ul class="colour">
<li><strong>Mouse - Left Pressed</strong>: This runs when the left mouse button is pressed on the Object's <strong>Instance</strong>.</li>
<li><strong>Step - Step</strong>: This runs every frame, so you can program continuous behaviour for your <strong>Instance</strong>.</li>
</ul>
<p class="note"><span data-conref="assets/snippets/Tag_tip.hts"> </span> An "<strong>Instance</strong>" is a clone of your Object placed in a room. An Object is only a template, from which Instances are created.</p>
<p>When you add an Event, you will be <a href="GameMaker_Language.htm">prompted to pick between</a> <span data-keyref="GML_Visual">GML Visual</span> and <span data-keyref="GML_Code">GML Code</span>. Go with what you want to use, this guide covers both.</p>
<h3>Mouse - Left Pressed event</h3>
<p>In this event, enter the following code:</p>
<p class="code">show_debug_message("You clicked on me!");</p>
<p>For GML Visual, use the following action and properties:</p>
<p><img class="center" src="assets/Images/QS_Guide/QS_HelloWorld_Visual2.png" /></p>
<h3>Step event</h3>
<p>In this event, enter the following code:</p>
<p class="code">move_towards_point(mouse_x, mouse_y, 2);</p>
<p>For GML Visual, use the following actions and properties:</p>
<p><img class="center" src="assets/Images/QS_Guide/QS_HelloWorld_Visual1.png" />You have now programmed your Object to move toward the mouse, and when it is clicked on, to print a message to the Output log.</p>
<h2>Room Canvas</h2>
<p>Your project will have a "Room1" asset by default. Double-click on it to open the <a href="The_Asset_Editors/Rooms.htm">Room Editor</a>:</p>
<p><img alt="The Room Editor" class="center" src="assets/Images/QS_Guide/QS_RoomEditor.png" style="cursor: nwse-resize;" />This is your canvas. When your game runs, this is what your player sees. Use this to design levels, set up cameras and create menus.</p>
<p>Rooms use "layers", similar to drawing programs. Layers have types, limiting what type of asset can be placed inside them.</p>
<p>Ensure you have the "<strong>Instances</strong>" layer selected (as seen in the image above) and from <a data-xref="{title}" href="Introduction/The_Asset_Browser.htm">The Asset Browser</a>, drag your object into the empty canvas. This creates an <strong>Instance</strong> of your Object.</p>
<h2>Compiling</h2>
<p>Your basic game is now ready, with an interactive object placed within the Room canvas.</p>
<p>Before running the game, see the <a href="Introduction/Compiling.htm">Targets menu</a> on the top-right to check what platform target is set.</p>
<p><img alt="Target List" class="center" height="308" src="assets/Images/Introduction/QS_TargetList.png" width="915" />This is where you set the platform to compile for. Select "Test" or your current platform (e.g. Windows).</p>
<p>With the correct platform target selected, press <span class="shortcut">F5</span> or the <img alt="Test Play Game" class="icon" src="assets/Images/Icons/Icon_PlayGame.png" /> button at the top of the IDE.</p>
<p>Your game should start soon, opening in a new window. You will see your Object move slowly toward the mouse, and when you click on your Instance, a message is printed in the Output log window:</p>
<p><img class="center" src="assets/Images/QS_Guide/QS_CompileTest.png" />You've now done two crucial parts of game development:</p>
<ul class="colour">
<li><strong>Changing behaviour using player input</strong>: Reading the player's mouse position, you moved your Object's Instance toward it, frame-by-frame.</li>
<li><strong>Printing information to the Output log</strong>: This is a basic part of <a data-xref="{title}" href="Introduction/Debugging.htm">Debugging In GameMaker</a>, used to print information within events so you may see what is going on behind-the-screen.</li>
</ul>
<h2>Sharing a Build</h2>
<p>To share a build, you need to be <a href="Setting_Up_And_Version_Information/Licencing_Information.htm">logged in</a>.</p>
<p>Simply <a href="Introduction/Compiling.htm">select a platform</a> from the Targets menu and use the <img class="icon" src="assets/Images/Icons/Icon_Compile.png" /> <strong>Create Executable</strong> button or find the option in <a data-xref="{title}" href="IDE_Navigation/Menus/The_Build_Menu.htm">The Build Menu</a>.</p>
<p>Selecting your current platform (e.g. Windows) will let you create an executable ZIP file that you can share with others. Using the <strong>GX.games</strong> platform, you can upload your game and share a link so others can play it within their browsers.</p>
<h2>What's Next?</h2>
<p>Read the <a data-xref="{title}" href="Quick_Start_Guide/Quick_Start_Guide.htm">Quick Start Guide</a> for a step-by-step introduction to the various parts of <span data-keyref="GameMaker Name">GameMaker</span>.</p>
<p>For specific game tutorials, check out the <a href="https://gamemaker.io/en/tutorials">GameMaker website</a> and the <a href="https://www.youtube.com/@GameMakerEngine">GameMaker YouTube channel</a>.</p>
<p>Use the <a data-xref="{title}" href="IDE_Tools/Prefab_Library.htm">Prefab Library</a> to find assets for instant use within the IDE.</p>
<h2>Troubleshooting / FAQ</h2>
<p>Having issues with this guide? Check the frequently asked questions below.</p>
<ul class="colour">
<li><strong>My game is blank</strong>
<ul>
<li>Ensure you have placed your Object in your Room</li>
<li>Ensure the Object is within the Room bounds</li>
<li>Ensure the Object has a non-empty Sprite assigned to it</li>
</ul>
</li>
<li><strong>I do not see any platforms other than Test and GX.games</strong>
<ul>
<li>Ensure you are <a href="Setting_Up_And_Version_Information/Licencing_Information.htm">logged in</a></li>
<li>Use "<strong>Update Licence</strong>" from the <a href="IDE_Navigation/Menus/Version_&_Account_Details.htm">Account menu</a> after logging in</li>
</ul>
</li>
</ul>
<p> </p>
<p> </p>
<div class="footer">
<div class="buttons">
<div class="clear">
<div>Back: <a data-xref="{title}" href="Content.htm">GameMaker Manual Index</a></div>
<div>Next: <a data-xref="{title}" href="Introduction/Introduction_To_GameMaker_Studio_2.htm">Introduction To GameMaker</a></div>
</div>
</div>
<h5><span data-conref="assets/snippets/Copyright_Notice_AutoUpdate.hts"> </span></h5>
</div>
</body>
</html>