Scratch for Arduboy

To simplify programming the Arduboy, I am trying to design an Arduboy extension for ScratchX. I am using a modified version of the littleBits extension from Kreg Hanning as a basis.

Current features:

  • Left, right, up & down buttons
  • All other Scratch 2.0 features
  • A, B & start buttons
  • Buzzer tones
  • Drawing on the Arduboy screen

Planned features:

  • Make the “turtle” appear when drawing
  • Image sprites

As Cartesian coordinates (X, Y) are not the most natural way to represent drawings, I implemented the “turtle” metaphor of Seymour Papert as it is already present in the “Pen down” block from Scratch.

I uploaded the code to the following GitHub repository:

To test this extension, upload the arduboy_scratch_extension.ino to your Arduboy, install the Scratch Browser Plugin (see notes for Firefox and for Chrome), and then open the Arduboy extension on ScratchX.org.

What do you think?

7 Likes

Interesting idea.

I’m not very familiar with Scratch, so correct me if I’m wrong, but it appears that rather than simplifying programming the Arduboy, you would instead be allowing the Arduboy to be interfaced to, and controlled by, Scratch. You wouldn’t be able to create a sketch that could be uploaded and run independently, without the Arduboy being tethered via USB to a PC running Scratch.

If the above is true, and being that the Arduboy is primarily intended to be a portable, self contained device, perhaps adding Arduboy specific support to Ardublock would be more useful. Although Ardublock doesn’t appear to be quite as simple to use as Scratch, it might make it easier for some people to create standalone Arduboy sketches.

Of course, having both Scratch and Ardublock support would be nice, but I wonder which would tend to be used more?

1 Like

Yes, that’s correct.

mBlock also comes to mind as a way to upload a sketch to run independently. Unfortunately, I have been unable to upload a sketch from it on my Mac. In the future, one could imagine using the plugin from Arduino Create to upload a sketch to the Arduino directly from ScratchX.

Controlling the Arduboy from the Scratch website is of course limited, but it could well give a smoother transition in the programming difficulty, for example:

  1. Learn basic Scratch
  2. Move sprites on screen using the buttons of the Arduboy
  3. Make sounds with the buzzer of the Arduboy
  4. Draw on the screen with the “turtle” metaphor
  5. Make a pong game

In this pong game, the Scratch interface could come useful as one paddle could be controlled by the Arduboy, while the other could be controlled by the keyboard!

Unlike mBlock (and all others I have looked at) Ardublock supports Linux as well as Windows and Mac.

1 Like

I implemented new features: A/B buttons, buzzer and drawing on the screen. I completely rewrote the extension using the littleBits Scratch extension as a basis instead of the Arduino Scratch extension as it is much easier to extend.

I still have to make the “turtle” appear on the screen when drawing and maybe add some pre-drawn sprites to the Arduino sketch in order to make it easier to make games on the Arduboy screen.

I have updated the first post to reflect these changes.

If you try this extension, don’t forget to tell me what you think!

This, is, incredible.

@davidperrenoud we should be friends :smiley:

1 Like

I think a good way to manage sprites would be to use the drawing system that is already implemented in Scratch. You can then add a piece of script to each of the sprites. With some modifications, it could look like this:

Here would be the plan:

  1. Modify Scratch Flash 2.0:
  2. Change the resolution of the screen to 128x64 with 3x or 4x zoom
  3. Force all sprites to be black & white
  4. Delete all script blocks that couldn’t be implemented on the Arduboy (example: mouse)
  5. Upload the sprites through Serial and synchronize their position on the Arduboy with the one from Scratch
  6. Optional: find a way to compile Scratch’s code and upload it to CodeBender to play autonomously

Is there anyone interested on helping me on this? I already began compiling Scratch Flash but I don’t think I will be able to do all of this on my own.

2 Likes

This is great! Teaching K12 students with little or no programming experience would be so much easier with visual and block-based programming tools such as Scratch compared with the text-based C code in Arduino IDE.

Plus you get to feel and share your work in a physical device! I think this could be a potential area to use Aruduboy for kids’ education.

2 Likes

I just got a much better idea! Using Flash 2.0 in a browser, you can actually save your project as a SB2 file. SB2 is just a ZIP file with some JSON, WAVs and PNGs.

The JSON file looks like this:

{
  "objName": "Stage",
  "sounds": [{
      "soundName": "pop",
      "soundID": 0,
      "md5": "83a9787d4cb6f3b7632b4ddfebf74367.wav",
      "sampleCount": 258,
      "rate": 11025,
      "format": ""
    }],
  "costumes": [{
      "costumeName": "backdrop1",
      "baseLayerID": 2,
      "baseLayerMD5": "739b5e2a2435f6e1ec2993791b423146.png",
      "bitmapResolution": 1,
      "rotationCenterX": 240,
      "rotationCenterY": 180
    }],
  "currentCostumeIndex": 0,
  "penLayerMD5": "5c81a336fab8be57adc039a8a2b33ca9.png",
  "penLayerID": 0,
  "tempoBPM": 60,
  "videoAlpha": 0.5,
  "children": [{
      "objName": "Sprite2",
      "scripts": [[55,
          24,
          [["whenGreenFlag"], ["doRepeat", 10, [["forward:", 10], ["wait:elapsed:from:", 1]]]]]],
      "sounds": [{
          "soundName": "pop",
          "soundID": 0,
          "md5": "83a9787d4cb6f3b7632b4ddfebf74367.wav",
          "sampleCount": 258,
          "rate": 11025,
          "format": ""
        }],
      "costumes": [{
          "costumeName": "costume1",
          "baseLayerID": 1,
          "baseLayerMD5": "e5c228e0b529cfcae5d5f34b7f69e1a5.png",
          "bitmapResolution": 2,
          "rotationCenterX": 8,
          "rotationCenterY": 8
        }],
      "currentCostumeIndex": 0,
      "scratchX": 26,
      "scratchY": -7,
      "scale": 1,
      "direction": 90,
      "rotationStyle": "normal",
      "isDraggable": false,
      "indexInLibrary": 1,
      "visible": true,
      "spriteInfo": {
      }
    }],
  "info": {
    "spriteCount": 1,
    "scriptCount": 1,
    "swfVersion": "",
    "flashVersion": "",
    "userAgent": "",
    "videoOn": false,
    "hasCloudData": false
  }
}

You can see the code from Scratch in children -> * -> scripts:

[["whenGreenFlag"], ["doRepeat", 10, [["forward:", 10], ["wait:elapsed:from:", 1]]]]]]

which you could convert to Arduino:

for (int i = 0; i < 10; ++i) {
  forward(10);
  delay(1000); // TODO: replace with non-blocking multi-threading
}

So, what do you think?

Does anyone want to work with me on this?

1 Like

I found a really good Scratch to Javascript compiler created by Nathan Dinsmore:
http://phosphorus.github.io/#90000440 (you can use left/right arrow keys)

It may be possible to modify this compiler to output C++ and therefore export a Scratch project to Arduino.

If someone wants to help me, I used phosphorous.js’s compile() function to convert these two parallel for-loops:

[["whenGreenFlag"], ["doRepeat", 10, [["forward:", 10], ["wait:elapsed:from:", 1]]]]]]
[["whenGreenFlag"], ["doRepeat", 10, [["forward:", 10], ["wait:elapsed:from:", 1]]]]]]

Into the following sequential code (continuation-passing style):

save();
R.count = 10;
if (R.count >= 0.5) {
  R.count -= 1;
  if (S.visible) VISUAL = true;
  S.forward(10);
  save();
  R.start = self.now();
  R.duration = 1;
  R.first = true;
  if (self.now() - R.start < R.duration * 1000 || R.first) {
    R.first = false;
    forceQueue(2);
    return;
  }
  restore();
  queue(1);
  return;
} else {
  restore();
}
save();
R.count = 10;
if (R.count >= 0.5) {
  R.count -= 1;
  if (S.visible) VISUAL = true;
  S.forward(10);
  save();
  R.start = self.now();
  R.duration = 1;
  R.first = true;
  if (self.now() - R.start < R.duration * 1000 || R.first) {
    R.first = false;
    forceQueue(2);
    return;
  }
  restore();
  queue(1);
  return;
} else {
  restore();
}

Could we write something equivalent for Arduboy?

Yea totally, you could do the parsing in Javascript if you wanted.

Here’s the C json lib from http://www.json.org/ at the bottom, if you want to parse in C. It looks like it bakes out pretty simple loops, if there is source for scratch, see how they turn it into source code and use that process?

You might also be interested in some other tools that have done similar things, e.g. miniBloq, which is a block-based graphical programming environment for Arduino generally. Might be easier to adapt. There are others, too.

2 Likes

Yes, the language of the Scratch-to-C++ interpreter is not important as it could be run on the server. The difficulty is that Scratch is inherently parallel, as you can assign code and delays to any sprite and broadcast messages between the sprites.

If you look at the Java interpreter from Scratch, they start a timer for each wait:elapsed:from: and then switch between threads.

This or mBlock may be indeed be easier to adapt because they force the code to be sequential. To the same effect, Scratch could be artificially limited to have code only on one sprite.

But wouldn’t it be more difficult to program a game without parallelism?

This sounds awesome. I’m looking into buying my nephew a Kano computer (Raspberry Pi kit computer that teaches kids programming and game development), which is a great way to get him started with Scratch.

If he could use something similar to start making games for a handheld, I think that’d be an amazing way to get him into it even more.

1 Like

I’m a high school math and physics teacher who has never coded before and want to get my kids involved in coding so figured I’d have my arduboy around to let them play with. I have heard of scratch for arduino. Will this work to convert the scratch code to arduino code and then be able to play untethered?

I missed the kickstarter and really hope my pre-order comes early enough that I can get it figured out over the summer so I can let kids play during the year. If this is as accessible as I hope then I will be pestering the science department to buy me a bunch!

1 Like

I just picked up an Arduboy at the Bay Area Maker Faire and I’m loving it so far. I teach game design, programming, and robotics to youth (K-12) and I’m also very interested in block-based coding.

After some digging, I found these block-based programming tools for Arduino: mBlock (based on Scratch 2.0), BlocklyDuino (based on Google Blockly), ArduBlockly (inspired by BlocklyDuino, and not the same as ArduBlock).

So far, I’m very impressed with ArduBlockly:

  • It runs on Mac, Windows, and Linux
  • The UI is very polished (Responsive Design)
  • Development is still active
  • You can upload straight to Arduino from the browser

I’ve been experimenting with the source code and created a couple of Arduboy blocks. It isn’t much yet, but I was able to use it to display some text on the screen and animate a rectangle:

7 Likes

For block-based Arduino programming, there’s also miniBloq, which I think was one of the first. I backed their kickstarter 4 years ago, but haven’t really kept up with the project. Still around, though!

1 Like

ArduBlockly looks nice! I had never heard of it even though it exists since more than a year.

Instead of using the default Arduboy functions, I think it would be nice if you can introduce some abstractions for the shapes and bitmaps like:

  • initialise [bitmap1] with the image [star.png]
  • move [bitmap1] of [10] steps
  • change direction of [bitmap1] of **[90]**°
  • bounce on edge

That makes the programming much easier for the users.

By the way, is there any way to test your blocks @aBlender?

@Jared_Washburn Unfortunately, my Scratch extension only works tethered to a computer. One advantage is that you can make games that use both the keyboard and screen of the computer and the buttons and screen of the Arduboy.

To be fair, there wasn’t enough interest to make a Scratch to Arduino (C++) compiler and it’s not an easy task due to the parallel nature of Scratch. Hopefully we can all collaborate on something like ArduBlocky. Don’t hesitate to write some documentation of your activities or draw a picture of the tool you’d like and with luck someone will build it!

2 Likes