Rapid Electronic Prototyping (TfCD, TU Delft 2016)

During recent years, the electronics in products have incrementally become more and more complex. As a result of which, the creation of (rapid) prototypes for testing interaction with complex products has become less realistic for designers.

The use of electronic prototyping platforms, such as Arduino, allows designers to test the physical interaction with complex products. Also, the use of mock-up interactive digital interfaces allows designers to test digital interaction, however the link between the two is lacking.

This example will show how a regular mobile device, running a website, will send commands to an Arduino using a regular AUX cable. Thus, allowing digital and physical interaction to be tested simultaneously.

Step 1: The Components

In order to create the connection between interface and Arduino, the following components will be used.

Breadboard
Arduino (in this example Arduino Uno)
USB 2.0 type A/B (for connecting Arduino to computer/power source)
Mobile device (preferably running on Android)
Old stereo AUX cable (compatible with mobile device)
Resistors (in this example 220Ω and 1000Ω)
LED's
Jumper wires
Regular wires
Heat-shrinking tube
Soldering tools
Computer (for programming)

Optionally, a power bank can be used to power the Arduino after programming. Also, the created website needs to be displayed on the mobile device. The easiest way to do this is by placing the website online, but on Android devices the website can also be stored and opened locally. This is less convenient, but does mean that the mobile device no longer requires an internet connection.

Step 2: Setting Up the Circuit

The circuit that is to be created can be seen above. The cable is connecting the AUX output of the device to the breadboard. On the breadboard are jumper wires connecting the AUX wires to the analog-in pins of the Arduino, allowing the voltages to be read. Also, pull-down resistors are connecting the AUX wires to the ground of the Arduino.

The desired resistances of these resistors is not completely clear, since they also rely on the output of the mobile device and resistance of the AUX cable. In our case we started by using three 220Ω pull-down resistors, but later found that 1000Ω resistors gave better analog readings. We recommend just trying some different resistors to see which gives the best readings, using the serial print functions of the Arduino.

Last but not least, a red LED was used in combination with a 220Ω resistor to act out on the commands. Please note to place the LED in accordance with its polarity.

Preparation of the AUX cable

The only big step of setting up the circuit is the preparation of the AUX cable. As shown before, the AUX cable is connected to the mobile device on one side, and connected to the breadboard on the other. In order to ensure a good connection to the breadboard, the jack is first removed on one side of the cable. After that, this side is stripped using a regular wire stripper. Inside, there are three inner wires; two insulated and one non-insulated.

This is standard for stereo AUX cables. The insulated wires carry the signals for left and right, whilst the non-insulated wire is the ground. Next, the insulated wires are partially stripped and three regular wires with different colors are stripped on both ends. Each of the three inner wires are individually connected to a regular wire by soldering them and then insulating them again using heat shrinking tube. The remaining ends of the regular wires are twisted and covered with some soldering to ensure simple placement in the breadboard.

Step 3: Creating the Website

For the website, a very rudimentary code was written in JavaScript (JS) and some basic HTML. The result of which can be seen in the figure above. It uses the riffwave plugin by Darrel Banks, a simple plugin that allows you to code a sound file using JS.

A function, called "send_interval", creates and plays a sound and can be triggered by any JS event. In this example, two buttons were placed in HTML, each with the onclick event linked to the "send_interval" function with the interval given in the function (last two rows of code).

The function creates a sound file that doesn't contain a sound, but one block of a high (voltage) value for the indicated interval time. The duration of the resulting high voltage can then be measured and interpreted by the Arduino. It is better to use duration rather than voltage levels, since the voltage levels can vary depending on the resistances involved, whilst the duration always remains accurate.

The Browser to use: Firefox for Android

The sound file can then be played using the HTML5 audio feature. The only drawback to this is that is needs to be possible to automatically play sounds, which is not allowed by most mobile browsers.

In fact, the only well known mobile browser that completely allows the audio/video autoplay feature, is Firefox for Android. This browser also allows the website to make vibrations, use the gyroscope and accelerometer, and the website can be made completely full screen using a plugin, making this the ideal browser for interface testing.

Step 4: Programming Arduino

The Arduino code, as is it in accordance with the website code discussed before, can be seen in the figure above.

Each of the three AUX wires are connected to the Arduino in a pull-down resistor setting, so that each of the individual voltages on the wires could be measured and visualized (Serial plotter). In this example, only the signal of the left wire was eventually measured and analysed, although it could be elaborated into measuring both left and right. The void loop was repeated continuously, with the value of i ranging from -2 to 0 when there is no activity, and ranging from 0 to 10 for up to 30 milliseconds at the beginning and end of a signal, which may vary depending on the pull-down resistors that have been used.

After the first part of a signal is being detected, signals will be ignored for the next 50 milliseconds, since the same signal seems to show inconsistencies here.

The signals come in pairs of two. When a first signal is detected, a timer starts. The Arduino then waits for the next signal to be measured, indicating the end of the interval. At this moment the timer is stopped and the elapsed time is used to determine the intended commando in the void execute. Interval are rounded on 50ms, since measured intervals deviated up to 20 milliseconds from the intended. This may be as a result of the 50ms that are ignored.

Step 5: Testing & Validating

When testing the setup, some problems were found in the consistency of the measured signal. This caused the program to detect multiple, very short intervals instead of detecting a single longer one. This was eventually solved by implementing the 50ms of ignoring the signal.

Other than that the system seems to work just fine. We are happy with the results and will possibly use this for prototyping purposes in a later stage of our current project.

Points of improvement

Through trial and error the resistors were adapted, which resulted in better readings, but this may be further optimized to possibly remove the now required 50ms of ignoring the signal.

As said before, only the signal of the left wire was being measured and analysed. This means that, with the minimum interval between commando's at 50ms, 5 different kind of commando's can be send within 300ms. However when the right wire is also being analysed, it allows combinations between left and right to be made. This means that there will be 5 x 5 = 25 different kind of commando's that can be send within 300ms.

It might also be interesting to not use intervals, but frequencies in sound waves. This allows the mobile device to send multiple signals simultaneously by taking the sum of different sound waves, which can then be analysed using Fast Fourier Transform (FFT). Although this is more complex, it has significantly more potential.

Right now, the communication is only from mobile device to Arduino, missing possibly vital feedback to the mobile device. By using the microphone, reversed communication can be enabled. However, the microphone is not (yet) accessible in mobile browsers and a switch to harder to prototype applications would be required.