FLOSS Manuals

 English |  Español |  Français |  Italiano |  Português |  Русский |  Shqip

Learn JavaScript with Phaser

Playful, Warm Up and Reflective Approaches

One of my recent inspirations is the book how to become an Explorer of the World. This is a great little book filled with little exercises which can help you to track your own learning and just notice more about what is happening. 

At times, in this book we will hit the pause button and include activities to help us map our progress and communicate what we have been picking up. You may be surprised how much you have taken in along the way. We can call this learning about learning or meta-learning.

Our goal here is to keep a good group working atmosphere going. If you are working as part of a group then that team is a fantastic resource. You all form a pool of knowledge. It would be terrible to lose some of the people in that pool because they felt isolated. Having these kinds of reflective sessions, and time away from the often frustrating problem solving that happens at a computer screen can be a very effective way of maintaining the positive involvement of a wide group. Let's keep hold of all our group by valuing their experience and listening to each others feedback on how we are all finding it.

Warm Up Games

To get us in a plaful state of mind some quick games are suggested which may be helpful at the start of sessions. These games do not suit everyone, and sometimes in group settings some people will moan. But if you set them up quickly and regularly then can be great way to just make sure everyone is present is a degree of focus on how they are communcating with others. Also lots of people do love them as a way of communicating to others in a way that screen based or making activities don't allow.

Starting Games to support a Creative Environment

Circle Game: What animal are you?
Go around the circle. Say your name and what animal you would be.
Now we'll go around again and say our names, what animal you would be and what noise you would make. Everyone repeats the name and the noise made.

If you have time or if you want to return to this in another session, then you can do a similar activty but say your name, your chosen animal and mime how they would move around. Then everyone copies this.

Thoughts on linking this with game making: This game is a great warm up and leveller for families, it can also be a good way to move into choosing characters or starting to think about who and what will be in your games. Many starting games do involve animals. Animal pixel art is relatively easy to create too.

Corner Game: What animal are you?

move to the different

Pin the Tail on the Donkey / Battleships
A game guessing what x and y co-ordinates need to be inputted to either

make a tail stick in the right place relation to a donkey.
This could be followed up using an online version phaser .
This involves a guessing process and debugging your varibles when programming.

Thoughts on linking this with game making: You can use this game to  get started it would be good to play a game that uses x and y co-orindinates and guessing.

Non-digital design activities

Screens can be a barrier to collaborative work. So why not try to have at least one or two non-digital activities in game making sessions.

The use of a variety of materials is good for different cultures of learners. 

We can be inspired by the textiles and technology work that has happened in recent years, and while this is not the main focus of this programme it has been a very useful tool to break out.

Reflection - as goal of meta-cognition, Design with materials more an externalisation of design concepts, re-inforcing role - There is cross over here in technique, it may be best to put both in one chapter.


Playful learning journal / Scrap book

A scrapbook of the materials generated in the session can be used as a way to generate more reflections on progress through reflective activities which add to the materials already there.

This can be supported by a more personal journal. Keeping a record of the kinds of decisions that you have to make in real life, these might not all be as simple as in a game, but can you make a record of some true or false decisions that you make and the resulting outcomes? These could be included in the session scrap book and scaffolded by paper hand outs.


Using physical props to build familiarity with code

A reflective activity to support our journey in how we are interacting with the code.

Recall a one of the early activities and remind ourselves of a debugging process. Possibly when gravity wasn't the right value.

Then use this example activity as a way to use the target language. Functions & Parameters & Variables. And the expressions, calling functions, passing parameters, assigning values to variables.

Printed out code on card. Use different colours for different parts of the code. For inspiration we can look at the colour coding and shapes of scratch project.1

To keep it simple we could just use two colors. Objects (green) the functions (blue), the variables (orange) and parameters (orange).

Discuss the calling of a function with the user of these coloured cards which fit together in different shapes


Reflection Games and other activities to provoke analysis and help reflection

This can work on a number of levels and at different stanges of the game making process. Here are a few ideas to get you started.

Game: Hot Potato

Write up of hot potato game


Play Testing of Each Others Games

Let's play each others games and make a note of what we liked about the games and the changes that had been made.

This is our first limited example of giving feedback. We can try to give a flavour of what it is like to give constructive feedback. You could do this by giving advice like the following.

Write as specific feedback as you can on 2 or more coloured Sticky Notes.

  1. What went well - A particular detail of what you liked about the design of the character or the new design of a level - starting "I particularly liked...."
  2. Even better if - An area you think they could work on more to make the character or game even better. - starting "What if ....."

Take photos of this feedback, and even better put them in the pages of a Project Scrap Book.


Arcade Game Reviewing

Asking participants to take away games to review can be a good way to build capacity around recognising and analysing game mechanics. The following games are available to play free in the browser at the Internet Archive. They are mostly taken from the Internet Arcade project which is a very interesting attempt to keep games from the arcade era in the public eye. There are many more available there and you can search them by the date they came out, so you could set homework to pick a game from 1982 and then to review it. https://archive.org/details/internetarcade

The activty Here the is an activity which starts to analyse different parts of classic computer games using the framework above. We have used a few examples from Nintendo so let's start with a couple of classic Sega arcade games here. You can play all of these online for free at Internet Archive in the sections Internet Arcade and the Sega Master System Library by following the links below.

Have a play of two or more (why not all) of these game.

Fill out the sheet or take notes which allow you to make a list of the game elements.

Try to take notes on all of the elements using the following guide to help you. Completing this kind of review of classic games that still stand up today helps us to ask ourselves how we can improve and alter these elements for our own games.

  • Space: Where can you move? Where can’t you go? Does the screen scroll? Are you limited to one screen at a time?
  • Goal: What are you trying to do? How do you win?
  • Parts: What are all the active objects and characters in the game?
  • Mechanics: What is your main character doing? What main actions? (verbs)
  • Rules: What can or can’t you do in the game? How do you progress? What sets you back? Any puzzles? Power ups?

Take particular care with the use of Space. This element is so key to the playability and challenge level of a game. How what changes to the space would make the game too easy or too hard?

More on the value of playful reflection

We can see a parallel in the work done around exploring systems of power and exploitation in forum theatre in the work of Augusto Boal. He was able to work with emotive subjects and areas that participants did not always have the language to be able to communicate their thoughts. The use of drama games and mediation through role play gave participants the tools needed to express themselves in a community of peers. This kind of exploration through drama allows complex systems to be articulated in tangible and malliable ways.

The exercises are often inspired by the activitiies and ethos of participatory design. One of the key goals is to see the products that surround us as part of a designed world. Someone has designed the things we use and that effect us. Therefore if we don't like it we can design something better. We can be an active and empowered part of the system of things and people that we are part of.

Systems thinking is a hard to teach via traditional methods of instruction. This course allows an alternative approaches by exploring systems thinking through the authentic process of analysis and balancing of digital games created by participants. As mentioned the use of non-digital, drama and craft approaches provide foundational concepts and language to support this process.


  1. https://en.scratch-wiki.info/wiki/Block_Categories ^

There has been error in communication with Booktype server. Not sure right now where is the problem.

You should refresh this page.