Welcome to Our Homeschool Game Design Curriculum: Web Game Design

Course Sample for Our Web Game Design Curriculum

HTML5 Canvas and JavaScript Lesson 3: Screen Coordinates and Colors

This week we are going to take a closer look at the way we specify locations and colors on the <canvas> drawing surface.

FillStyle Colors

Remember last week that we selected a color for our filled-in shapes using the fillStyle property:

ctx.fillStyle = “blue”;

The fillStyle property is very flexible, and can be used to choose a solid color or even a gradient or pattern! You can use several different formats to choose a color. Here are a few of the color options:

Open your existing “index.html”. Try setting the fillStyle using the rgb() pattern with red, green, and blue components. What interesting colors can you make that don’t match any pre-defined name?

To view a full sample of this course, click here.

Transcript Information for Our Web Game Design Curriculum

More About Our Web Game Design Curriculum

Welcome to the SchoolhouseTeachers.com Web Game Design curriculum! Chris Yust, co-author of eight computer programming books for kids and teens, guides homeschool students through a digital adventure.

Please carefully read these student prerequisites before continuing:

• Web Game Design curriculum students must have access to a Windows PC or Mac OS desktop/laptop computer. Many of the homeschool computer course lessons involve hands-on projects on the computer, and generally speaking, a tablet or smartphone will be insufficient or cramped.
• This course should work across nearly all versions of Windows and Mac OS. However, the student MUST have a reasonably recent web browser that supports HTML5, such as: Internet Explorer 11+, Firefox 25.0+, Safari 7+, Google Chrome 30+
• Material is geared for 6th-12th grade homeschool students in a self-study environment. Teachers do not have to be computer science experts themselves! Younger students may participate at the parent’s discretion; just be prepared as a teacher to offer them additional guidance and assistance as needed.
• Web Game Design curriculum students should already be fundamentally familiar with computers for daily use. These homeschool computer lessons do not cover computer “literacy” topics such as how to use a mouse, keyboard, or navigate through an operating system.
• This course does not cover word processing, spreadsheets, or presentations, nor are those skills needed for the work in these lessons.

The Web Game Design lesson format typically includes some instructional material, as well as a hands-on activity the homeschool teen can complete on their own computer. Students may expect to spend about one hour per week completing the lessons and activities, though they are encouraged to creatively expand projects on their own if desired.

Please contact Mr. Yust with questions at chris@HomeschoolProgramming.com.