Build awesome games on CodeGuppy - A guide for Code.org users

If you've completed Code.org courses, you already understand the fundamentals of programming — loops, variables, conditionals, functions, and events. You might have even built simple games in Game Lab or created projects with App Lab. That knowledge is valuable, and it's time to put it to work on a platform that lets you build bigger, more creative games.

codeguppy.com is a free platform where you can build real games using JavaScript — and your Code.org experience gives you a head start.

What you already know from Code.org

Let's take stock of what you've learned:

  • Variables to keep track of scores, lives, and positions
  • Conditionals to make decisions (if the player touches the enemy, lose a life)
  • Loops to repeat actions (move all enemies, draw all stars)
  • Functions to organize your code
  • Sprites to create characters that move around the screen
  • Events to respond to keyboard and mouse input

All of these concepts work on codeguppy.com. You don't need to relearn any of them.

Let's build a game together

Here's a simple game you can build right now on codeguppy.com. It uses concepts you already know from Code.org, plus some cool new features.

Step 1: Create a player

let player = sprite("adventure_girl", 400, 500);
player.scale = 0.5;

On codeguppy.com, sprite() lets you pick from a library of built-in characters. No need to draw your own or upload images!

Step 2: Add movement

background("lightblue");

function loop()
{
    clear();

    if (keyIsDown(LEFT_ARROW))
    {
        player.position.x -= 4;
    }

    if (keyIsDown(RIGHT_ARROW))
    {
        player.position.x += 4;
    }
}

If you used keyDown("left") in Code.org Game Lab, keyIsDown(LEFT_ARROW) on codeguppy.com will feel very familiar. Same concept, slightly different syntax.

Step 3: Add collectible items

let score = 0;
let coins = [];

for (let i = 0; i < 5; i++)
{
    let coin = sprite("coin", random(50, 750), random(50, 400));
    coin.scale = 0.3;
    coins.push(coin);
}

You just created an array of coin sprites scattered across the screen — using a loop, exactly like you learned on Code.org.

Step 4: Add collision detection

for (let coin of coins)
{
    if (player.collide(coin))
    {
        coin.remove();
        score += 10;
    }
}

Collision detection on codeguppy.com is simple and powerful. When the player touches a coin, the coin disappears and the score increases.

Step 5: Display the score

fill("black");
textSize(24);
text("Score: " + score, 20, 30);

And just like that, you have a basic game with a player, collectible items, collision detection, and a score display!

What CodeGuppy adds to your game-building toolkit

A much bigger canvas

Code.org Game Lab gives you a 400x400 pixel canvas. codeguppy.com gives you an 800x600 canvas — three times more space! That extra room makes a real difference when you're building games with detailed backgrounds, multiple enemies, and complex level layouts.

Built-in sprite library

codeguppy.com gives you built-in sprites and assets. Browse the asset library and let the characters inspire your game ideas.

Multi-scene games

Build games with real structure:

  • Scene 1: Title screen with game instructions
  • Scene 2: The actual gameplay
  • Scene 3: Game over screen with final score

Each scene has its own code, which keeps your project organized as it grows.

Sound and music

codeguppy.com lets you add sounds and music to your games, making them more immersive and fun to play.

Tile-based games

Interested in building RPGs or platformers? codeguppy.com supports tile-based game development, where you can create game worlds using a grid of tiles.

Game ideas to try

Now that you know the basics, here are some game ideas to build on codeguppy.com:

  1. Dodge the falling objects - A player moves left and right to avoid objects falling from the top of the screen
  2. Maze runner - Navigate a character through a maze using arrow keys
  3. Space shooter - A spaceship that shoots projectiles at incoming enemies
  4. Catch the items - Items fall from above and the player catches the good ones while avoiding the bad ones
  5. Side-scrolling runner - A character that runs and jumps over obstacles

Each of these games uses concepts you already learned on Code.org — just with more creative freedom and better tools.

Start building now

You have the skills. You have the platform. All you need is an idea and the willingness to experiment. Head over to codeguppy.com, explore the example games for inspiration, and start building something awesome.

Happy coding!

Read more blog articles Browse JavaScript projects

About codeguppy

CodeGuppy is a FREE coding platform for schools and independent learners. If you don't have yet an account with codeguppy.com, you can start by visiting the registration page and sign-up for a free account. Registered users can access tons of fun projects!

Follow @codeguppy on Twitter for coding tips and news about codeguppy platform. For more information, please feel free to contact us.