A CodeBug Interactive Things project



The first thoughts when the CodeBugCodeBug board arrived on the market - and few time before reading the first reviews and technical tweets - was about how to create educational things (or, better, IoT) primarily targeted to newbies, joung enthusiasts, childs and students. The surrounding idea was to develop things moved by the CodeBugCodeBug board. I mean objects for interaction, empowered by electronics involving making, programming, learning, hacking and customisation. This is how the idea of the CodeBug interactive things project was born.


The making-of shown below, the creation project to be clear, is the first one following in my opinion most of these line guides. I am almost against closed projects, especially if remaining open these can be source of inspiration to others.

So there is the product (and the assembly hacking kit) on the Drobott shop, and the self-hacking explanation in this article, with many thanks to the CodeBugCodeBug provided by Element14 (if someone of you decides to buy one of them, don't forget to apply the Element14 discount code W0E49MYQ for a 10% off).


How it works

The proof of concept is almost simple: the CodeBug board controls a questions support board inclduing a 7x14 cm paper sheet. The sheet is expected showing a question with 5 possible options; one (or more) correct answers and the other wrong.


Thanks to the sensitive features of the CodeBug legs, no further accessory should be used: the user should touch with a finger the top-right conductive corner and one of the five possible answers with another. The answer response is shown on the CodeBug 5x5 LED display (a scrolling text) and the attached buzzer plays a wrong or correct sound effect.


Depending on how the back of the questions support board connectors are wired, it is possible configure one or more answers as correct and one or more answers as wrong, accordingly to the question image. The following image shows an example of single correct answer with three different types of questions.


Creating the Questions Support Board

IMG_20151002_161405.jpgThe Questions Support Board Is machined with a 5 mm super-compact plastic foam creating the spaces for the question paper sheet and the conductive areas. The conductive areas are obtained by adhesive soldering copper belts 2 cm wide; the front area (visible) of the copper is used to "touch" the answers while the back side of the belt (hidden to the user) are wired together depending on the kind of options that should be correct and wrong.


The images below shows the assembly phase of a question support board with contacts and back soldered wires.

IMG_20151002_170058.jpg IMG_20151002_171846.jpg

IMG_20151002_171856.jpg IMG_20151002_234158.jpg

The resulting board has a size of 10x15 cm with a question image area of 7x14 cm.


Connecting to the CodeBug

When the boards are created the first three top-left contacts should be legged to the CodeBug respectively from left to the right with Leg 1, GND and Leg 3, accordingly with the program that responds with a correct answer on Leg 1 and wrong answer on Leg 3.


For a more impacting effect when the user touch on of the answers some sound effects has been generated bit-banging a buzzer (or a very small speaker). In this case the 5V leg of the CodeBug should be connected to the positive wire of the buzzer while the negative is connected to the Leg 0.


The following video shows the QuizBug at work.


The software

The QuizBug software can be remixed on the CodeBug site and modified as well or used as-is. The commented images below analyses in detail the different blocks of code.

Screen Shot 2015-10-04 at 14.06.49.png

Most of the variable used in the program are declared on top. This makes a simple job any further change for a different reactivity or behavior of the program without the need to change the instructions. The variable ResponseString is defined initially with a dummy content (it is never used) to optimize the response speed; only the variable content is changed instead of using two different sprites.

Changing the values of low and speed different sound effects can be generated by the buzzer.


The program wait until a button (A or B) is pressed then after the variables definition starts an infinite loop. The different activities are controlled by flags that decides what conditions are verified according with the user interaction.

Screen Shot 2015-10-04 at 14.15.37.png

Every time the user press the button A the OnOffStatus changes. When it is true, a new answer can be tried else the program waits until the user does not start it.

Screen Shot 2015-10-04 at 14.18.16.png

Thanks to set the variables of the program on top, when the leg status (corresponding to the answer) is checked, only some flags and variables should be changed; Accordingly with the leg the ResponseString content is set to correct or wrong (instead of designing two different sprites). The value of Raise (+1 or -1) is set to change the direction of the sound effect, growing for the correct answer and falling for the wrong answer. The flag AnswerStatus is normally set to false when the program is waiting for the user interactions. When a choice is detected, it is set to true for the answer response animation.

Screen Shot 2015-10-04 at 14.31.16.png

If AnswerStatus is true, the user has pressed one of the possible answers and two separate events are executed in sequence: the sound effect generation and the scrolling text with the answer response. As the variables has already been set before, only one action should be executed valid for both the conditions of the program.