Teach coding to your kids with this maze game [VBA]

My twins (Nishanth & Nakshtra) are now almost 7. They are super keen to learn how computers work. So the other day, I showed them Code.org where there are several coding exercises disguised as games. They loved those games … err coding exercises. So that got me thinking… why not make a game in Excel that teaches kids simple programming concepts.

Here is the version 1.0 of Snowman & Hot Chocolate Maze game:

In this post, let’s understand how to build such a game using Excel VBA.

The idea

This maze game is inspired from the Angry Birds coding game at Code.org

The idea is simple. We create a 16×16 grid in Excel. We position a snowman at a certain point in the grid. We place a cup of hot chocolate at another point. The goal is to make snowman reach hot chocolate with a series of commands. Of course there will be obstacles (walls).

Typical Blank Maze with Snowman & Hot Chocolate loaded.

Since kids will be playing this, we need considerable variety of mazes. So let’s assume that,

• There can be any number of mazes, one per spreadsheet.
• Each maze can have a different design, different starting & ending positions.
• Each maze can also have its own images (ie Rabbit & carrot in one maze, Kid and ice cream in another etc.)
• Making new mazes should be easy. You can copy a worksheet, paste it, change the settings and all the code should work just the same.

The implementation

There are two components in this game.

1. The front end – ie what players see
2. The back end – ie our VBA code

Designing the front end

Here is the basic layout of our maze front end.

We will create sheet specific named ranges for,

• grid for the maze
• settings for the settings
• code.start for the first cell of the code

Displaying the symbols:

We can use the Segoe UI Emoji font. This font is part of all modern versions of Windows. This has a fine collection of various emojis that you see everywhere nowadays. The Emoji hex codes are,

• 26C4 for Snowman
• 2615 for hot chocolate
• 2603 for Snowman with snow flakes

You can find more such emojis. Just go to Insert > Symbol and switch the font to Segoe UI Emoji font.

Note: download Segoe UI Emoji font if you don’t have it.

Adding the obstacles:

You (ie the parent) can write o in any cell inside the maze to build an obstacle there. So once a new maze is cloned (ie a new worksheet is copy pasted), simply create a maze layout by typing o into various cells.

Pro tip: Just select the maze layout you want with CTRL+Select option and the type o in any cell and press CTRL+Enter to get o in all cells.

All these os will be displayed as walls thru conditional formatting.

Designing the VBA back end

There are two parts to our VBA code.

• Setup the maze
• Solve the maze

Setting up the maze

The logic for this is simple.

1. Clear the grid contents, except when the cell has “o”
2. Set up snowman at starting position
3. Set up hot chocolate at ending position

Here is the code for Maze setup.

Private Sub setupGameSheet(name As String)
    'set up game sheet given by name
    Dim grid As Range, settings As Range, code As Range, cell As Range
    With Sheets(name)
        Set grid = Range("grid")
        Set settings = Range("settings")
        Set code = Range("code.start")
        
        For Each cell In grid
            If cell.Value2 <> "o" Then cell.ClearContents
        Next cell
        
        grid.Cells(settings.Cells(1, 1), settings.Cells(1, 2)) = settings.Cells(1, 3)
        grid.Cells(settings.Cells(2, 1), settings.Cells(2, 2)) = settings.Cells(2, 3)
        
        Set grid = Nothing
        Set settings = Nothing
        Set code = Nothing
    End With
    
End Sub

Solving the maze

This is where things get tricky.

Simplified algorithm for this goes like,

• For each line of the code
  • Check the first character of the code.
  • If L, go left
  • If R, go right
  • If U, go up
  • If D, go down
  • by the number of steps indicated after first letter.
  • If the new position falls outside grid
    • If so, display an error and end macro
  • If the new position leads in to an obstacle
    • display an error and end macro
  • Else
    • Print a snow man along the pathway
  • If snow man reaches ending position
    • Print snow man with snow flakes. End macro
• Continue to next line of code
• If at end of all code, the snow man still not at ending point
  • Display an error message

Here is the code for this:

Private Sub runCode(name As String)
    'runs the code in sheet given by name
    
    setup
    
    Dim code As Range, settings As Range, grid As Range, steps As Integer
    Dim newx As Integer, newy As Integer, symbol As String, done As Boolean
    Dim endx As Integer, endy As Integer, oldx As Integer, oldy As Integer
    
    Set grid = Sheets(name).Range("grid")
    Set settings = Sheets(name).Range("settings")
    Set code = Sheets(name).Range("code.start")
    
    newx = settings.Cells(1, 2)
    newy = settings.Cells(1, 1)
    symbol = settings.Cells(1, 3)
    done = False
    endx = settings.Cells(2, 2)
    endy = settings.Cells(2, 1)
    
    While (Len(code) > 0 And Not done)
        oldx = newx
        oldy = newy
        
        steps = getNumber(code.Value2)
        Select Case UCase(Left(code, 1))
            Case "L"
                newx = newx - steps
            Case "R"
                newx = newx + steps
            Case "U"
                newy = newy - steps
            Case "D"
                newy = newy + steps
            Case Else
        End Select
        
        'check the boundary
        If newx < 0 Or newy < 0 Or newx > 16 Or newy > 16 Then
            MsgBox "Don't leave the box!", vbCritical + vbOKonlym, "Hold it there tiger..."
            done = True
        'check for obstacles
        ElseIf hasObstacles(Range(grid.Cells(oldy, oldx), grid.Cells(newy, newx))) Then
            MsgBox "Cant move there!", vbCritical + vbOKOnly, "Oo ooh! The snow man hit an obstacle"
            done = True
        Else
            Range(grid.Cells(oldy, oldx), grid.Cells(newy, newx)) = symbol
            
            If newx = endx And newy = endy Then
                done = True
                grid.Cells(newy, newx) = ChrW(doneSymbol)
            End If
            
        End If
        killTime
        Set code = code.Offset(1)
    Wend
    
    If Not done Then
        MsgBox "Your snowman is thirsty, fetch him the hot chocolate", vbCritical + vbOKOnly, "Try Again"
    End If
    
    Set grid = Nothing
    Set settings = Nothing
    Set code = Nothing
    
End Sub

Supporting functions

To keep the code clean, I have created two functions and one sub. They are here.

Const doneSymbol = &H2603
Const speed = 900 'change this to speedup / slowdown the game

Function getNumber(ByVal fromThis As Variant) As Integer
    'extract the number after first character
    'return 1 incase of error
    
    getNumber = 1
    On Error Resume Next
    getNumber = CInt(Mid(fromThis, 2))
    
End Function

Sub killTime()
    Dim i As Long
    
    For i = 1 To speed
        DoEvents
    Next i
End Sub
Function hasObstacles(thisRange As Range) As Boolean
    Dim cell As Range
    
    For Each cell In thisRange
        hasObstacles = hasObstacles Or cell.Value = "o"
        If hasObstacles Then Exit Function
    Next cell
End Function

Linking front end & VBA

Now that our UI & Code are ready, let’s link them up.

We set up two buttons on the worksheet (using rounded rectangle shapes), one for setup and other for running.

We write two simple macros and assign them to the buttons.

Sub setup()
    setupGameSheet ActiveSheet.name
    
End Sub

Sub run()
    runCode ActiveSheet.name
End Sub

And our game is ready.

Let’s roll, the snowman is thirsty.

Download the Maze Coding Game

Go ahead and download the game workbook here. Examine the code to learn more. Ask your kids to play for some fun. The workbook contains 3 mazes. Feel free to add more.

How to extend this game?

Here are few ways to extend the game.

• Add special point cells to the grid. When snowman passes thru these cells, score goes up.
• Add a special power cell. If snowman reaches this cell, he gains the ability break obstacles.
• Play sounds for jumps, points and breaks.

How do you like this?

My kids loved the idea. At the same time, they don’t want to play more than 2 puzzles at a time. I think they are attracted to Oggy and the cockroaches more than programming for now.

What about you? Do you find such games useful to teach programming and a love of computers to your kids. Let me know your experience once trying this.

Learn how to code yourself

Not just kids, anyone can benefit by learning how to program. So if you are new to coding, check out our five part tutorial on VBA.