Migrating Game Lab Code off Code.org With p5.play


One of my students is looking to take one of his projects created in Game Lab using p5.play. He downloaded all the necessary files using the Export feature. However, he noticed that there is quite a bit of random code .js files, which he knows. He is curious what he needs to edit and what files are and are not necessary to get the code up and running on a local host. He has everything that is necessary set up and now he just needs to get the code working on a website.\

All help would be appreciated. Thanks!


He’s going to want all of the files there, but only really needs to worry about editing code.js, which is where he’ll find the code he wrote in Game Lab. Here’s a rundown of what everything is:

  • assets - this folder contains any animation or sound files that were used
  • code.js - this is the code from Game Lab, but it also includes some code that loads the necessary assets so they can be referenced easily. Look for // ----- to signify where student code starts
  • gamelab.css - this stylesheet isn’t totally necessary, but if he wants to start styling more of the page the game is embedded in, this is where to look
  • gamelab-api.js - additional Game Lab commands (outside of what’s provided by p5 and p5.play)
  • index.html - the page the loads the project and includes the onscreen controls. He may want to make changes here if he’s looking to add other content to the site.
  • p5.js - the p5 library
  • p5.play.js - the p5.play library


So in that code.js file, can he continue using Game Lab’s syntax or does he have to change it to official p5.play syntax? They are very similar, but there is a bit of variation between Game Lab and official p5.play.