1. Data Collection and Analysis
CodePlayground: A Block-Based Language Designed for the Adafruit Circuit Playground
Abstract
With the growing use of technology in our everyday lives, the need for more people who can program and understand technology is increasing. However, the engaging resources to teach computer science incorporating hardware components to children and first-learners, are limited. To combat this issue, a block-based language was developed using Google’s Blockly Developer Tools. The Blockly library injects an editor into an HTML file that represents coding concepts as interlocking blocks, and then outputs the blocks as syntactically correct code. This block-based language, appropriately, named CodePlayground, was designed to be compatible with the Adafruit Circuit Playground. The Circuit Playground was released as an all-in-one low cost device that can be used for education. CodePlayground allows teachers to utilize the Circuit Playground as an educational device that includes both hardware and software elements. The Circuit Playground uses the firmata provided by Adafruit to communicate with the Python code generated by CodePlayground. Blockly Developer Tools was used to create the frame for the language and Atom was used to insert the specialized JavaScript for code generation. After the language was complete, 90 sample programs were created then given a score on a scale of 0 to 2 based on difficulty and their ability to generate and run code, with 2 being the most difficult and most successful, respectively. All of the programs successfully generated code and ran 94% of the time, demonstrating that CodePlayground could be used in an educational setting.
Engineering Goal
Goal is to develop a drag-and-drop language that utilizes the hardware appeal of the Adafruit Circuit Playground to teach computer science concepts to younger children in a way that keeps them actively engaged.
Code Generation
Data Collection and Analysis
Ninety sample programs were generated in CodePlayground and tested based on their ability to generate code and run. A score of 0, 1, or 2 was given based off of a predefined criteria where 0 is when CodePlayground does not generate the code, 1 is CodePlayground generates codes but the Python code has a runtime error, and 2 is CodePlayground successfully generates code and the Python code successfully runs. Each program was also assigned a level of 0, 1, or 2 based on their difficulty level. A zero is the easiest program and involves simple tasks such as printing a string or value when a button is pressed. A one is a medium difficulty program which involves use of sensor values to perform certain tasks. A level of two is the highest difficulty and involves variable manipulation and use of variables in event triggered functions such as a switch being changed (see Figures 2-5 for example). Of the ninety programs, all generated code, and 94.4% ran successfully. The errors were all due to variable type mismatch or index out of bound errors on Circuit Playground specific functions such as board.set_pixel().
Figure 1
Materials
Computer with Windows 7 operating system or later, a modern browser and Python 2.7+
Atom
Circuit Playground with Micro USB Cable
Blockly
Procedure
Write sample programs to become familiar with Circuit Playground
Download Blockly and run sample programs
Download and install dependencies to program Circuit Playground
Learn JavaScript and HTML to create sample programs with Blockly
Compile list of needed blocks
Use Blockly Developer Tools to make the frame for each block
Difficulty
Did Not Generate Code (0)
Runtime Error (1)
Ran and Generated Code (2)
Average Rating
Easy (0) 30 2
Medium (1) 28
1.96
Hard (2) 3 27
1.9
Figure 1: JavaScript used in code generation that auto-indents the Python code that is executed when the right-hand button is pressed and released.
Add code generation specific JavaScript using Atom
Create sample programs using CodePlayground to test the language
Example CodePlayground Program
Table 1
Figure 2
Figure 3
Figure 4
Conclusion / Future Work
Overall, CodePlayground was successful in being able to program the Circuit Playground from a block-based environment. While it does have a few minor bugs that can cause runtime errors in Python, these can be fixed with further testing. The type of programs where CodePlayground had run-time errors were extremely difficult and would most likely not be used in education, which is out of the intended scope of the language. CodePlayground can be effectively used as an educational tool that integrates hardware to teach software. To further improve the language, the ability to download code directly from the browser to the device could be added and for CodePlayground to catch variable type mismatch errors. To allow code to be downloaded from the browser, the language would have to generate C code which would allow a simpler initial setup of the programming environment, creating a near plug-and-play system.
Figure 5
References
Ada, L. (2016, April 26). Introducing Circuit Playground. Retrieved August 22, 2016, from
DiCola, T. (2016, April 27). Circuit Playground Firmata. Retrieved September 06, 2016, from playground-firmata
Hoffer, B. M. (2012). Satisfying STEM Education Using the Arduino Microprocessor in C Programming (Report No. 1472). Electronic Theses and Dissertations. Retrieved from
Introduction to Blockly. (2016, June 23). Retrieved August 22, 2016, from
Rubio M. A., Mañoso C., Hierro, Pérez A. (2013, July). Using Arduino to Enhance Computer Programming Courses In Science And Engineering. (ISBN: ).
Figure 2 shows a program made in CodePlayground that increases the number of NeoPixels illuminated based on the noise level detected by the sound sensor. Figure 3 shows the Python code generated by the specific blocks (code generated that is not block specific not shown). Figure 4 shows the program running at a normal sound level (approximate value of 300 returned from sound sensor) and Figure 5 shows the device after receiving a loud noise (approximate value of 900 returned from sound sensor).