A sprite in video games is a picture or animation that represents a character, object, or effect, like a player, enemy, or explosion. It's like a sticker that can move around on the game screen, letting players see and interact with different parts of the game.

Video Tutorial on using Sprites

[https://editor.p5js.org/des8963/sketches/b27S2aAZC](https://prod-files-secure.s3.us-west-2.amazonaws.com/2e0ddbc5-46f0-43d3-abca-17258b8b49b2/ec18a7a5-f939-47c7-844e-d123273af0f7/p5PlaySprite.mp4)

https://editor.p5js.org/des8963/sketches/b27S2aAZC

Create a Sprite

Default Sprite at center of canvas

Specifying Sprite Color

let invader;

function setup() {
  createCanvas(400, 400);
  invader=createSprite();
}

function draw() {
  clear();
}

let invader;

function setup() {
  createCanvas(400, 400);
  invader=createSprite();
  invader.color="red";
  // or use hex color
  // invader.color="#ff0000";
}

function draw() {
  clear();
}

Sprite Shape Variations

Default Square in center of canvas

Default Square at (100,100)

function setup() {
  createCanvas(400, 400);
  invader=createSprite();
}

let invader;

function setup() {
  createCanvas(400, 400);
  invader=createSprite(100,100);
}

function draw() {
  clear();
}

Circle

Rectangle

let invader;

function setup() {
  createCanvas(400, 400);
  // set a diameter of 30 creates a circle
  invader=createSprite(100,100,30);
}

function draw() {
  clear();
}

let invader;

function setup() {
  createCanvas(400, 400);
  // width of 100, height of 30
  invader=createSprite(100,100,100,30);
}

function draw() {
  clear();
}

Additional Polygons: