Codesters FAQ is the official FAQ site for codesters.com. We will continue to update this blog with the most common questions we receive form teachers using Codesters.

Custom Sprites

You can create and collect custom images to use as sprites in your programs by uploading them from the internet. We recommend that teachers manage and oversee this process. For students that might need additional help, we recommend that teachers create a list of image URLs that students can use.

Demonstration of adding a custom sprite to a Codesters program.

Follow these steps to upload a custom sprite:

Step 1: Access the Image Library

  • Go to the Stage or Sprites toolkit

  • Click on the Browse Image Library button

Screen Shot 2021-02-18 at 5.08.37 PM.png

Step 2: Go to the Sprites tab

  • On the left side of the popup window, select the Sprites tab

Screen Shot 2021-02-18 at 5.09.54 PM.png

Step 3: Upload Sprite

  • At the bottom of the left side, click on the Upload Sprite button

Screen Shot 2021-02-18 at 5.12.49 PM.png

Step 4: Get the URL

  • Find an image that you want on the internet

  • Right click on the image and click the Copy Image Address option

  • NOTE: if your first image doesn’t work, try another image! Images need to be either .jpg or .png filetypes, but often it can be difficult to determine the filetype.

  • IMPORTANT: do NOT click Copy Link Address or Copy Image

Screen Shot 2021-02-18 at 5.50.43 PM.png

Step 5: Paste the image URL and check the preview

  • Paste the copied URL where it says Image URL

  • Click Preview to see a preview of the image and confirm that it will work

Screen Shot 2021-02-18 at 5.20.52 PM.png

Step 6: Name your image and save

  • Give your image a name (the name will be included in its image label)

  • Click Save

Screen Shot 2021-02-18 at 5.51.48 PM.png

Step 7: Access your custom sprites

  • Directly above the Upload Sprite button, click on Your Sprites

  • Drag sprites from here into your program or reference their image label here

Screen Shot 2021-02-18 at 5.12.49 PM 2.png
Screen Shot 2021-02-18 at 6.09.53 PM.png
Screen Shot 2021-02-18 at 6.10.27 PM.png



TIP: If you’re looking for images using Google, use the “transparent” setting to find images that don’t come with an included background!

  1. Enter a search term in Google Images

  2. Click on Tools

  3. Click on the Color option

  4. Select Transparent

Screen Shot 2021-02-18 at 6.27.27 PM 2.png