Demonstration IDC 2017, June 27–30, 2017, Stanford, CA, USA

Tuk Tuk:
A Block-Based Programming Game

Chonnuttida Koracharkornradt Abstract

Stanford University Studying computer programming helps children develop
520 Galvez Mall, Room 102 computational thinking, a problem-solving methodology
CERAS Building that can be transferred to solve everyday problems.
Stanford, California, 94305, USA Additionally, exposing children to an advanced
[email protected] computational concept of search algorithm allows them
to see how different problem-solving techniques are
designed to tackle more challenging tasks, and improve
their ability to solve problems. We present a block-
based programming game called Tuk Tuk for children in
kindergarten level (junior version), and elementary and
middle school level (standard version). With Tuk Tuk,
learners create a computer program in a block-based
language to control a car to complete a given task,
earn money, reach the next level, and unlock new
coding blocks. By completing each task, learners will
learn important computational concepts and algorithms,
a basis of computational thinking, such as conditionals,
Permission to make digital or hard copies of part or all of this work for iterations, depth-first search (DFS) and breadth-first
personal or classroom use is granted without fee provided that copies are search (BFS).
not made or distributed for profit or commercial advantage and that
copies bear this notice and the full citation on the first page. Copyrights
for third-party components of this work must be honored. For all other Author Keywords
uses, contact the Owner/Author. Block-Based Programming; Game
IDC '17, June 27-30, 2017, Stanford, CA, USA
© 2017 Copyright is held by the owner/author(s).
ACM ISBN 978-1-4503-4921-5/17/06. ACM Classification Keywords
http://dx.doi.org/10.1145/3078072.3091990
D.2.6 Programming Environments

725
 Demonstration IDC 2017, June 27–30, 2017, Stanford, CA, USA

Introduction these platforms present programming concepts in the

Studying computer programming helps children develop game-based learning. Games have been used for
computational thinking [1]. We present a block-based educational purposes for a long time as they are not
programming game Tuk Tuk for beginners, specifically only fun, but also provide a competitive environment
kindergarten students (junior version), and elementary where students can compare their abilities and learn
and middle school students (standard version), which from others, which encourages engagement and
introduces basic computational concepts, a basis of motivates students in the learning process [4].
Figure 1: Learners use coding computational thinking [1]. With Tuk Tuk, learners use
blocks to control a car in the coding blocks to control a car in the standard version In order to teach young children programming concepts
standard version. (Figure 1), or simply move the car (programming-by- that are considered “too advanced” for their age,
example) in the junior version (Figure 2). A chain of Topobo [5] uses programming-by-example concept
coding blocks, such as “pick up”, “forward”, and “drop where a child can program a robot by physically
off”, forms a program to complete a given task after pushing and pulling the moving parts. Inspired by this
which the player earns money, reaches the next level, approach, we develop a junior version of Tuk Tuk.
and unlocks new coding blocks.
A more advanced programming concept of algorithms is
While there are a number of programming platforms incorporated into the game in order to allows children
with a goal to encourage an understanding of basic to see how different problem-solving techniques are
Figure 2: Learners move the car
computational concepts, our focus is on a concept that designed to tackle the more challenging tasks, and
to control the car itself
does not normally made available to children—the improve children’s ability to solve problems [6]. The car
(programming-by-example) in
search algorithms i.e. depth-first search (DFS) and metaphor lends itself well to the path finding algorithms
the junior version.
breadth-first search (BFS). using in Google maps, in which DFS and BFS are the
simplest graph search algorithms to learn.
Related Work
In order to have children engage in a meaningful way Design
with the learning process, the tools have to provide a 1) Design Overview
low floor (easy to get started), and the designers have The main game screen consists of three sections. The
to selectively expose the foreground with respect to the “Game Status” section at the top left area of the screen
learning goal and black box others [2]. Block-based shows player’s name, level, money, and current task to
programming language follows the pattern by be completed. The “Map” section at the bottom left
blackboxing the syntax of programming, which results area of the screen runs and displays the result of the
in an easy-to-use interface, and allows learners to jump program. The “Script” section at the right area of the
into the central ideas of programming right away [3]. screen shows the program being developed (Figure 3).

While several block-based programming platforms have Tuk Tuk allows learners to program by using a block-
been developed (e.g. Scratch, Snap), relatively few of based language or programming-by-example method,

726
 Demonstration IDC 2017, June 27–30, 2017, Stanford, CA, USA

as well as implement DFS and BFS algorithms. There long script and encourage learners to think about how
are multiple solutions to complete each task, and to solve the problems efficiently.
learners have to decide on how to solve the problem.
2.3) “Run Program” Button and Map Simulation Area
2) Core Mechanics (“What is possible?”) Tuk Tuk allows rapid iteration, the ability to add or
2.1) Coding Blocks delete blocks to a script and see the result quickly.
Tuk Tuk’s coding blocks are represented as simple Learners can run a program fragment at any time to
Figure 4: Sample of visual phrases so that learners can intuitively understand see what it does. When the “Run Program” button is
feedback and error message. what each block does. The blocks are color-coded in clicked, the “Map” section will simulate script execution.
order to help learners find blocks in the same category. Learners can check whether the program do what it is
The coding blocks are also easy to manipulate. Learners intended to do, and if the program has an error, an
can click on a coding block in the palette to add it to error message will appear (Figure 4). These features
the script, and click on a coding block in the script area help learners stay engaged in testing, debugging, and
to delete it from the script (Figure 3). Moreover, the improving their program.
coding blocks are designed to have embedded
syntactical error correction. For example, learners can 3) Built-in Pedagogy (“How what is possible is made
only insert the “else” block after the “if” block is used. available?”)
Tuk Tuk introduces programming concepts as a game
where learners obtain additional features when they
progress to the next level.

At the beginning, learners only have “forward”, “turn

Click to add a
coding block to left”, and “turn right” coding blocks (Figure 1). As they
the script progress to level 2 and 3, “repeat” blocks and “if-else”
Figure 5: Introducing DFS. Click to delete
blocks will be enabled, respectively (Figure 3). At level
coding blocks
from the script 4, there will be an instructional simulation of what DFS
is, before the DFS coding blocks are enabled (Figure 5).
Level 5 is similar to level 4, but focuses on BFS. The
task for level 4 and 5 is to search for a cat lost in a
town. We also design the solution in a way that the cat
Figure 3: Main game screen layout. will always appear at the last explored grid (Figure 6)
to make sure that the learners has utilized the
2.2) Fuel Blocks algorithms properly. Next, level 6 and 7 allow learners
Figure 6: The cat will always
One fuel block is used for each coding block that to explore the differences and advantages of each
appear at the last explored grid.
learners add to the script. For each task, a limited search algorithm by giving them access to both DFS
numbers of fuel blocks are given in order to avoid too and BFS coding blocks. However, one algorithm is more

727
 Demonstration IDC 2017, June 27–30, 2017, Stanford, CA, USA

preferable than another for a particular map. DFS is § Adding incentive to play the game e.g., learners can
more suitable for level 6, and BFS is more suitable for use money to decorate the car, or share their score
level 7 (Figure 7). Level 8 is similar to level 4 and 5, online and see rankings.
but focuses on a compact version of DFS. At level 9 and § Introducing more advanced computational concepts
10, learners get to apply search algorithms to complex such as artificial intelligence search techniques in
maps (Figure 8). The learners will discover the games (e.g. chess, go, etc.) and allow learners to
advantage of search algorithms as the last two levels compete their created game agent, etc.
are too large to direct the car to explore all spaces
without the usage of search algorithms.
Acknowledgements
We would like to thank Paulo Blikstein, Assistant
Preliminary User Testing Professor at Stanford University, and our TAs for
A 1-hour session interview was conducted with six- and Beyond Bits and Atoms course, especially, Richard
eight-year-old girls (Figure 9). The interface interested Davis, Engin Bumbacher, and Chris Proctor.
the kids and the kids were eager to complete the task.
Figure 7: Explore the differences They loved the designs, and immediately understood
References
and advantages of each search how to use coding blocks to control the car. In addition,
1. Kafai, Y., Burke, Q., & Resnick, M. (2014).
algorithm. we learned that the game mechanism works very well,
Connected Code: Why Children Need to Learn
i.e., the kids enjoyed the game, wanted to play it
Programming. MIT Press.
again, and had fun trying to beat each other. Finally,
the learning goals were met. By completing level-2 2. Papert, S. (1980). Mindstorms: Children,
task, children understood the concept of iterations as computers and powerful ideas. Basic Books, NY.
they managed to put the coding blocks inside the 3. Resnick, Mitchel, John Maloney, Andres Monroy-
“repeat” block in order to make the car repeatedly Hernandez, Natalie Rusk, Evelyn Eastmond, and
perform sequence of actions. We hope that further user Karen Brennan. (2009). Scratch: Programming for
testing will confirm these initial findings and capture all. Communications of the ACM 52 (11): 60-67.
Figure 8: Complex Map.
new ways to improve our design.
4. Combefis, S., Beresnevicius G. & Dagiene, V.
(2016). Learning Programming through Games and
Conclusion and Future Work Contests: Overview, Characterization, and
Tuk Tuk is a block-based programming game that helps Discussion. Olympiads in Informatics Vol.10, 39-60.
children develop computational thinking by learning
computational concepts, especially search algorithms, 5. Hayes Raffle and Cristobal Garcia. (2003). Topobo
through self-directed interfaces. Tuk Tuk can be easily for Tangible Learning. MAS 712 Technological Tools
downloaded online and is ready to use. for Learning.
6. Miller, B. and Ranum, D. (2011). Problem Solving
Figure 9: Preliminary user There are improvements that can be made on Tuk Tuk with Algorithms and Data Structures using Python:
testing. such as: Second Edition.

728