tk3 (home, dev, source, bugs, help)

Beginner's Tutorial

Overview

This tutorial aims to introduce new users to the Toolkit by providing an overview of the structure of a game and a short demonstration of how to put a small game together from the Toolkit's default files.

Starting up

When you launch the Toolkit editor program (toolkit3.exe), you will first be presented with a splash screen and a Tip of the Day screen. After closing this, you are left with the Toolkit's Editor Environment, comprising various toolbars and a large central area where file editors for each type of game file are loaded (Note: the Editor Environment is generally referred to simply as the "editor"). Each of the different file editors can be opened through File > New..., using the first button in the top toolbar or the second button in the right toolbar.

Games in the editor are termed Projects, and only one project can be edited at a time. The name of the currently open project file is displayed in the title bar of the editor; when you first run the Toolkit, this will be 'demo.gam'. You can run the current game by clicking the green arrow in the top toolbar.

Editor toolbars

Creating a new project

The demo game isn't enthralling, but it is an example of what can be made in just a few minutes. To start working on your own game, you first need to create a new Project in which to store all its files. To do this, select File > New Project (Ctrl+N) to show the New Project screen; this is where you specify the game's title. Replace the text in the Game Title field and the Game Folder field updates accordingly; do not change this. For the purposes of this overview, call the game "test".

New project screen

The "default files" refer to a set of game components (graphics, music, sprites) used to create the demo game; leave this checked since we don't have any custom files yet. Click "Setup My Game!" to complete the process, and the project's Main File Editor appears, displaying "test.gam" in the title bar (and also in the editor environment's title bar). This editor handles the game's main file (here, "test.gam"), which contains all the global settings and start-up conditions for the project.

Components of a game

Project folder organisation

Any game contains a large number of files; these range from low-level images and music, to collections of images (animations, 'boards'), sets of data and game event instructions. The main filetypes are listed here:

  • Boards - the scenes, environments or maps that construct the game's world, including collisional information and references to programs, music and sprites.
  • Tiles - 32x32 pixel images that are used to construct boards and sprites.
  • Players - the user-controlled characters in the game, containing personal attributes and references to sprite animations.
  • Enemies - the default enemy filetype contains enemy attributes and references to sprite animations.
  • Items - objects that can be used as equipment, non-player characters and inventory items.
  • Animations - references to a set of images that can be used for characters and enemies.
  • Programs - sets of instructions written in the Toolkit's own RPGCode programming language that script events, such as conversations or cutscenes.
  • Backgrounds - references to images and music that are used in the default Battle System.

There are additional types of files used in the Toolkit game, which you may encounter as you further develop your game.

Each type of file (or groups of filetypes) in a Toolkit game are located in specific folders in the Toolkit's folder structure. All the test game files reside within the Toolkit3/Game/test folder, except for the game's main file (test.gam), which lives in the Toolkit3/Main folder, and saved games, which are found in the Toolkit3/Saved folder. When creating your own game files or using game files from resource sites, they must be placed in the correct folder corresponding to the filetype.

Toolkit file tree To view the game's files and folders, click the first button in the right toolbar. At this point, only the default Toolkit files are present. To open a file, double-click it; right-click it to access other options.

Boards

The next thing to do is to create a board for the test game. Since we included the default game files, an initial board has been created (start.brd, as above), but we'll start from scratch. Click the second button on the right toolbar and select Edit Board from the resulting menu. A small window appears entitled "New Board", in which some basic properties of the board can be set. Leave the defaults and click OK; the window is replaced with a black "Untitled board" window, and the left toolbar is populated with icons.

New board

Now, the window is black because the board has no image data, so that's the first thing to add. Boards may be constructed in two ways: using small square or isometric tiles, or using pre-rendered background images (e.g. jpg or png images).

  • Tiles - Toolkit tiles are stored in files called tilesets, which group tiles together in a single collection. The default files contain a default tileset, containing some simple outdoor graphics that we will use to create a scene. To view this set, click the third button on the right toolbar, click the open button on the tileset browser that appears and open 'default.tst'.

    Default tileset

    Next, click the first tile in the set to select that tile, and note that a number of changes occur on the left toolbar. Firstly, the selected icon changes from the hand tool to the tile tool, directly below it; secondly, the third group of icons become active and the pencil (draw) tool is selected; thirdly the selected tile is displayed at the bottom of the toolbar. Now to start drawing, click and drag on the black area of the editor.

    Drawing tiles

    The tiles snap to an invisible grid; to show the grid toggle the first icon in the first group. Other styles of drawing can be performed with icons in the third group, including flood-fill and rectangle. You can zoom in or out using the magnifying glass tool in the second group, or by holding Ctrl and scrolling the mouse wheel. Scrolling the mouse wheel on its own scrolls the board - click the mouse wheel button to change the direction of the scroll.

  • Image - to set a pre-rendered image, select the 'Properties' tab above board area to display some of the board's properties. Click the '...' button next to the 'Background image' field to select an image file - the image file must be placed in the 'Bitmap' folder - if you select a file from elsewhere on your computer, you will be notified that the file will be copied to the appropriate location.

When you've created a scene make sure you save it, using the fourth button in the top toolbar. In creating a board, you'll probably have areas of it that you want to be solid to sprites (that is, that they cannot move over). This is achieved using vectors, which are so versatile that they have a whole tutorial devoted to them - so visit this link for this part. When you've finished you should have something like this:

Drawing vectors

Next, let's make a player and a non-player character (NPC) to put on the board. Make sure you save the board again.

Sprites

Player

A default player has been included - start.tem in the Chrs folder, but we will create our own. Select 'Edit Character' from the new editor list in the right toolbar to load the Character Editor ('character' and 'player' are used interchangeably in the Toolkit). As previously mentioned, a player's file contains sets of attributes relating to the player's behaviour and performance in battles, and sets of graphics used for moving around boards and fighting in battles. For the purposes of this tutorial we'll ignore the player's battle attributes and just set up some walking graphics. Click the 'Graphics' button in the Character Editor to show the sprite list window. This window lists the animation files that are associated with the player, and also defines the collision and interaction areas of the player's sprite.

Animations

Each direction that the player can move in is called a stance and is listed in the first box. The graphics for a stance must be contained in a Toolkit Animation file, which must be created separately, so we should do this first. Close the sprite window and load the Animation Editor through the new editor list. The editor appears as a small white box with two associated toolbars on the left and below. The quickest way to create an animation is using the wizard - click the 'Run Wizard...' button in the lower toolbar. Like boards, animations can be made of tiles or images. The Toolkit's default files include some basic character tiles, so we'll make a walking animation with these.

Click 'Single or multiple tiles per frame', and the default tileset should appear on the right; use the second button above the tileset to change the set to 'char.tst'. Use the arrow buttons to set 'Frames' to 2 (since the default set only has two tiles per direction), and set the 'Current Frame' to 1. The 4x4 grid represents the current frame; click a tile in the set and then click in the grid to place the tile on the frame (place it in the top-left corner). Scroll the Current Frame to 2 (the tile disappears from the grid) and repeat the process.

Animation wizard

When finished, click OK to return to the Animation Editor; the first frame is then displayed in the centre and information about the frame is displayed below. When you go to save the animation, you'll notice a set of files of the form "start_*.anm"; these are the animation files for the default character. Save your animation as something like "man_s.anm", where the "_s" indicates that it is a south-walking animation. Repeat this process for the other directions and then return to the Character Editor's graphics window.

Sprite graphics window

To assign the animation files we've just created to the character, select the stance from the list (e.g. 'South (Front View)') and click the '...' next to the 'Selected animation file' field. Select the animation file corresponding to the direction (e.g. man_s.anm), and the file is entered in the animation list in the 'Walking / default' column. The first frame of the animation is shown in the Preview frame below, affixed with a box and a dashed crosshair - these define the collisional aspects of the sprite, which we can leave to the default. Complete the stances for the animations we've just made and close the window. Leave the other properties blank and save the character as something like 'test.tem', and then close the editor.

Non-player character - item

NPCs in the game are created using items, which are also used to create equipment objects and inventory possessions. Open the Item Editor through the new editor list, and you will see that items have a range of properties that control these applications. We'll need more walking graphics for our NPC, but we could use those default animations we saw earlier. Click the 'Graphics' button to show an identical sprite list screen, and complete this in the same way as for the player, using the "start_*.anm" animations, then return to the Item Editor.

We want some event to occur when the player interacts with the NPC in the game (e.g. the NPC talks to the player, or a fight begins), and in order to achieve this we need to write a program that describes the event using commands or functions written in the Toolkit's scripting language RPGCode.

Events - RPGCode scripting

A large portion of this manual is devoted to scripting in RPGCode, and if you've never programmed before, it may be worth visiting this link first.

To create a simple program that scripts a conversation between the NPC and the player, open the RPGCode Program Editor through the new editor list. The Editor looks a lot like Notepad (although has a few extra features!); here is an example of a short program:

	MWin("Hello, welcome to the test board!")
	Wait()
	name = Prompt("What's your name?")
	MWin("Hello " + name + "!")
	Wait()
This program shows the first sentence in a message window using a function called MWin(). It waits for the user to press a key using Wait(), and then shows a user prompt with Prompt(). The words entered at the prompt are assigned to a variable called name, and a second line is added to the message window that combines the variable with text to provide a response. The program then waits again for the user to press a key, at which point the program ends and the message window disappears.

You can test this program by clicking the arrow button in the left toolbar. Save the program as "hello.prg" and close the editor.

To make this program run when the player interacts with the NPC, return to the Item Editor and tick the 'Board-Run' check-box. Click the corresponding 'Edit' to display a window that lists the programs associated with the item when that item is on a board. Click the 'Browse...' next to 'Program to run when item is picked up' and select "hello.prg", and then click OK, save the item as "npc.itm" and close the editor.

Putting it all together

Now we're ready to put the characters on the board. Open "test.brd" from earlier and select the Sprite Tools using the 6th icon in the second group on the left toolbar. Select the Draw tool from the third group and then click on the board to place a new item; a white box appears at the location. Next, click the fourth button in the right toolbar to show the Board Toolbar, which has tabs for various board objects. The Sprite tab should be selected, displaying the board properties of the selected sprite. These are unimportant except for the filename. Click the '...' beside the field and select "npc.itm"; the white box is replaced by the first frame of the southward walking animation.

It's slightly different for the player - go to the Board menu and select 'Set Player Start Location', and then click on the board. A cross appears at the location with 'Player start location layer 1'.

NPC and player locations

Finally, we need to make this board and our new player appear when we run the game. Save the board and close it, and open the Main File Editor using the second icon in the top toolbar. Select the 'Startup Info' tab and use the browse buttons beside the 'Initial Board File' and 'Initial Character File' to select "test.brd" and "test.tem". Save this file and then run the game with the green arrow in the top toolbar. The game will start with the same screen as the demo game - this is created in a program called "start.prg" that is also included in the default files. Select 'New Game', and the board and sprites you've just made will appear. Walk up to the NPC and the "hello" program will run!

Finished game

Summary

This tutorial has provided the steps to produce a short game comprising a board, player, non-player character, program and animations using the default Toolkit files. A range of other tutorials written by community members are available covering other aspects of game creation, and the manual provides authoritative information on all aspects of the Toolkit.


previous, forward