Website to Practice Drawing - Bigger than Game Lab

csdunit3

#1

I am extending the drawing activities in Unit 3 to a team building assignment integrating Google Docs and Sheets. The teams are picking out a piece of Pixel Art from a Google search, putting it into Google Sheets to analyze and then coding it in Google Docs.

Some groups need larger than the 400x400 working space that the Game Lab allows.

Does anyone know of a site that would be a bigger drawing space for them to copy/paste their code into to check it?

Thanks!


#2

Hi John,
You could try this p5.js editor here: https://alpha.editor.p5js.org/
This tool uses the same draw loop and lets you customize the canvas size. As a word of caution, you’ll find that many of Game Lab’s feature are unique to that tool and will only work on Code.org.

  • Spirtes do not work.
  • Some functions like randomNumber() do not work.
  • Rectangles and ellipses must use all 4 parameters, e.g. rect(0,0,50,50; not rect(0,0);

There are definitely other things that wouldn’t translate either. Hope that helps!


#3

Thanks! I’m just looking for a larger canvas to do what the students were doing in CS Discoveries Unit 3, Lessons 3, 4, 5


#4

Then I think that link will work perfectly! The only changes you’d need to make are using random() in place of randomNumber() and make sure to use all 4 parameters (x,y,w,h) when drawing shapes.