WEEK 7 - Sprites, Animation & Sound

Lesson 7.1

Lesson 7.2

Lesson 7.3

Overview

Topic: Game Planning - Digital Storyboarding

Key Terms:

Sprites

Pixels

RGB

Graphics

Animation

Pixels

Sound

Digital

Analog

LESSON 7.1 - Graphics/ Sprites/Characters

Lesson Plan: Graphics/Sprites

Gaming graphics, sprites/characters

TEKS 3B (3) Creativity and innovation--innovative design process.

(B) discuss and implement a design process that includes planning and selecting digital tools to develop and refine a prototype or model through trial and error

Learning Objective

I will learn how to create sprites using pixel art

Success Criteria

I can explain pixels along with creating art
I can create a sprite
I can animate a sprite

ENGAGE

EXPLORE

Review

What was different about designing from scratch vs. modding?
When was the design process most engaging? What challenges did you face?
How did you collaborate? What was challenging?
How did it feel to develop a game around a specific game quality for the player?
What role did empathy play in your design process? Playtesting?

Pixels, RGB and Graphics

Game Design Concepts

Pixels
RGB
Graphics
Sprite

Using paper and colored pencils. Select and image a graph paper and try to draw pixelated image

What is R.G.B.?

What is a sprite?

A sprite is a two-dimensional (2D) graphical object used in computer graphics, particularly in video games. It typically consists of a bitmap image or a series of images that are combined to create an animation. A sprite can be thought of as a separate entity that exists within a larger scene, such as a video game world.

The ability to create flexible and efficient animations is one of the main benefits of using sprites. In many video games, the game world is made up of individual elements, each represented by a sprite. These sprites can move independently and can be manipulated, e.g. rotated, scaled, tinted with different colors,....

What are Pixels?

The pixel -- a word invented from picture element -- is the basic unit of programmable color on a computer display or in a computer image. Think of it as a logical -- rather than a physical -- unit.

Pixels are the smallest unit in a digital display. Up to millions of pixels make up an image or video on a device's screen. Each pixel comprises a subpixel that emits a red, green and blue (RGB) color, which displays at different intensities. The RGB color components make up the gamut of different colors that appear on a display or computer monitor.

When referencing the resolution of a display, numbers like 1920 x 1080 refer to the number of pixels.

Pixels Unplugged. Print out the linked document below to create pixel art on paper.

Materials needed: Colored pencils and worksheet print outs

Pixels by number

pixel_art_coloring_page_636bbfb3a3.pdf

Pixel Art Graph paper and templates

Pixel Art Samples

EXPLAIN

ELABORATE

How do you create Pixel Art?

Watch Video below to learn how to get started using the piskelapp.com website to create pixel art.

How-to-create-a-Pixel-Art-gif-using-Piskel.pdf

Watch the video below and crete a pixel art character follow the steps from the video.

https://www.youtube.com/watch?v=N0TAOUe6fG4 7 minute intro

List of How to Videos to design Pixel Art

EVALUATE

What is a sprite?

What are pixels?

How do you create pixel art?

Create a sprite of choice using piskelapp.com and share with class

LESSON 7.2 - Animation

Lesson Plan: Animation

How is animation used in Game Design?

TEKS 4A (4) Creativity and innovation--emerging technologies.

(A) evaluate how changes in technology throughout history have impacted various areas of study;

Learning Objective

I will create an animated sprite using pixel art

Success Criteria

I can explain how animation works

I can create an animated sprite

ENGAGE

EXPLORE

Review

What are pixels?
How do you create pixel art?
What are sprites and how are they used?

What is Animation

Computer Science Concepts

Stop Motion
Animation
Frames
FPS

How to create a Flipbook?

Materials:

How to Make a Flipbook video
Blank index cards or blank paper folded into a small booklet
pencil

EXPLAIN

ELABORATE

How to create a sprite and import it into a Scratch account.

You'll need to us scratch.mit.edu for the following lesson.
Create a teacher Scratch Account or log into your existing account and setup up classes for your Game Design Course.
Add students to your class by sharing class link
Make sure students keep track of their Scratch Login Information

Teach-Kids-Pixel-Art-Animation-for-Games.pdf

Pixel Art Animation for Games

Discussion Questions

How did you feel about creating your own sprite and uploading it into Scratch?
What are other sprites you would like to create?
What have you learned about making an image look like its animated and moving?

Practice using the following videos to animate pixel art.

How to make sprite walk?

EVALUATE

What is animation?

What is the importance of frames-per-second?

Share your animation creations

LESSON 7.3 - Sound

Lesson Plan: Sound

How can you explain and manipulate digital sounds?

TEKS 4A (4) Creativity and innovation--emerging technologies.

(A) evaluate how changes in technology throughout history have impacted various areas of study;

Learning Objective

I will be able create and manipulate digital sounds

Success Criteria

I can explain what makes sound

I know how to create digital sounds

I can change sounds digitally

ENGAGE

EXPLORE

Review

What is animation?
What is the importance of frames-per-second?
Share your animation creation

Digital Sound

Computer Science Concepts

Binary
Analog
Digital
Sound

What is Binary?

Binary lesson.pdf

EXPLAIN

ELABORATE

Analog vs Digital Sound

What is Analog?

What is Digital?

What is the difference between
Analog and Digital Sound?

Scratch and Sound

Follow steps in video to create and edit sounds.

EVALUATE

What do you know about sound?

Can you explain binary numbers?

What is the difference between analog and digital?

Resources

Pixel Art Samples

pixel_art_coloring_page_636bbfb3a3.pdf

Binary lesson.pdf

How-to-create-a-Pixel-Art-gif-using-Piskel.pdf

Page updated

Report abuse