Acrylic Sheet RGB Glowing Weather Station With Indoor/outdoor/forecast Using ESP8266

The Weather station I made is based on the software of Daniel Eichhorn from Switserland . This firmware includes measurement of the inside temperature + humidity, outside temperature + air pressure (fetching data from a 2nd weatherstation connected to thingspeak) and local forecast data from Wunderground (Weather underground) See his blog at http://blog.squix.ch/

I want to make sure for my project that this time I added really everything required to complete my Instructable. If anything is missing let me know!

I thought it would be cool to design my own Weather Station with a larger OLED display (not the original 0.96", I found 2.4") and pay a lot of attention to the looks of the station. So as "enclosure" I used Acrylic sheet which I laser-cutted in the shape of a sun/cloud. My goal was to let the acrylic "glow" depending on the forecast or other criterium: red means its getting warmer, blue means its getting colder, white flashing: thunderstorm expected. Etc. Or perhaps just a pretty color you like?

To do this I used approx. 20cm Adafruit RGB LED Neopixel strip around the OLED display (a total of 12 Neopixels are on the strip). They are very easy to use with their 1-wire connection and built-in LED controller PER LED! Cheaper Chinese clones might work but I wanted to be sure and wanted to use the Adafruit lib.

So I expanded the firmware with Neopixel control (RGB led's on a strip, from Adafruit) and a smooth fading pattern. Depending on forecast data and current readings the Neopixels now fade in a certain color.

I used almost any technique I had at my disposal. Laser cutting, 3d printing thanks to my local FabLab, CAD schematic design + PCB, Arduino programming.

Step 1: Shopping for the Parts

Update!

This has been added AFTER I published the instructable and the text following in this step.

I noticed that the USB cable was clearly visible in the images I uploaded. I did not pay attention to it at the time of posting but now it started to annoy me. So I have a solution. Instead of using the USB connector mentioned below in my Electronics Bill Of Materials use this one. Now the USB cable will be pointed backward when plugging it in. This connector however does not fit on the PCB design that I made. To overcome this a slight mechanical finetune was needed. The 2 large metal pins that are on this connector I bent to the sides and solder them to the PCB large ground pads. The 5 USB data pins I had to slightly push towards the PCB so that they touched the PCB and could be soldered. I also added a picture showing how to do that with this Step. It's up to you which connector to use, in the BOM is the one fitting directly on the PCB but the one mentioned in this update makes the station look better!

Files to download

Download the ZIP file I attached to this project, it contains everything: the CAD files for the lasercutter (body + stand) and 3d printer (display bezel), the schematic and Gerber files for the PCB, a Bill of Materials for the electronics and the Firmware

Mechanical

For the mechanical part I used Acrylic sheet. Here in the Netherlands I found a very cheap supplier of real Plexiglas where you can order the smallest sizes you like (just the size you need) in all thicknesses. For Dutch readers click here. For the others you will have to find this locally.

You could use for the base and body any acrylic you like, I show here what I did. But for example the cloud/sun body could also be out of 1 clear sheet instead of the cloud being clear and the sun yellow-clear.

• 1 sheet of 220 x 220mm and 10mm thickness for the "cloud"
• 1 sheet of 120 x 120mm for the "sun"
• some plastics adhesive preferably Acrifix 1R0192 to glue the parts together
• 1 sheet of 50x200mm for the base/stand (I used blue)
• (optional 1 sheet of plastic in color of choice, approx. 1mm thick to make the OLED bezel/front plate, I supplied both the 3d print files for the bezel as well as the CAD file to laser-cut a bezel, the choice is up to you which one you prefer)

Electronics

Here is a complete overview of what I used for my project. In the Electronics step further on I'll explain what the parts are used for. You could decide to not use them all depending on what you want the station to show. At minimum you need an ESP8266 and the OLED display!

• Order my PCB using my Gerber files. I used this very affordable Chinese service and the 5cm x 10cm option over there will fit. You will get 10 boards but for a price where I cannot get even 1 PCB for over here in Europe...)
• For user using OSHpark service I added a seperate gerber/drill zipfile to this Step called OSHpark_gerber_drill
• The parts to solder on the PCB I put in a separate pdf BOM list which I attached to the ZIP file to download from this project
• A micro USB cable for the power and the programming of the firmware
• A standard 5V USB power adapter like from your smartphone or find one on Ebay.
• The OLED panel I got from ebay, click here I2C 2.42 128x64 Graphic OLED White Module ( Arduino / PIC / Multi-wii). The cutout in the Acrylic design matches the size of this OLED module.
• A DHT22 / AM2302 Humidity + Temperature sensor (Ebay is your friend...)
• Approx. 20cm of Adafruit Neopixel RGBW strip (so it includes W - White, my code is based on that fact). Click here. Others (clones from china) might work as well but I can give no guarantee...
• An ESP8266 module variant 07 (! important when you use my PCB design). Search at Ebay for ESP-07 like this one.

Software

• The code is attached in the ZIP file, there are also some librarier zipped inside the zipfile, you need to install these in the Arduino IDE. How this works can be found on www.arduino.cc
• You need the Arduino IDE 1.6.5 with the ESP8266 board package installed. (1.6.6 and 1.6.7 had a problem with ESP8266 at the moment I wrote this, I do not know what or why...)

Step 2: Mechanical Assembly (Laser-cutting the Acrylic Sheets and 3d-printing the Display Bezel)

I supplied all CAD files and the cutting itself depends on your local available machine regarding speed and power. I have included the base stand file, a file containing the complete sun/cloud but also 2 separate files for sun and cloud. In the pictures you can see I made 2 bodies, one is completely transparent the other has a yellow sun out of yellow acrylic sheet. With the supplied files you can choose which one to make.

In the end I chose to do the sun in yellow, the cloud in transparent colorless and the base stand in blue.

I supplied a laser-cut version and 3d file version of the bezel. If you choose the laser version then you need plastic sheet material of approx. 1mm to 1.5mm thick.

I used the laser-cut version because it looks more tidy then 3d printing and there is less light shining through due to the RGB leds. Aligning this laser-cut version to the acrylic body is more difficult since this has no notches like the 3d printed version but it looks much more tight and it lets no light slip through from the RGB (Neopixel) leds behind it shining through the acrylic body.

The 4 corner holes in the acrylic body needed treatment with a countersink. There is a picture added with this step which shows how the countersunken holes look. That way when mounting the PCB to the acrylic body you can lodge the screws in the body and the bezel will fit nicely over it, hiding the screws.

Lastly I used double-sided tape to attach the bezel to the plexiglas body.

Step 3: The Electronics

After I tested my electronics as a prototype on a breadboard (experimental board) I decided to design a printed circuit board, this looks very nice and makes fabrication easier. So there are 2 ways to build your own weather station variant. On a simple breadboard or you can use my PCB design!

The easy way: use the PCB design + parts list

With this instructable I supplied the schematic, Bill of Materials and Gerber files of the PCB. The easy way would be to buy the parts on my Bill of Materials (Farnell/Newark ordercodes included), order my PCB design from your PCB supplier of choice and solder it all on the PCB. No further instructions needed and you can go to the next step after soldering. NOTE: R7 + R8 are DO NOT MOUNT because the OLED display that I used has on-board pull-up resistors on it's I2C SCLK and SDA lines.

To mount the PCB to the back of the acrylic body I used 4 standoff's of 12mm high and 4x M3 screws with countersunken heads.

Building the electronic circuit on an experimental board

As an alternative you can build the circuit on an experimental board and use only the parts you can get your hands on and/or want to use. The schematic + PCB layout are the fancy version but when I pre-tested this all together I connected it using some wires "in the air" and OLED display + DHT22 were directly connected to the ESP8266 with wires, everything running on 3.3V. The Neopixels however DO NEED 5V and the 470 ohm resistor + large Electrolytic capacitor are for protection so do use them.

The extra parts in the end schematic are to make sure every part that was intended to run on 5V gets 5V and can safely communicate with the 3.3V ESP8266 without damaging it. Also a fuse is added just for protection.

Ordering the PCB and the parts from the BOM would be the easiest way to go but here's some information if you want to keep the cost to a minimum. So this information is only for those who want to build the circuitry by hand and using the bare minimum components. You need at least the OLED panel and the ESP8266. The DHT22 is used to measure your inside temperature and humidity. You can leave this if you like.

Also the connection to thingspeak is optional. I just use this to show what I measure right outside my doorstep. If you want to include this on your station it will require you having your own data on thingspeak using your own weather station. There are many options to find on Instructables.com. My own is only using an ESP8266 with a BMP180 pressure + temperature sensor. When I finish this instructable and have time I'll post my Thingspeak station as well and update this instructable :)

About the parts

First of all: all capacitors and resistors are none-critical which means you need them but any will do. So a 5% resistor is fine, a 20% tolerance capacitor too. All footprints (sizes) are the same: 0805 casing.

IC6 is only used to easily program the ESP8266 from the Arduino IDE using a USB cable like with Arduino's. If you already own an UART to USB converter like FT232 or similar you could also skip IC6 and pre-program the ESP8266 with the software. If you do this then S1 and S2 could be skipped as well.

F1 and D1 are for protection. If you do not want this simply do not mount D1 and short-circuit the F1 footprint simply with a wire, drop of tin or fancy "1206" shaped 0 ohms resistor.

IC2,3,4,5 are level translators. I added them to make sure that the 5V components can communicate with the 3.3V components. I've seen at least some designs where people feed the DHT22 with 3.3V although this is too low according specification. You could try this as well and do not mount IC3. In that case directly connect GPIO12 of the ESP8266 to the DHT22 data pin.

The Neopixels are not spec'd for operation on 3.3V logic signals and it needs 5V power for sure: 3.3V is too low. As a compromise some people run their circuit on 3.7V using a LiPo battery. You could do this but keep in mind thats the MAX for ESP8266 and just the MINIMUM for the Neopixels.

In my schematic + PCB design the OLED panel is powered by 5V. I know it works on 3.3V as well (tested it) only the luminous intensity is slightly lower. If you want to build the circuit on an experimental board just feed it with 3.3V and you will be fine.

Step 4: The Software

The last step! Very important, the software.

If you've used my PCB design then programming can be done inside the Arduino IDE. Set the board in the IDE to Generic ESP8266 module. Connect the Weather station to your PC using a micro USB cable. The COM port you need depends on the COM number that your PC gave to the weather station. You can find this in the device manager under Ports. The speed/baudrate that my ESP8266 came with is 115200 so thats what I've set in the IDE.

Press the switches on the board: first S2 then S1, then release S2 followed by S1. The blue light on the ESP-07 blinks shortly and the ESP8266 is in bootloader mode, ready to upload the sketch.

The code is pretty self-explaining and has been commented to explain what each part does.

Inside the code there is a part which begins with:

/*******begin settings*********/

and ends with:

/********end settings**********/

In this section you need to fill in some details for your local wifi, Wunderground and Thingspeak accounts.

• Your WiFi credentials need to be filled in in the Sketch
• You need to create a (free !) account on wunderground.com and get an API key with it, fill this in the Sketch
• You need to find on wunderground.com the name of your local weather station, usually its the name of your city in capitals but look it up on their site and fill this in in your sketch
• If you have your own Thingspeak weather station as well then you need to fill in the sketch your Thingspeak channel ID and API key
• If you did not use my PCB design or schematic then maybe you need to change some things regarding the pin used for DHT22 and/or OLED SCL + SDA lines

You can specify how many pages you want to show on your OLED panel with this variable in the code : int numberOfFrames = 6;

So for example if you want to skip the Thingspeak function you need to change this to int numberOfFrames = 5;

Also you need to disable the code for that frame. For each frame there is a function which defines what to show in that frame. For the Thingspeak example it's drawFrame5 so locate that and delete it or comment it out. I think it's required as well that you re-name drawFrame6 to drawFrame5 now.

If you want to add a frame then just re-specify int numberOfFrames = newnrofframes ; then copy one of those functions drawFrameX and change it to what I want to show copy/pasting code from the other frames. I did not try it yet.

To control the RGB led fading I added the Adafruit Neopatterns class in the code. I also added 2 functions:

1. void update_fading_of_my_neopixels(void) //this function is called every 1mS using the Ticker option from the ESP8266 packages. This updates the neopixel fading pattern every 1mS without interfering with the frames sliding on the OLED panel.

2. change_neopixel_color(void) //in this function I change the color of the RGB leds depending on the weather forecast. It's not perfect yet but the idea is clear and you can easily adapt it to your own liking.

That was it people! I hope you enjoyed my (first) instructable and that many Acrylic glowing weather stations in the world will see the light!

UPDATE FEBRUARY 2017

There was a little bug in the original software since the beginning, the code does not pickup daylight saving time. So I kept changing every 6 months the code: the UTC_OFFSET variable needed to be 2 in wintertime for me and 1 in summer. I fixed it now very simply. I do not use the timeclient anymore but instead get the time from the Wunderground local station (the code to do this was already made by Daniel Eichhorn)

In the main sketch just locate the function bool drawFrame1() and change here 1 line, the one where string time gets the time assigned:
bool drawFrame1(SSD1306 display, SSD1306UiState state, int x, int y) {

...............................

//String time = timeClient.getFormattedTime();

String time = wunderground.getHours() + ":" + wunderground.getMinutes() + ":" + wunderground.getSeconds();

...............................}`