Draw images

Let's get down to business!


First, you need to connect your ByteBoi to your computer's USB port and turn it on.

random image



Let's draw something!

The first thing we're going to learn is how to use the feature called Sprite editor!

In computer graphics, a sprite is a two-dimensional image or animation that is integrated into a larger scene.

Find the three dots on your Toolbar first, click on it and find the Sprite editor. 

This window will open:



As you can see you have the option to choose one of the premade sprites or create your own by clicking on "blank". 

Let's explore the blank option first. 

Check what each icon means.

  1. Paintbrush - you'll use it for painting whatever you want.
  2. Eraser - you'll use it for erasing mistakes you make.
  3. Paint bucket - choose any color you want, click on the drawing area and paint the entire background.
  4. Color dropper - this tool sample colors from anywhere you click and adds it to your sprite. 
  5. Color picker - here, you can choose which color you will use for drawing.
  6. Dimensions - choose the dimensions of your sprite.
  7. Drawing area - once you're done with the drawing, press the big blue button saying "Close".
  8. Sprite name - Write any name you want to give your sprite.
  9. Close - Close without saving.
  10. Save - For saving your sprite.
You can paint whatever you want, and later on, you can put it on your ByteBoi's display.


If you don't want to draw but you'd like to have some cool images on your ByteBoi, you can always choose a pre-made one.

Maybe you want to draw on the pre-made icons and make them better. No problem, just click on the one you want to upgrade, and start drawing!



For example, I chose to draw a Christmas tree but didn't want to draw a tree from scratch. So, I took a premade tree and drew Christmas ornaments.

Also, I didn't want my tree to have a generic name, so I renamed it to christmastree.

If you want to rename your drawing, you should know that its name cannot begin with a number, and there can't be any spaces between words.


One more tip is you can change the resolution of your sprite in the upper left corner.

The resolution
 is the size of a sprite, and it's measured in pixels.

A pixel
 is the smallest controllable element of a picture represented on the screen.

You can play with this some more, but now we're going to code for real!