Introduction: Tiny Message Board
We will make a tiny connected message board with a 0.96" OLED display that can be controlled from your phone. We will use the IFTTT "DO" app to set and clear the reminder so that no extra hardware will be required besides the OLED display. In addition to the reminder, our tiny message board can display 3 other lines, which we will use to display the daily weather temperature forecast and a surf report, which will be pushed via a couple of IFTTT recipes.
The message board uses a Particle photon (Arduino compatible) for the brain and internet connectivity and a 128x64 monochrome OLED display.
Let's get started.
Step 1: You Will Need...
- A Particle photon microcontroller $20
- A 0.96" I2C Monochrome OLED display $10. Also available on the ADAFRUIT web store.
- A small Breadboard $3
- Breadboard wiring
- An enclosure for the project (a mint box will work)
Step 2: Wiring
The I2C display requires only 4 connections:
- GND and VCC, which we can conveniently get from the Photon's pins 3V3 and GND, and
- SDA and SCL which we will connect to the Photon's D0 and and D1 respectively.
The display consists of 128x64 pixels, which corresponds to 8 rows of 8 pixels (font size 1) or 4 lines of 16 pixels if we use a font size of 2. Our display is "monochrome", but the first line of text is yellow and the rest is blue, so we will use the first line for our reminder and the other 3 lines for other information such as surf report and weather for the day (or whatever else is important to you).
Step 3: Software
We will use the Particle web IDE to write and upload the software to the Photon. I will assume that you have already successfully gone through the registration steps outlined here: getting started.
Assuming that your Photon is now connected to the Cloud via your Wi-Fi access point, we require a few things for this project:
1. Adding the libraries required by our OLED display
Because library code needed modifications, I chose to include the files in the project directly instead of "including" them from the web IDE. To add a library, click on the small + icon at the top right of the Build IDE and type in the name (ADAFRUIT_GFX or ADAFRUIT_SSD1306). This will create a pair of files (.cpp and .h) where you can paste each file. You should end up with 5 files total, the .ino application and the 4 library files. The modifications account for the fact that some libraries and functions are already defined for the photon and also for changing the base I2C address of the display (we used 0x3C required for this display).
2. Creating a Cloud function
To create a function that can be called remotely from a smartphone over the internet, we will need to declare it as such during setup:
Spark.function("SetReminder", SetReminder);
Here we declare a function called "SetReminder", that will call the SetReminder function defined in our tinymessageboard.ino code. The code for that function is very simple:
int SetReminder(String message) {
ClearMessage(0);
if (message.length() > 0)
showMsg(0, message);
}
where 0 is the "line" number. Similarly, we will add a couple of other functions, SetWeather and SetSurf to remotely set the temperature and the surf report for today.
Code is attached.
Attachments
Step 4: Controlling the Message Board From Our Phone Via IFTTT
Thanks to Particle's Cloud and a web service called IFTTT (If This Then That), setting a message on our message board is a very simple task that does not require programming. Head over to IFTTT and create an account if you do not have one.
First we will create a way to set our reminder from our phone using an IFTTT "DO" button. In this case, the reminder is that the sprinkler system is off (rain delay). Download the IFTTT "DO" app on your phone and let's create a button to represent our first "message". You can create the recipe on either your phone or the IFTTT web site using the "DO" tab. Lets call it "Sprinkler is OFF" or whatever your reminder needs to be. For the channel, select the Particle channel and lets "Call a function" on our device. Find the function on your photon called SetReminder and set the parameter of the function to be your reminder; in this case "Sprklr OFF" (you only have about 10 characters, unless to go to a smaller font size). Now you have a button that will set the reminder remotely on your photon. To clear the reminder, create a second DO button calling the same function, but this time pass in an empty parameter.
Step 5: Displaying the Weather
Now let's create an IFTTT recipe that will automatically update the temperature for today. We have chosen to display the low and high for the day.
Create a new recipe and select the "Weather" channel. At the create trigger, select "Today's weather report" and select 6:00AM for the time of the update. For the "That" part, we will call the SetWeather function on our device. Select "SetWeather" on your "photon device name". Edit the information to show the low and high temperature as shown (the "ingredients" of your recipe).
That's it. At 6AM every day, the IFTTT channel will push the weather to your device.
More information on Particle and IFTTT can be found here.
Step 6: Displaying the Surf Report
The method for displaying the surf report is similar this time using the Surfline channel. You can chose to display different fields but keep in mind that anything more than 10 characters will display in a smaller font.
See picture for details.
Step 7: In Conclusion
There are many things you can display using this small OLED display. We have chosen to display text, but the graphics library can also display graphics and perform animations such as scrolling.
Keep in mind that Photons can communicate with each other via the Particle cloud, so you could use this display to show the status of your other projects provided they also use a Photon.
Have fun and post in the comments if you find other applications for your tiny message board! Can you find a way to show water temperature and humidity? Let me know...
8 Comments
Question 11 months ago on Step 7
Hi! Have you seen any of the new particle boards? P2 and Argon? Which one would work with this project?
8 years ago
I give up. How do you create a new "Do" button? I see all the pre-built "Do" buttons. I see how to create a new "IFTTT" recipe. But I can't seem to find the button that allows me to create a new "Do" button.
Reply 8 years ago
Unclerojelio, on iOS, click the small grey icon in the lower right corner.
Then in the next screen, you will find a + button at the top.
In the 3rd screen, click on channel.
Hope that helps!
8 years ago
Tareker -
Thanks for posting this up here! I happened to have purchased these small displays for a project I'm working on (along with the sparkfun OLED shield for the photon) and i have been trying to figure out how to get them all to work together. By looking through your project I was able to get the smaller simpler display to work for me. I'm super happy with the way it came together. I did have a couple of questions for you as well as an off topic question...
- I'm wondering what changes you had to do to make the Adafruit libraries work for these displays. I did the copy and paste deal on files that I created per your instructions. I was glad you mentioned that there should be 5 files once you added them all because when I read through it the first time i thought you were saying that you could put either of those files in (the "or" threw me off :) ). I tried using the files from adafruit directly as well, but obviously the changes you added make things work... Now I wanted to figure out what those changes were.
- I also tried to figure out where we can change the pins that the display is connected to. I had other things on the D0 and D1 pins. I have moved them around now, but wanted to figure out where we could change those pins.
- My third question was on working in the particle.io environment. Do you know a simple way to copy a project so you have a good starting point for another project. The only way I have been able to figure out how to do it is to start a project, manually create files in the project by hitting the "+" button and then copy and paste the code in... Seems a bit more than clunky for as cool as these devices are. I think the IDE could use some love :).
OK, now the off topic question... I noticed that the surf report you were requesting was for Del Mar, and your profile mentions you live in San Diego. Small world as I grew up in Del Mar :). I currently live in Oceanside. Funny how you search the whole www and come up with results in your own backyard! Anyway, thanks again!
Reply 8 years ago
ewarner77, glad you found this instructable useful.
I made a couple of changes to the 1306 libraries that required me to clone and include the files directly in the project: the first was to change the I2C base address (from 0x3D to 0x3C, defined in Adafruit_SSD1306.h) and the second was the removal of a line in Adafruit_GFX.cpp that redefines pgm_read_byte (which appears to be already part of the photon firmware).
I am not aware of a "Clone Project" function in the web IDE although I have looked for it myself... I am sure it is just a matter of time before one appears.
And I would not be surprised if it was not possible to change the location of the I2C pins because the I2C functions usually require some sort of hardware support (that is typically multiplexed/mapped to some other pins, D0 and D1 in this case). I have attached the pin layout from the Particle web site.
Good luck with you projects!
8 years ago
WillP18, yes, it is possible to use this display with a pi: http://learn.adafruit.com/ssd1306-oled-displays-with-raspberry-pi-and-beaglebone-black/wiring
8 years ago
Can the microcontroller be swapped for a raspi?
8 years ago
This would be great for a wearable tech project.