Introduction: Remote Sensor With Smartphone Readout #phablabs

About: PHABLABS 4.0 is based on combining the World of Photonics (Science of light and light technologies) with the growing creative ecosystem of existing Fab Labs. The “Photonics Workshops” introduce a variety of fu…

In this project, you will build a photometer which optical and acoustical indicator. This photometer is based on the Arduino-related platform WeMos, but any other similar system can be used as well (ESP8266, …). A photodiode transforms the local light intensity into a current, which is measured and displayed in 3 different ways:

(1) RGB-LED ring (or OLED display)

(2) Acoustical signal with intensity-depending frequency and

(3) On a smartphone using a WiFi-connection.

Properties of this workshop:

Target audience: 15-18+ years old

DISCLAIMER: By using this information you agree to be legally bound by these terms, which shall take effect immediately on your first use of the information. PHABLABS 4.0 consortium and its member organizations give no warranty that the provided information is accurate, up-to-date or complete. You are responsible for independently verifying the information. VUB cannot be held liable for any loss or damage that may arise directly or indirectly from the use of or reliance on the information and/or products provided. PHABLABS 4.0 consortium and its member organizations disclaim all responsibility to the maximum extent possible under applicable laws: All express or implied warranties in relation to the information and your use of it are excluded. All liability, including for negligence, to you arising directly or indirectly in connection with the information or from your use of it is excluded. This instruction is published under the Creative Commons licence CC-BY-NC.

Step 1: Electronics Basics

It is useful to compare an electrical circuit to something we have a better understanding of, like a water pipe system (Photo 1). A battery or solar cell is like a water pump; they generate a pressure, which corresponds to the voltage. When you connect a pipe with one end to a water reservoir and with the other to a water pump, the pump generates pressure (voltage) and water (electrical) current. The higher the pump pressure (voltage), the larger the resulting water flow (current). You can limit the water flow (current) by putting something in its way (a ball of hair in a clogged up shower drain) or make the tube thinner. Such a restriction corresponds to an electrical resistor. Resistances are measured in ohms (Ω) and are often coded by colored rings, see photo 2.

Step 2: Part List

Photonics parts:

*NeoPixel ring, with 12 or 16 LED. An array of RGB-LEDs, with individual drivers and memory included.
*Photodiode BPW34 or similar

Other parts:

*1 Wemos (A microcontroller, which can be pro- grammed as easily as an Arduino, will control the LEDs according to the uploaded ‘sketch’. This microcontroller also can be replaced by an ESP8266).
*1 Breadboard 170 pins
*Set of breadboard jumpers (double male, a total of 1 jumpers). ‘Double male’ means they can be plugged into the board which each side.
*Some insulated wire for connecting the LEDs (red and black, 50cm each, no braided wire!)
*Resistors 0,25W: 2×220ohms (to protect the NeoPixel ring input and for the loudspeaker low pass)
*Electrolytic capacitor, 4,7µF
*Loudspeaker, 45 ohms. If not available, you can also take 8 ohms or whatever is available.
*A switch to switch the loudspeaker on and – more importantly – off.
*Some insulated wire (red, black, and green) for connecting NeoPixel ring, loudspeaker and switch
*An old piece of PCB or similar board that’s stable and can be drilled and sawed

Tools (for example in Fab Labs):

*Laser cutter
*3D printer for transparant material (optional)
*Soldering iron
*Computer for programming Wemos

Don't find the material you are looking for? Via this link you could buy all the photonics material needed for this workshop.

Step 3: The Controller (WeMos)

This project uses a WeMos to control a NeoPixel ring, but a NodeMCU, ESP8266 or similar will do as well. To keep the confusion at a reasonable level, we describe everything in terms of the WeMos. When using a different platform, the program environment needs to be adapted accordingly, which we will describe below. Also, the pinout will most likely be different.

The WeMos is powered and programmed through a USB connection to a computer. Once it is programmed, it can be powered by phone charger.

The WeMos (Photo 1) is an Arduino based platform which can be directly programmed using a desktop or laptop and which can perform a large variety of tasks. Today, there are many variations of the Arduino platform coming in all sizes and peripheries. In our project, we choose the WeMos, which is a tiny, cheap and very powerful platform. There are many free Arduino tutorials available on the internet, which are perfect for any stage of advancement. In this tutorial, we therefore limit ourselves to those things necessary for building our WeMos controlled photometer.

The metallic box is a shield for electromagnetic waves and contains the microcontroller and the WLAN transceiver, which allows the WeMos to wirelessly communicate. In the WeMos Lite, this shield is missing, which does not seem to pose a problem though. The curly printed wire outside this box on the left is its antenna. The WeMos is powered through the USB-connector on the bottom, which runs on 5 volts. Since the WeMos can only take only 3.3 volts, there are additional components on the bottom of the board which provide this voltage.

Step 4: Periphery

The NeoPixel ring
…is one of many funny devices offered by Adafruit. Once your project today is up and running, you can extend if with other RGB devices you like. Photo 1

We will build the circuit on a breadboard (Photo 2) according to the wiring scheme in Photo 3.

Breadboards come in different sizes and have one more common rail. The large breadboard we use has a total of 17×10=170 points. Each 10-point-column consists of 2 segments with 5 mutually connected points each, as indicated by the cyan dashed line.

The NeoPixel ring has 3 terminals: plus(+) and ground (GND) for its supply voltage and Data Input (DI). It needs 5V, but also works with 3.3V. We connect its Plus-Terminal to the “5V” pin and its ground terminal next to the WeMos into a 5pin-column we call “ground column” of the WeMos. Connect this ground column to the “G” pin of the WeMos. “Data Input” of the ring will be connected to pin 7 of the WeMos.

The WeMos reads the photo-voltage provided by the photodiode on its analog-digital-converting input A0. It feeds these data to the NeoPixel Ring via pin D7 and generates a sound signal at pin D6. The loudspeaker is connected to D6 through a resistor and with a capacitor in parallel, which keep the higher harmonics of the square wave at bay so the tone sounds more sinus-like.

Now take a 1×4cm² piece of printed circuit board and drill 2 4mm-holes into it, spaced at 30mm. Insert and solder the photodiode in the center. Solder 2×10cm long wires to it; a green wire to the anode (which is the side with the transverse metallic bar, see green arrow in photo 4, and a black wire to the cathode.

Plug the green wire next to the A0-pin of the WeMos, and the black wire to ground column.

Look at the terminals of the loudspeaker; one of them is marked with a minus sign “-“. One of the terminals of the electrolytic capacitor is also marked by a minus sign. Solder the 4.7µF electrolytic capacitor to the loudspeaker terminals, so that alike terminals connect. Then, cut the wires of a 270 ohms resistor down to 1cm, and solder one end to the positive capacitor terminal. Also add the switch to the other end of the resistor using 2×10cm long wires. Connect everything according to the fritzing scheme.

Step 5: Quick Start Guide for the WeMos

For programming and controlling the WeMos, we use the Arduino IDE (Integrated development environment), which can be downloaded from

The Arduino IDE does not contain the libraries to communicate with the WeMos we use, so we need to include those:

1. Open the Arduino IDE, go to “Files” and click on “Preferences”. Photo 1
Copy the following line into the “Additional Boards Manager URLs” text box:

and press OK to close the Preferences tab.

2. Select “Tools” and “Board”, and click on “Boards Manager…” in the pop-up menu. Navigate to “esp8266 by ESP8266 Community” and click into the field. This will install the programming environment we need, for the WeMos we use, or other boards included in this package as shown. Photo 2

Additional libraries we need

For our programs, we need additional libraries. The library “WebSockets” by Markus Sattler provides easy WLAN communication and can be downloaded from the library manager. Photo 3

We need another library that is not included in the Arduino IDE, so we get it from the internet. It is Timelib.h, which provides the time in hours, minutes and seconds relative to a predetermined starting point. This library is available at

On this site, press on the green “Clone or download” button and select “Download ZIP”. Do NOT unzip the zip-file; it can be directly included in the Arduino IDE:

Sketch>Include Library>Add .ZIP library

In this workshop, you can either use a NeoPixel ring or an OLED display to display the measured sensor values. The NeoPixel ring uses artful colored LEDs and is easy to read out from the distance. The small OLED-Display displays the actual measured number. In each case we need one additional library to control those output devices.

For the NeoPixel ring, we need library Adafruit_NeoPixel.h.

Go to

Proceed as for the Timelib.h library.

For the OLED display we need the SSD1306Ascii.h library.

Go to

Proceed as for the Timelib.h library.

Finally, we need to tell the Arduino IDE who it should communicate with. Go to Tools>Board and select the appropriate WeMos (D1 R2 & mini, Lite, or whatever you use) from the list. Photo 4

Now our WeMos is ready to be programmed. Don’t connect it just yet.

Step 6: The Sketch (program Code)

We use the sketch with the code below, which enables the WeMos to be controlled by your smartphone. Here, the WeMos acts as an Access Point. The program code is attached. Photo 1, 2

Brief explanation of the program

The program starts by including all libraries needed and by defining all variables. In the function setup() our WiFi access point “Wurstserver” (choose an individual name if more than one WeMos are present in the room so you know which one you’re connecting to), the Serial Monitor (which is a window within our program environment which can be used to control variables) and the NeoPixel ring are started. All LEDs in the ring are switched off.

The function loop() runs endlessly. It reads the voltage provided by the photodiode at pin A0, which is the analog-digital-converting input of the WeMos. The obtained value sensorValue is passed on as input to the NeoPixel ring, the tone generator and the WiFi access point.

All other functions are defined after loop().

RingEinschalten() transforms the sensorValue to number and color of the LEDs switched on in the NeoPixel ring. For 1…16, the ring shines blue, for 17…32 green and above 32 red. The function colorSet is called in this function, with color and number of pixel as parameters. It is pretty much self-explanatory. There is a large variety of tutorials on NeoPixel devices in all languages and degrees of advancement on the internet.

Uploading the program

Now check your setup one last time by comparing it to the fritzing scheme in Fig. 6. Has everything been connected correctly? Are the solder points ok? Any short circuit or open circuit? Is the WeMos the right way around? Is the polarity of the electrolytic capacitor correct? Only if everything looks fine, go ahead. Photo 3

Connect the WeMos to a free USB-port of your computer (Figure 8) and find out the name of this port, using the Device Manager (Geräte-ManageràAnschlüsse (COM/LPT)). In the IDE, select the port with ToolsàPort. Make sure the right type of WeMos is selected (ToolsàBoard …). Compile and upload the file using the button displaying an arrow pointing right. If everything goes well, the IDE should look like photo 4 after the upload.

Step 7: Building the Box

Disconnect the device from the USB plug.

Lasercut the box. (file attached)

Photo 1: shows the mounting of the NeoPixel Ring and our (optional) 3D-printed scattering cap.

(a): Front cover for the neopixel ring, this is 3D printed. (See file: cap for pixelring) If you don't have a 3D printer, you can also lasercut the cap out of plexi, then use the file remote_lens.
(b): Box components with plugged in photodiode and Neopixel ring
(c): Front panel of photometer with photodiode (left) and Neopixel ring

Screw the small board with the photo diode to the front panel. You can also glue it (after soldering the cables to it!). The ring which holds the loudspeaker is glued to the bottom of the box. The breadboard with the WeMos has a sticky surface on its flip side, just peel of the protective layer. To keep the loudspeaker firmly in place you can either glue it into the ring or use a double-sided sticky tape. Photo 2

(a): Breadboard with wemos
(b): interior of box with neopixel ring, photodiode and loudspeaker holder (ring glued to the bottom)
(c): the breadboard has a sticky flipside (remove protective foil) and should be glued to the bottom of the box
(d): Loudspeaker with a resistor in series and a capacitor in parallel, to suppress the higher harmonics of the tone square wave

Photo 3 shows the completed electronics inside its box, consisting of the WeMos on a breadboard, the photodiode (green-blue wires), NeoPixel ring (green-yellow-red braided wires) and loudspeaker with its low-pass filter.

We finish with the top of the box. Disconnect your photometer again. Glue the corner parts onto the lid as indicated by the gravure as shown in photo 4. Carefully close the lid.

Step 8: Operation of the Photometer

If all is fine, plug the 5V-USB connector into the socket on the WeMos board. Now the NeoPixel Ring should again light up and you should hear a tone from the loudspeaker.

When you change the illumination around the photodiode, the tone frequency should vary and the number and color of the Ring LEDs should change.

Now take a smartphone and look for the access point of your Wurstserver. You can connect to it without a password. Start your browser and go to URL Wurstserver will provide you with the current light intensity in terms of a natural number. Every time you refresh the website, a request is sent and you will get an updated value.

You can replace the photodiode by other sensors, too. There is a large range of sensors available for Arduino-like systems.

Step 9: Using an OLED-display Instead of Neopixel Ring

If you prefer numerical values over fancy colors, you can also use an (OLED) display instead of a NeoPixel ring. Here we use OLED display RIT253 Photo 1

This display has 128×64 pixels, and is controlled by the popular SSD1306 driver IC. It has 4 terminals and is controlled via I2C-bus: Vcc (+3.3V), GND (ground) for the power supply, and SCL and SDA for the data connection (CLock and DAta). Connect Vcc and GND to the respective terminals of the WeMos, SCL to D1 and SDA to D2.

Step 10: Conclusions

What have we learned?

We have learned in this workshop how to

· Program a WeMos microcontroller, writing some simple sketches (programs)
· Measure an analog entity (here the local light intensity), display it on an LED ring array, convert it to sound and send it to a smartphone
· build some basic electronics, and connect some components by soldering
· construct a casing for the device using a laser cutter and wood

Concluding thoughts

Arduino-based systems are an inexpensive and easy way to solve all kinds of problems, that only a couple of years ago required extensive expert knowledge. Today, there is a huge Arduino community around the world who works on all kinds of open-source-projects and who are more than happy to share their knowledge and experience. You can use the introduction from this workshop to come up with and solve your own tasks.

PHABLABS 4.0 is a European project where two major trends are combined into one powerful and ambitious innovation pathway for digitization of European industry: On the one hand the growing awareness of photonics as an important innovation driver and a key enabling technology towards a better society, and on the other hand the exploding network of vibrant Fab Labs where next-generation practical skills-based learning using KETs is core but where photonics is currently lacking.

This workshop was set up by the Joanneum Research in close collaboration with Fab Lab Graz.