Setting Up Sprites in MakeCode Arcade

A picture might be worth a thousand words but a sprite is priceless! Not only does a good sprite help establish the narrative for your arcade game, it can set the mood, the tone, and even communicate the intended audience.

Let’s dive into what it takes to choose a sprite for your game.

First, let’s talk about what a sprite is. In games, a sprite is a 2-dimensional object that can move and change. Think of it as a picture that does something…but a sprite is more than just an image. In MakeCode Arcade, sprites have many properties associated with them: position, size, direction, acceleration, velocity, and lifespan. Using our special sprite data extension, you can also add your own custom properties.

The plane, coins, lasers, clouds, and meteors are all sprites

Sprites are used as main characters, enemies, projectiles, food, triggers, clues, and even decorations. You can control them with code, or let the user control them during play. Sprites are the building block of any good story, so let’s learn to make one.

This is a ‘set sprite’ block. This creates the sprite and sets both its image and kind at the same time.

If you want to change the image or kind later in the program, you need to use different blocks because using the ‘set sprite’ block again will create another sprite with the same name and that will cause problems!

Arcade also has blocks to detect when two sprites overlap, or when a sprite overlaps part of the tilemap.

Combine this with code that runs when a sprite is created or when a sprite is destroyed, and you have the start of a great game!

Now it’s time to choose a sprite. MakeCode Arcade has dozens of sprite images for you to choose from in the gallery, but if you’d prefer to create a sprite image of your own, you can use the Image Editor.

The Image Editor looks a lot like any other painting program. It has rotate and flip option at the top, brush options at the top-left, and colors down the side. What you might not know, is that this Image Editor has some secret features!

Using keyboard shortcuts, you can make extra magic happen, including:

• ctrl + c to copy
• ctrl + v to paste
• shift + v to flip vertically
• shift + h to flip horizontally
• + /- to zoom

And one other hidden fact. Pay attention to the name field for your image! If you name an image, you’ll be able to use multiple copies of it and change ALL of them every time you change the named version.

Naming images lets you refer to one main image in multiple places

Using multiple unnamed images will treat them all as unconnected copies.

And that’s it! Now that you know how to create and edit sprites, it’s time to head over to Microsoft MakeCode Arcade and see what you can make!