In these tough times, we band together.

We’re offering premium online learning experiences right now, with pricing designed to stretch your family’s budget. For ages 7-19.

In these tough times, we band together.

We’re offering premium online learning experiences right now, with pricing designed to stretch your family’s budget. Ages 7-19.

An intro guide to game coding for kids

iD Tech in action

Take whatever preconceived ideas you’ve formed about coding and throw them out the window. 

Sure, there is a lot of what is witnessed in movies and on TV, whether that’s the scripting and characters you see enveloping a computer screen, or the intent staring and tinkering of the person sitting in front of that screen.

But, my point is, coding isn’t an activity devoid of creativity. There is a lot of fun, imagination, and awesome output that goes into (and comes out of) coding as well. 

Because think about it—all a programming language really is, is a way to communicate instructions to a computer. From there, once that code is transmitted, the output is magical, powerful, and obviously, oh so valuable.

One of the best ways to bring coding to life is through something like games, where a language like JavaScript can take your child’s zany world and cool character ideas and bring them to life. 

Said simply, JavaScript can change what you see on a web page, cause that page to react to user input, run games, and much more.

Examples of JavaScript in action

To help explain, have you or your child ever come across an interactive webpage? Of course you have! You can’t get far on the web without running into a website that features a cool flippable slideshow, lifelike virtual tour, or other cool experience. 

Well, while HTML is the language of websites, interactive web pages and games are made with JavaScript. Here are a few examples:

This Memory Game is an example of a JavaScript game that involves clicking on buttons and using functions to determine whether there's a match.

Multeor is an advanced JavaScript game that turns your phone into a controller to move a meteor through maps.

And this Tearable Cloth program uses objects and mouse clicks to determine whether or not your mouse is moving the material. It utilizes a combination of physics and advanced JavaScript commands to create this simulation.

Terms to know

HTML? Commands? Yes, any new coding adventure is going to introduce new terms and jargon kids will probably have to learn and wrap their heads around in order to advance with their learning. Here are a few coding terms they can get started with:

HTML is a language made of <tags> that create web pages. Web browsers read this code to display web pages.

JavaScript libraries are databases of pre-written functions and code that can be referenced and used to streamline coding.

Variables are containers in code that can hold a single number, word, and other information. The three different parts of a variable include type, name, and value. 

Variables should be named using camel case, meaning the first word of the name is lowercase and each new word after that is capitalized.

Scripts are sets of steps that a programmer writes for a computer to follow. Computers process these steps line-by-line from top to bottom. 

The steps are made by writing a statement, which should always start on a new line and end with a semicolon. JavaScript code is a list of instructions called statements.

A function then is a group of statements in a script that can be reused to perform a specific task. For example, imagine teaching a robot to tie their shoes. Every morning, you could give the robot each step one at a time: Pick up the left shoelace with your left hand, move it across your shoe, etc. However, this would take a long time. Instead, a function could be programmed —  tieYourShoes() — and now only one command that contains all the steps would need to be given.

Coders can use comments to leave notes in their programs without affecting the code. Comments are ignored by the computer, but allow creators to make notes and leave reminders throughout their code.

Operators are symbols used to evaluate a mathematical expression. 

An expression is two variables separated by an operator, like 2+2.

And last, a game mechanic is any active player action or an event within the game. These actions come together to create a compelling game to play.

And don’t forget the star of the show

For anyone wanting to code their own game, it’s not just about learning new vocabulary and obtaining the skills to do so, but also requires adapting the creative mindset to properly map that game as well.

Such required planning ranges from overall game mechanics, to worlds, player goals, and a lot more. Thus, any young creator should take time and care in plotting out what they want from their games before diving in. 

Not least of which is the character—or, the star of the show! 

Really, most great games don’t exist without stories, and those stories are difficult to put together without characters. 

For instance, imagine Pokémon without any characters. There wouldn’t be any trainers to battle or monsters to collect... just an empty world with lots of vacant gyms and tall grass, without any of the fun you expect from the series!

Digging into the fundamentals of character design is one area where imagination and creativity come into play, so encourage kids to explore:

  • What world does their character come from?
  • What species are they? Are they human?
  • What role does the character play in the story?

Characters are just like people in real life—they have backstories and features that make them unique. 

Getting started

As you can see, coding a game is no small activity, and involves a lot more than what has already been explained above, including things like animation, character movement, game space, and other pieces. But that’s what makes a great game so special! 

If your child is interested in coding their own game, check out the resources below, and think about pairing them up with expert help! 

Virtual Tech Camps are available now for students wanting to create and socialize with like minded peers. Those looking for more one-on-one guidance can take part in Online Private Lessons.

Resources

MakeCode
When kids first start writing JavaScript, they can use the MakeCode website from Microsoft, which offers interactive drag and drop code blocks that can help kids get a feel for and start to understand the basics.

Piskel
Kids can customize games and really learn to make them their own by creating sprites! Even if they’re not an artist, Piskel is a type of pixel art software that can be used to create sprite assets for games.

A photo of Ryan

Ryan manages blog content at iD Tech, starting with the company in 2008. He earned his MBA from Santa Clara University after obtaining his Bachelor’s degree from Arizona State. Connect on LinkedIn!

Get Brochure