This shows you the differences between two versions of the page.
Both sides previous revisionPrevious revisionNext revision | Previous revision | ||
create_custom_game_tutorial [2017/10/26 09:59] – justin | create_custom_game_tutorial [2017/10/26 14:14] (current) – justin | ||
---|---|---|---|
Line 1: | Line 1: | ||
- | ======Creating | + | ======Creating |
---- | ---- | ||
- | The purpose of this guide is to walk you through the process of creating a simple game from scratch using your own custom-made resources. While some detail will be provided for each step, it is recommended that you have a basic understanding of the editors. If you are unsure of the controls or how to complete a certain action, refer to the individual editor guides that are available from the main page. As new features are added to the software, I intend to update this guide accordingly to cover those new features. If there is any particular functionality that you think would be useful to include, please let me know! | + | The purpose of this guide is to walk you through the process of creating a simple game from scratch using your own custom-made resources. While some detail will be provided for each step, it is recommended that you have a basic understanding of the editors. If you are unsure of the controls or how to complete a certain action, refer to the individual editor guides that are available from the sidebar. As new features are added to the software, I intend to update this guide accordingly to cover those new features. If there is any particular functionality that you think would be useful to include, please let me know! |
- | + | If at any point you get stuck or would just like to grab the resources created for this guide, the game project can be downloaded in its entirety here: [[http:// | |
- | If at any point you get stuck or would just like to grab the resources created for this guide, the game project can be downloaded in its entirety here: example_desert_game.zip | + | |
=====Setting Up the Game Project===== | =====Setting Up the Game Project===== | ||
- | When RPG in a Box is first launched, the Game Manager dialog is displayed. The Game Manager allows you to either open an existing game project or create a new one. In this guide we are creating a new game project, so click on the Create a New Game button at the top. | + | When RPG in a Box is first launched, the [[Game Manager]] dialog is displayed. The [[Game Manager]] allows you to either open an existing game project or create a new one. In this guide we are creating a new game project, so click on the "Create a New Game" |
{{: | {{: | ||
- | Once you indicate that you want to create a new game, the Create a New Game dialog will display. This dialog is where you will specify some initial settings for your project. Click the Browse button and navigate to a location where you'd like to store your project' | + | Once you indicate that you want to create a new game, the "Create a New Game" |
{{: | {{: | ||
=====Creating Content===== | =====Creating Content===== | ||
- | This section will guide you through the creation of some resources for your game. We will create a few tiles and objects, a small map, and a character to represent the player. For this guide, let's use a desert theme for the content. | + | This section will guide you through the creation of some resources for your game. We will create a few [[tile|tiles]] and [[object|objects]], a small [[map]], and a [[character]] to represent the player. For this guide, let's use a desert theme for the content. |
====Tiles and Objects==== | ====Tiles and Objects==== | ||
- | After you have finished creating your game project, click the New Resource button located on the Game Explorer toolbar. | + | After you have finished creating your game project, click the "New Resource" |
{{: | {{: | ||
- | For our first tile, let's create some sand. Ensure that " | + | For our first [[tile]], let's create some sand. Ensure that " |
{{: | {{: | ||
- | The Voxel Editor will open and you can begin editing your tile. The default tile size is 16x16x24, but for the sake of simplicity let's make it smaller. Click and drag the Grid Width slider down to 8. You will notice that the Grid Width and Grid Depth sliders are locked together. This is the case for tiles since they must always be square. Also adjust the Grid Height slider to 8. Now using various shades of light brown, place some voxels to create a 16x16x1 tile. For a flat tile, the top view will probably work best. For more details on the usage of the Voxel Editor, check out the Voxel Editor page. | + | The [[Voxel Editor]] will open and you can begin editing your [[tile]]. The default |
{{: | {{: | ||
- | Once you are happy with the look of the sand tile, click the Save button on the Voxel Editor toolbar. Your new tile will now appear in the Resource Panel at the right side of the application as shown below. | + | Once you are happy with the look of the sand [[tile]], click the "Save" |
{{: | {{: | ||
- | Now let's create another tile with a roughly paved road down the center. If you are creating a model similar to an existing one, the easiest way to do this is by clicking the Save As button on the Voxel Editor toolbar. This will make a copy of the current model with a new name. When the Save As Resource dialog appears, enter " | + | Now let's create another |
{{: | {{: | ||
Line 42: | Line 41: | ||
{{: | {{: | ||
- | On your newly created tile, draw a road down the center using some darker grey/brown colors and save it. I also made another copy of my original sand tile using the Save As button again and named it " | + | On your newly created |
{{: | {{: | ||
- | Now that we've created a few tiles for our desert, let's create some objects. Click the New Resource button on the Game Explorer toolbar, but this time choose " | + | Now that we've created a few [[tile|tiles]] for our desert, let's create some [[object|objects]]. Click the "New Resource" |
{{: | {{: | ||
- | Adjust the size of the grid to be 8x8x10 using the Grid Width, Grid Depth, and Grid Height sliders. You will notice, unlike tiles, that the width and depth can be adjusted separately for objects. Change the voxel color to a green of your choice and build a cactus in the editor similar to the one shown below. This will make our desert a bit more interesting. | + | Adjust the size of the grid to be 8x8x10 using the "Grid Width", "Grid Depth", and "Grid Height" |
{{: | {{: | ||
- | You may have noticed before that there is a Walkable | + | You may have noticed before that there is a " |
{{: | {{: | ||
- | Using the Save As button as before, create one or two more copies of the cactus and modify them slightly so you'll have a few variations to select from. As shown below, I " | + | Using the "Save As" |
{{: | {{: | ||
- | You should have a nice selection of tiles and objects to build with now, so we can move on to the map creation! | + | You should have a nice selection of [[tile|tiles]] and [[object|objects]] to build with now, so we can move on to the [[map]] creation! |
====Starting Map==== | ====Starting Map==== | ||
- | Click the New Resource button on the Game Explorer toolbar and enter " | + | Click the "New Resource" |
{{: | {{: | ||
- | Once the Map Editor has opened with your new map, click on the sand tile in the Resource Panel. | + | Once the [[Map Editor]] has opened with your new [[map]], click on the sand [[tile]] in the resource panel. |
{{: | {{: | ||
- | Place some sand tiles to form a small square as the initial base for the map. You can toggle the Randomize Rotation button on the Map Editor toolbar when placing tiles or objects to add variety to the placement, or right-click to rotate the pending resource to a specific angle before placing. Then, place some of the road tiles down the width of the map and scatter several of the "sand with rock" tiles around as desired. For more details on the usage of the Map Editor, check out the Map Editor page. | + | Place some sand [[tile|tiles]] to form a small square as the initial base for the [[map]]. You can toggle the "Randomize Rotation" |
{{: | {{: | ||
- | Next, open the Objects tab on the Resource Panel (second tab) and select a cactus. When placing a cactus onto a tile (and assuming that Navigation/ | + | Next, open the "Objects" |
{{: | {{: | ||
- | Add a bunch of cactuses and a few rocks around the sandy parts of the map, then use the Save button on the Map Editor toolbar to save the map. To achieve the appearance of the desert below, I also went into the Properties panel and made a few lighting adjustments. I chose a dark grey for the Ambient Light color and a bright yellow for the Directional Light color. Shadows were also enabled under the Directional Light section. Don't be afraid to experiment! The lighting can make a lot of difference in the visual style of your map. | + | Add a bunch of cactuses and a few rocks around the sandy parts of the [[map]], then use the "Save" |
{{: | {{: | ||
====Player Character==== | ====Player Character==== | ||
- | In addition to the map, you'll also need a character model to represent the player. Click the New Resource button on the Game Explorer toolbar again and select " | + | In addition to the [[map]], you'll also need a [[character]] model to represent the player. Click the "New Resource" |
{{: | {{: | ||
Line 96: | Line 95: | ||
{{: | {{: | ||
- | In order to give the appearance of motion when the player is driving around, let's create a simple animation for the model. Click the Duplicate Current Frame button on the animation toolbar (located below the 3D view of the Voxel Editor) four times to create four new frames identical to the original frame. As shown in the four images below, I changed one of the voxels in each tire to a lighter color in frames 2 through 5 so the tires will appear to spin. I also made the red brake light at the back of the bike a brighter red in frame 1 so the brake light will appear to come on when the player is stopped. | + | In order to give the appearance of motion when the player is driving around, let's create a simple |
{{: | {{: | ||
Line 104: | Line 103: | ||
{{: | {{: | ||
- | Now let's define a " | + | Now let's define a " |
{{: | {{: | ||
- | In the Add Animation dialog that is display, enter the values as shown below and click OK. It is important that the animation is named " | + | In the "Add Animation" |
{{: | {{: | ||
- | Whenever an animation is added to a voxel model, the animation will appear in the Properties panel at the left. From there, you can modify the Start Frame, End Frame, Type, and Speed of the animation after it has been defined. | + | Whenever an [[animation]] is added to a [[voxel]] model, the [[animation]] will appear in the [[Model |
{{: | {{: | ||
Line 119: | Line 118: | ||
====Startup Script==== | ====Startup Script==== | ||
- | We need to create one more resource before we can configure and export the game: a startup script. The startup script is important because it tells the game what to do when the user first launches your game. Click the New Resource button on the Game Explorer toolbar and select " | + | We need to create one more resource before we can configure and export the game: a [[startup script]]. The [[startup script]] is important because it tells the game what to do when the player |
{{: | {{: | ||
- | The Script Editor will open your new script, which initially will only contain a Start node. In this guide, we will simply add a Load Map node to the script. This function will, as its name implies, load a map. This is all we will need to get the game started. To do this, double-click on Load Map in the Palette | + | The [[Script Editor]] will open your new [[script]], which initially will only contain a "Start" |
{{: | {{: | ||
- | Now you'll need to connect the Load Map node to the Start node in order for the function to be executed when the script is triggered. Click and hold on the cyan-colored output connector on the right side of the Start node, then drag the mouse down to the similar input connect on the left side of the Load Map node. You should now see a cyan line connecting the two nodes together. Go ahead and save the script. | + | Now you'll need to connect the [[Load Map]] node to the "Start" |
{{: | {{: | ||
- | Below the Script Graph, you will notice there is an area titled " | + | Below the visual script graph, you will notice there is an area titled " |
{{: | {{: | ||
=====Configuring the Game===== | =====Configuring the Game===== | ||
- | We've created all of the necessary resources (tiles, objects, map, player character, and startup script), so now we are ready to configure a few settings for the game. In the Game Explorer, double-click the Game Configuration item that is listed directly underneath your game's title. | + | We've created all of the necessary resources ([[tile|tiles]], [[object|objects]], [[map]], [[player character]], and [[startup script]]), so now we are ready to configure a few settings for the game. In the [[Game Explorer]], double-click the [[Game Configuration]] item that is listed directly underneath your game's title. |
{{: | {{: | ||
- | Once the Game Configuration dialog appears, select " | + | Once the [[Game Configuration]] dialog appears, select " |
{{: | {{: | ||
=====Exporting and Playing===== | =====Exporting and Playing===== | ||
- | Now that we've configured the game settings, let's export the game to try it out. On the main toolbar at the top of the application, | + | Now that we've configured the game settings, let's export the game to try it out. On the main toolbar at the top of the application, |
- | {{: | + | {{: |
- | Now that your game has been exported, use your system' | + | Now that your game has been exported, use your system' |
{{: | {{: |