Our goal at Kodable has always been not to just teach kids how to think like a programmer, but to prepare them to learn a real programming language by the time they reach middle school. The challenge that most educators face when making this jump is that block-based coding and syntax based coding are very visually different things. This is where we see most kids get frustrated and stop coding altogether! You can’t simply toggle from one to another and assume kids will make the connection. And that’s why we created KODE.
Short for Kid-Optimized Development Environment, KODE is the culmination of seven years and hundreds of hours of hands-on experience teaching kids how to code. With KODE, kids of all ages are empowered to use real JavaScript or Swift to write their own properties, functions, and more while building their very own characters and games.
Let’s get ready to KODE!
The important part of programming isn't the code itself, but your understanding of the computer science concepts that code represents. With KODE, we’ve abstracted away the frustrating aspects of writing code and focused solely on the important parts. Take the following line of JavaScript in our fuzz builder:
this.body = new FuzzBody(“Black”);
This line of code sets the body type of a created fuzz character to have black fur. There are seven different parts to this one line of code:
- The keyword “this”
- The property “body”
- The “=” sign
- The word “new”
- The Class “FuzzBody”
- The string “Black”
- The semicolon
If that looks like a lot - it is! What’s more, if you’re an educator, you know that explaining all seven of these parts to a six or seven year old child is going to be…a challenge. Well, the good news is that with KODE you don’t have to – because while there are seven pieces, there are only two important parts on this line:
- Choosing the property we want to set - ‘this.body’
- Setting the value for that property - “new FuzzBody(“Black”);.
With KODE, we focus on maintaining a one-to-one relationship between logical segments of code and a child’s interaction with that screen (i.e. a tap or click) to reinforce comprehension of key concepts while abstracting out the excess noise. In this instance, all a child needs to do is tap to choose they want to set the body type:
Then select the corresponding body type that they’d like to use:
You’ve written a line of JavaScript!
The KODE Editor
Now, when using the KODE editor, you’ll see the KODE editor everywhere you write code. We’ve designed it to be modular – so you might see slightly different versions in Asteroidia than the Fuzz Builder – but the editor is separated into five logical parts:
Toolbar:
This is where you configure your work environment. Here you can do things like navigate between files, run your code, and toggle between displaying JavaScript and Swift code output.
Source Editor:
This is where your code lives. Newly written lines appear here, and lines you have completed can be edited here as well.
Utility Area:
This is where you go first to write your code! It is separated into two parts:
Library Pane:
You can add properties and functions from here, and contextual hints help kids know where to place them in their programs.
Value Pane:
When writing a new function or property, the library pane will contextually swap with the value pane to show all available values and inputs available for the code you are writing.
Simulator:
See the output of your code here. This is done in real time, so all changes are visible immediately after writing each line.
Learning is a life-long journey, pace yourself!
“Now what about those other areas you didn’t use?” you might ask. “Aren’t they important?” Of course they are! But not for six year-olds. Most kids at these ages are still learning how to write their names, let alone write code. We have a long time before they’ll be building the next Google or Facebook, so its OK if we start with just the essentials and add more detail as they get older.
We’re just getting started
This is just the first step in what is an exciting new chapter for Kodable. In the coming months we’ll be adding all kinds of new features to KODE, integrating it more fully into the all-new Bug World, and making it easier for kids to share their creations with the world. We can’t wait to share it all with you soon!
