Robotok.io

Learn to code with Bobot the Robot! A game to help you learn to speak robot.

DesignIllustrationHTML/CSSJS/Canvas

Robotok is a site to teach kids how to “speak robot”. By entering commands, you can control how Bobot the Robot moves around his isometric world. I must admit that writing the mini framework for the levels was even more fun than drawing the isometric objects. After a few days of refactoring, creating a level boils down to something like this:

if (scene.game.activeScene == ‘level6’) {<br /><br />
		scene.createSprite(‘greenTile’, { x: 4, y: 1 });<br /><br />
		scene.createSprite(‘key’, { x: 0, y: 0 });<br /><br />
		scene.createSprite(‘gate’, { x: 2, y: 1 });<br /><br />
		scene.createSprite(‘wall’, { x: 2, y: 0 });<br /><br />
		scene.createSprite(‘wall’, { x: 2, y: 2 });<br /><br />
		scene.createSprite(‘wall’, { x: 2, y: 3 });<br /><br />
		scene.createSprite(‘wall’, { x: 2, y: 4 });<br /><br />
		scene.player = scene.createSprite(‘robot’, { dir: ‘SE’, x: 0, y: 2 });<br /><br />
	}

if (scene.game.activeScene == ‘level6’) {

scene.createSprite(‘greenTile’, { x: 4, y: 1 });

scene.createSprite(‘key’, { x: 0, y: 0 });

scene.createSprite(‘gate’, { x: 2, y: 1 });

scene.createSprite(‘wall’, { x: 2, y: 0 });

scene.createSprite(‘wall’, { x: 2, y: 2 });

scene.createSprite(‘wall’, { x: 2, y: 3 });

scene.createSprite(‘wall’, { x: 2, y: 4 });

scene.player = scene.createSprite(‘robot’, { dir: ‘SE’, x: 0, y: 2 });

}

I think the goal of a site like this is to get it to a point where adding new levels is just a matter of positioning the items. There’s still a lot that could be built into the backend, in terms of interactions with items and different types of terrain, but for the most part you can just type out a level map (like above) and it’s ready to go.

About Robotok.io

Robotok.io is here to help you learn to speak robot. “Well,” you might ask, “Why would I want to learn to speak robot?”

The answer is simple: our whole world speaks robot. Our phones speak robot, our cars speak robot, our computers, our watches, our televisions, and our homes speak robot. They speak robot at banks and at the hospital, and while building rocket ships to the moon.

“Speaking Robot” is just another way of saying speak the language of computers, known as code. We’re lucky to live in a time where the robot language isn’t as cryptic as it used to be. Computer code is usually quite similar to English, only with fewer words and some interesting symbols thrown in.

Knowing how to speak robot is incredibly advantageous; you’d be surprised how much your life can be improved by harnessing the digital world around you. Here at Robotok.io, our goal is to teach you to speak robot, and to help you have fun while doing it!