{"id":1737,"date":"2017-11-15T12:33:48","date_gmt":"2017-11-15T12:33:48","guid":{"rendered":"\/blog\/?p=1737"},"modified":"2026-09-09T11:14:48","modified_gmt":"2026-09-09T11:14:48","slug":"you-can-now-upload-your-own-sprites-and-background-on-game-builder","status":"publish","type":"post","link":"https:\/\/www.codemonkey.com\/ru\/blog\/you-can-now-upload-your-own-sprites-and-background-on-game-builder\/","title":{"rendered":"\u0422\u0435\u043f\u0435\u0440\u044c \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0437\u0430\u0433\u0440\u0443\u0436\u0430\u0442\u044c \u0441\u0432\u043e\u0438 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0435 \u0441\u043f\u0440\u0430\u0439\u0442\u044b \u0438 \u0444\u043e\u043d\u044b \u0432 Game Builder!"},"content":{"rendered":"

We have added a NEW feature for the Game Builder platform.\u00a0<\/span><\/h2>\n

Now you can get even more creative with your designs!<\/em><\/p>\n

3 Steps to Use this Feature:<\/strong><\/p>\n

1. You can upload your own sprite sheet and set it as your animated sprite.<\/span><\/p>\n

To do this, click on Create Games –> the Plus sign –> and then on Your Sprite Sheets. There, you will see the option to “upload sprite sheet”. Click on “upload sprite sheet” and then on “upload” to select the file you wish to add.<\/p>\n

Image 1:<\/strong><\/p>\n

\"\"<\/p>\n

In the meantime, search for a sprite sheet that you wish to use in your game and then upload it.<\/p>\n

Here is an example of a sprite<\/strong> sheet to upload:<\/p>\n

\"\"<\/p>\n

If you wish to use such a sprite sheet, then enter the number of frames in Number of frames. Since in this specific sprite sheet the girl is seen running in 6 different actions (or frames, I entered 6..<\/p>\n

\"\"<\/p>\n

Click on OK, and your sprite will be added.<\/p>\n

To program or command your sprite, you first need to define the animation. To do so, click on addAnimation under Display on the bottom of the screen.<\/p>\n

\"\"<\/p>\n

Then define the “key”.\u00a0For example, if the sprite sheet that you uploaded is of a running girl, set the key as “run”. Then, add the number of frames in the sprite sheet inside the parentheses. Since there are 6 frames, the parentheses include numbers 0-5. Next, define the frameRate, 12 is a good number to start at. We will skip loopanimation<\/p>\n

\"\"<\/p>\n

An example code can be found below:
\n@addAnimation “run”, [0, 1, 2, 3, 4, 5], 12<\/p>\n

@onKey = (key) =>
\n# Example:
\nif key == keyboard.right
\n@startAnimation “run”
\n@step 5<\/p>\n

@onAnimationEnd “run”, () =>
\n@stopAnimation yes<\/p>\n

2. Upload your own images and set them as your game background<\/span><\/p>\n

Image 2:<\/strong> <\/span><\/p>\n

\"\"<\/p>\n

As seen in Image 2<\/strong>, go to the Game tab on the lower right side of the screen and then click on Upload to choose a new game background.<\/span><\/p>\n

3. Improved User Interface for selecting game background.<\/span><\/p>\n

After creating your game, don’t forget to save it before you share!<\/span><\/p>\n

Need help? Check out this<\/a> reference game to help you out or email us at info@codemonkey.com<\/strong><\/p>\n","protected":false},"excerpt":{"rendered":"

We have added a NEW feature for the Game Builder platform.\u00a0 Now you can get even more creative with your designs! 3 Steps to Use … <\/p>\n

Continue reading “You Can Now Upload Your Own Sprites & Backgrounds on Game Builder!”<\/span><\/a><\/p>","protected":false},"author":41,"featured_media":11957,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"image","meta":{"footnotes":""},"categories":[704,756,31],"tags":[161,516,514,515],"class_list":["post-1737","post","type-post","status-publish","format-image","has-post-thumbnail","hentry","category-coding-for-kids","category-game-design-for-kids","category-new-features","tag-codemonkey","tag-design","tag-game-builder","tag-sprite-animations","post_format-post-format-image"],"aioseo_notices":[],"aioseo_head":"\n\t\t\n\t\n\t\n\t\n\t\n\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t