Programmable Sticky Note: Desktop Scrolling LED Display

by CLClab306 in Circuits > Microcontrollers

2163 Views, 52 Favorites, 0 Comments

Programmable Sticky Note: Desktop Scrolling LED Display

3Scrolls

Have you ever been at work and suddenly remembered something you really need to do at home (or vice versa), but you're worried that you won't remember to do it when you finally get there? You might phone or text to ask someone to put a sticky note up as a reminder, but that won't work if no one is there. This Instructable offers an alternative approach that allows you to upload text to a cloud service that will send your text to an inexpensive (< $20 in parts) Desktop Scrolling LED Display that is much more likely to grab your attention than a paper sticky note. Of course, an electronic sticky-note is is just one of several ways to use this device. For example, it can be also used as a clock/calendar, a desk nameplate, a customer counter display, a message receiver, and much more).

The scrolling display uses a small (32 x 132 mm) 8 x 32 LED matrix module connected to an ESP8266 development board. The LED matrix and ESP board are powered by a rechargeable 3.7 V Li-ion battery (18650) attached to a battery charging module (TP4056). Everything is contained in a 3-D printed enclosure that makes it completely portable within range of your Wi-Fi signal.

The ESP8266 code takes advantage of the Adafruit IO (AIO) cloud service, which is available free for the small number of data feeds (<10) used here. Users with AIO accounts can upload 3 different text messages to the cloud via phone, tablet or computer. Users can also select which text message is displayed, the time of day it will be displayed, and the rate at which the message scrolls across the LED matrix. If no message is selected, the default display will scroll the time of day, day of the week and date.

This project requires access to a 3D printer, some soldering, and general familiarity using Arduino IDE 2.1 to edit and upload program sketches to microcontroller boards.

Supplies

Supplies.jpeg

The following items are needed for this project:

  1. MAX7219 Dot Matrix Module 4-in-1 LED Display Module ($2.99)
  2. D1 Mini ESP8266-12F (~$2.83)
  3. Toggle switch, ON/OFF (~$1.10)
  4. 18650 Lithium Battery (~$4.50)
  5. 18650 Lithium Battery Charging Board TP4056 5V 1A (~$0.78)
  6. Battery Springs AAA Battery (~$0.35)
  7. Breadboard jumper wires (~$0.50)
  8. 1 x 5 male header, 0.1" pitch (~$0.07)
  9. Two (2) 4/40 x 3/8 machine screws
  10. 3D printer filament: PLA and TPU (any color)
  11. Wire, solder, heat shrink, hot glue sticks

Tools

Tools1.jpeg
Tools2.jpeg

Tools used for this project are listed below. I have a Lulzbot TAZ-5 3D printer, but any 3D printer should work.

  1. 3D printer
  2. soldering iron
  3. desoldering tool (solder sucker)
  4. wire stripper
  5. wire cutter
  6. needle nose pliers
  7. 4/40 tap & tap wrench
  8. hot glue gun

Print 3D Parts

Miniscroll Box GIF - Find &amp; Share on GIPHY
BackPanel.png
Matrix Holder.png
18650Holder_Short v2.png

The printed parts are shown in the pictures.

  1. Enclosure (PLA): The enclosure was printed with supports at a 0.38 mm layer height (20% infill). To minimize the amount of filament used for supports, the enclosure was printed with the back (open) side of the enclosure facing up.
  2. Back Panel (PLA): The panel was printed at a 0.38 mm layer height (20% infill), without supports
  3. Matrix Holders (TPU or NinjaFlex): The LED matrix is attached to the main enclosure using rectangular rings printed with a flexible filament (0.25 mm layer height, 100% infill, no supports). Print 2 of these.
  4. Battery Holder (PLA): The 18650 battery holder was printed (0.38 mm layer height, 20% infill, no supports) using an STL file downloaded from Thingiverse (thing:2289291). This file is not included below so you will need to click the Thingiverse link to download the file appropriate for your battery (long vs. short version). The short version provides a nice snug fit for the EBL battery linked in the Supplies list.

Items 1, 2 and 3 were designed using Fusion 360. The f3d file and the three STL files can be downloaded from the links below.

Wire the Battery Holder

holder_clips.jpeg
bent_clip.jpeg
Batter#3.jpeg

First, check to see whether the width of the solder tabs on the battery clips will easily fit through the vertical slots at either end of the battery holder. If not, file the edges (or use a Moto-tool) to widen the slots. Then, place the clips into the slots with the solder tabs at the top (see picture). Match the clip placements with the battery diagram printed on the bottom of the holder, inserting the spring clip at the minus (-) end and the button clip at the plus (+) end. Next, gently tap on the tops of the solder tabs until the bottom edges of the large metal squares are flush with the bottom edges of the openings at each end. Use needle nose pliers to put a gentle 90-degree bend in the solder tabs so that the tabs extend beyond the ends of the holder (see picture). Finally, solder a 4-in black wire (22-24 ga) to the solder lug on the spring clip and an 8-in red wire to the solder lug on the button clip, covering both connections with heat shrink (see picture).

Change Header on LED Matrix Module

Matrix#1.jpg
Matrix#2.jpg
Matrix #3.jpeg

The first picture shows the orientation of the matrix. Because the bent header on the right side (R) interferes with the way the matrix is mounted in the enclosure, it must be removed and replaced with a straight header that points away from the back side of the circuit board. First, carefully remove the rightmost 8 x 8 LED module after marking the top edge. I used an integrated chip puller to minimize bending of the pins (see picture with module removed). Next, use your wire cutters to cut the plastic that connects each pin to the next one and use the desoldering tool to remove each pin one at a time. Be careful not to get the board's solder pads so hot that they separate from the board (I learned this the hard way). Make sure each hole on the circuit board is clear of solder when finished. Then, solder the 1 x 5 straight header to the back side of the circuit board (see picture). Finally, carefully insert the 8 x 8 LED module back into its socket, with the marked edge at the top.

Wire the Battery Charger and Switch

MiniScrollCircuit.jpg
ClipTabs.jpg
holder_charger.jpeg
Final-wires.jpeg
FinalCircuit.jpeg

The diagram shows all the connections needed for this circuit. The squares at the end of wires indicate a solder connection, while the diamonds indicate where a female jumper-wire connector is attached to a male header. Circles indicate where 3 wires are soldered together.

  1. Use wire cutters to carefully clip off the two small tabs that stick out of one end of the battery charger (see picture). Then, make sure the charger will fit completely inside the raised rectangular box at the left inside end of the enclosure. The charger should rest flat in the box, with the micro USB socket accessible through the rectangular hole on the enclosure side.
  2. Remove the charger from the enclosure, and solder the black (blue in diagram) and red wires from the battery holder to the B- and B+ solder pads (respectively) on the battery charger, with the wires oriented away from the charger as shown in the picture.
  3. Cut an 8-in black female-to-female jumper wire in half and solder it to a 4-in piece of wire. Repeat this step using an 8-in red female-to-female jumper wire and a different 4-in piece of wire. These are the solder connections marked by the circles in the diagram. Both of these solder joints should be covered with heat shrink or electrical tape (see picture).
  4. Take the free end of the wire soldered to the black jumper wires and solder it to the OUT- solder pad on the charger, with the wire oriented away from the charger as shown in the picture.
  5. Take the free end of the wire soldered to the red jumper wires and solder it to the Normally Open (NO) lug on the toggle switch.
  6. Next, solder a 4-in piece of wire between the Common (C) lug on the toggle switch and the OUT+ solder pad on the charger, with the wire oriented away from the charger as shown in the picture.
  7. Attach the female connector pins to the appropriate straight header pins on the ESP8266 and MAX LED as shown in the wiring diagram (see picture).

Create an Adafruit IO Account

If you don't already have an Adafruit IO account, you can create one by going to the Adafruit IO website. Scroll down the page until you see the "Get started FREE" box and click on "Sign up Now." You'll be required to give your name and email address as well as to specify a Username (IO_USERNAME) and Account Password. At the end of the process, Adafruit will generate a unique "Key" (IO_KEY) that will be associated with your account. Copy and save this key in a safe place because the ESP8266 sketch will need it to access the Adafruit IO data feeds. Note that the IO_KEY is not the same as your account password. You will use your IO_USERNAME and Account Password to access the Adafruit IO website, but the ESP8266 sketch will use the IO_USERNAME and IO_KEY to access your data feeds. Once you've created and logged into your account, you can access Adafruit IO by clicking on "IO" in the menubar at the top of the Adafruit.com page. From the IO page, you can view your IO_KEY by clicking the yellow highlighted key symbol at the right end of the second level menubar. That same menubar also allows access to your Feeds and Dashboards (see Step 9 for more about these).

Upload Program Sketch to ESP8266

In addition to downloading the Arduino IDE 2.1 to your computer, you will need to install the files for controlling ESP8266 boards using the IDE's Boards Manager and 5 Libraries using the IDE's Library Manager: Time, Timezone, MD_Parola, MD_MAX72xx.h, and Adafruit IO Arduino.

  1. Download/Install the Arduino IDE: HERE and install on your computer (Windows or Mac OS).
  2. Install the ESP8266 Boards Manager: Open the IDE and click on the Boards Manager icon (just below the folder icon in the left column). Search for and install ESP8266 Boards (3.02).
  3. Install the Libraries: Open the IDE and click on the Library Installer icon (just below the Boards Manager icon) to search for and install the libraries named above. Type the Library names into the search window and click on INSTALL when you find the correct Library.
  4. Download/Open the MiniScroll sketch: Download MiniScroll_AIO_ESP8266.ino and config.h to your computer and open it by double-clicking on the sketch file (.ino suffix) icon. You may need to add the suffixes to these filenames after downloading. The first time you try to open the .ino file, the IDE will ask you to put this sketch in a folder, which you should do. Then, drag the config.h file into the same folder. The next time you open the sketch file (from inside the folder), the IDE will load both files, which can then be accessed by clicking the tabs at the top of the IDE window.
  5. Edit "config.h" file: Open the "config.h" file by clicking on its tab near the top of the IDE window. Edit the lines in that file by replacing the default text with your Adafruit IO_USERNAME and your Adafruit IO_KEY (Step 6). You will also need to enter the SSID and local WiFi password. Save the edited file.
  6. Edit Timezone Setting: Select the other tab at the top of the IDE window to return to the main sketch. The default code is set for the US Pacific Time Zone. If you are in a different time zone, you will need to edit the sketch in two places: lines 40-42 and line 219. For more information about the timezone syntax, go here. Save the edited file.
  7. Connect the D1 Mini ESP8266 board to your computer with USB cable.
  8. Select Board and Port: Click the downward caret to open the dropdown menu on the IDE menu bar, then click "Select other board and port...". Select "LOLIN(WEMOS) D1 mini (clone)" and the appropriate USB port in the popup menu. Click OK when finished.
  9. Verify the sketch to check for errors: Click the "Verify" icon in the IDE menu bar. The IDE will then attempt to compile the sketch, which should result in no error messages. Correct any errors before continuing.
  10. Upload sketch from computer to D1 Mini ESP8266: Click on the "Upload" icon in the IDE menu bar (see picture). The IDE will compile the sketch again and upload the compiled code to the ESP8266.

After several seconds, the following message should scroll across the LED matrix: “Connected to Adafruit IO.” This will be followed by the default scroll (time, day, date). The default ONTIME is set to one minute after midnight (0001) and the default OFFTIME is set to 11:59 pm (2359). The default scroll SPEED is set at "25" and the default duration of the pause at the end of each scroll is 1 sec. The default pause duration can be changed by editing line 28 in the sketch and saving/uploading it again. The values of ONTIME, OFFTIME, and SPEED can be changed at any time by adding new values to their Adafruit IO data Feeds (see Step 9).

Install Circuit in Enclosure

glued_charger.jpeg
back_inside.jpeg

Working from the rear opening of the enclosure:

  1. Put a small dollop of hot glue in the bottom of the rectangular box on the left inside of the enclosure. Then, while firmly pressing the battery charger into the bottom of that box, apply hot glue over the solder connections on the right end of the charger, making sure that the glue overlaps the the adjacent sides of the rectangular box (see picture).
  2. Apply a bead of hot glue to the bottom of the battery holder and press the holder down on the enclosure base at the right end.
  3. Mount the toggle switch in the hole on the left side.
  4. Slide one of the flexible matrix holders over the LED matrix from the front until the bottom edge aligns with the circuit board. From the rear opening of the enclosure, insert the LED matrix through the rectangular opening in the front of the enclosure until the matrix holder touches the enclosure. Make sure that the straight header on the LED matrix is positioned over the battery charger. Then, slide the other flexible matrix holder over the LED matrix from the front until the top of the holder is flush with the top of the LED matrix. At this point, the front of the enclosure is sandwiched between the two flexible matrix holders and the LED matrix is held in place by friction. If friction is not sufficient, use an adhesive to hold everything in place. My preference is to use a little bit of BluTack (on either side of the matrix panel inside the enclosure), which allows you to easily remove the matrix panel if needed for troubleshooting (see picture).
  5. Insert the 18650 battery into the battery holder, turn on the power switch, and make sure everything is working.
  6. Use the tap wrench and 4/40 tap to cut threads in the holes on each side of the back panel. Tuck the ESP8266 and excess wires into the space between the battery charger and battery holder Then, place the back panel over the rear of the enclosure and secure with 4/40 machine screws. When you tuck in the ESP8266, make sure the unused header pins do not touch any of the exposed solder points on the matrix circuitboard. It may help to cover those solder points with electrical tape to prevent accidental contact with the ESP8266 header pins.

Add New Data to Adafruit IO

Empty_Feeds#2.jpg
Dashboard.jpg

A major feature of this device is the ability to upload messages to the Adafruit IO cloud service using your phone, tablet or computer from anywhere with internet access. You do this by going to the Adafruit IO website and entering new values into the data "feeds" that are continuously monitored by the ESP8266 sketch. You can specify the content of your messages (up to 3 at a time), select which specific message will be displayed, when it will appear on the scrolling display, and how fast it scrolls.

The ESP8266 sketch monitors 8 different feeds that are described as follows:

  1. ontime: This feed specifies the time of day when the scrolling display turns on. Values entered here use a 24-hr clock (i.e., military time), indicating the hours and minutes passed since midnight (0000-2359). The display will only be active when the ONTIME is less than the OFFTIME and the current time falls between those values.
  2. offtime: This feed indicates the time of day when the scrolling display turns off. Like ONTIME, values entered here use a 24-h clock.
  3. select: This feed specifies which of the three stored messages to display, i.e., 1, 2 or 3. Entering 0 (or any number greater than 3) will produce the default display, i.e., time, day of the week, and date. The program could easily be modified to accommodate a larger number of stored messages, although you would need to switch your Adafruit IO account to the paid version if the total number of feeds exceeds 10.
  4. scroll1: This feed contains the text for message #1.
  5. scroll2: This feed contains the text for message #2.
  6. scroll3: This feed contains the text for message #3.
  7. speed: This feed controls the speed at which your message scrolls using a number between 0 and 255. The number is actually the delay between successive shifts in the display, so smaller numbers increase display speed whereas larger numbers slow it down.
  8. AIO_TIME_SECONDS: This is a time feed that is updated every second by Adafruit IO. The ESP8266 sketch uses this feed to update the clock/calendar for the default display and for comparison to the user-specified ONTIME and OFFTIME.

Users can create and change the values of the first seven feeds via the Adafruit IO website. To access your Adafruit IO feeds, login to your Adafruit account at Adafruit.com and click on "IO" in the menubar at the top of the page. Then click on "Feeds" in the second level menu (you may need to widen your browser window if you don't see that menu).

Create Feeds: First time users will see nothing listed under "My Feeds" so the first step is to create the 7 feeds used by the ESP8266 sketch listed above. Click the oval link labeled "+ New Feed" at the top of the page. A pop-up window will open ("Create a new Feed.") asking the name of the new Feed. Do this 7 times, entering a new name from the list above (i.e., ontime, offtime, select, etc.). Doublecheck your spelling to make sure the names match the list. When you're finished, your feeds page should look like the picture.

Enter New Feed Values: As the picture shows, no "Last values" are listed yet for any of your feeds. To add a new value, click on the blue Feed Name on the left side of the window. This will open a new page that shows an X-Y graph at the top (with no data plotted). Click the green box labeled "+ Add Data" at the lower left. Then, enter the new data in the "Value" pop-up window and click "Create." Now, when you return to the main "Feeds" page (by clicking "Feeds" in the menubar), you will see the last value you entered. At this point, you should go ahead and enter data for various feeds to see how they affect the MiniScroll Display.

If you want the display to be blank during the pause between each display cycle, you'll need to add about 12 spaces at the end of messages stored as scroll1, scroll2 or scroll3. If you don't enter those spaces, the last part of your message will be displayed during the pause.

The ESP8266 program monitors the AIO feeds continuously, but changes in feed values are implemented only at the end of the current display cycle. It is important to note that the free version of Adafruit IO only allows 30 days of storage. Any feed value that is older than 30 days will need to be re-entered.

For a quick way to control the display, create a "Dashboard" on Adafruit IO that allows you to select the message (1, 2 or 3) using a number pad and to set scrolling speed using a slider (see picture). You'll find a nice tutorial for making dashboards here.

Conclusions

Clclab306 GIF - Find &amp; Share on GIPHY

This project offers a relatively inexpensive way to make a battery-operated, scrolling display that can be used as an alternative to paper sticky notes. Adafruit IO gives users the ability to post "notes" on the display, even when not on the same WiFi network. However, the display can also be used in many other ways (e.g., clock/calendar, name plate, customer counter display, message sender/receiver, and more). If you want the display where you normally put paper sticky notes, the back panel can be modified to hang on a wall (drill a hole & place it over a nail) or refrigerator (by glueing magnets or attaching suction cups) .

Adafruit IO's ability to capture sensor data offers other ways to enhance the functionality of the display. For example, I have an ESP8266 with a temperature sensor on my apartment balcony that sends outdoor temperature readings to Adafruit IO every 10 min. By adding just a few more lines of code to the sketch, I've added temperature as an additional item on my default time/day/date display.To learn more about Adafruit IO, click here.