Hello! I was recently introduced to the world of IoT (Internet of Things) as I came across the most popular device in this field, ESP8266. I was amazed by the end number of possibilities which were opened up by this tiny and cheap device. As I am currently new to this, I decided to make a project using it and learn along the way. So, I started searching the internet for projects and ideas.

I came across an amazing project called Arduino Cricket Score Ticker by W. A. Smith. In this project, Arduino along with Ethernet Shield and SD card is used to display live cricket scores from Cricbuzz. This project got me thinking.

I am from India and the first thing which comes to mind after hearing India is Cricket. Here, cricket is religion. It sometimes becomes difficult to sit in front of a TV to follow the entire match. So, why not make something which makes watching score easy, wireless and portable. A dedicated tiny device which shows sufficient information to keep you updated with just a glance at it.

Not a cricket fan? No problem! The code contains the XML parser which can be used to get data from any XML file. Just use the correct functions to get the data.

Step 1: The Plan

The plan is to use the NodeMCU Development Board (with ESP-12E module) to access the internet and request the XML code from Cricbuzz which contains all the information about the ongoing/upcoming matches. This code is saved on the SD card as a .xml file. The file is then read from the SD card to parse the required data from the XML code. I will be using W. A. Smith's code to parse the information. Thanks to his efforts. Check out his project if you wish to make the same using Arduino and Ethernet Shield.

My idea is to make it small as possible, build a custom PCB and case for it. For now, let's make a prototype. But first, let's get familiar with the components used in this project.

Let's get started!

Step 2: OLED Display

I decided to go with an OLED display because of its small size and they are available for cheap. I am using a 0.96" display which will be sufficient for displaying the match information. You can use any size of the display.

The display I am using is a monochrome one with the SSD1306 driver and I2C (2-wire) interface. SPI versions of the display are also available. Running them is an easy task. Download the SSD1306 and GFX libraries needed to run the displays. Thanks to Adafruit for writing these libraries.

Connections are very simple.

GND to GND
VCC to 3.3V
SCL to D1
SDA to D2.

Step 3: SD Card & Adapter

SD card stores the XML file from Cricbuzz till all the information has been parsed. Once the necessary information has been displayed, the file is deleted. Using an SD card to store a 10 - 20 kB XML file is a bit overkill but it makes the parsing much easier and easy to understand.

Any memory card can be used. I chose micro SD card for its small form factor. You can directly solder wires to the SD card but using a breakout board makes the job easy. It should be noted that all SD cards are meant to run on 3.3V. This means that not only it should be powered using 3.3V but also the communication between microcontroller and SD card must be 3.3V logic level. Voltage above 3.3V will KILL IT! We won't be bothering about it as far as NodeMCU is concerned because NodeMCU itself runs on 3.3V which is fine. If you are planning to use any other microcontroller with 5V logic level, make sure that your breakout board has a level shifter built-in (As shown in the picture). It basically converts or 'shifts' the 5V from the microcontroller to SD card friendly 3.3V. Using level shifter along with 3.3V (as I did) does not affect its working.

SD card uses SPI interface for communication. CS or Chip Select pin can be connected to any of the GPIO pins. I chose GPIO15 (D8). Just make necessary changes in the code if you used a pin other than GPIO15

SCK to D5
MISO to D6
MOSI to D7
CS to D8
VCC to 3.3V
GND to GND

Format your SD card

The library we will be using supports FAT16 or FAT32 file systems. Make sure you format the SD card to the correct format.

Step 4: Making the Keypad

I want to keep the project as small as possible. So, I decided to make a separate board for the keypad and mount it above the main board later. This will save some space.

A ready-made key matrix can be purchased but I had push buttons laying around. Also, I wanted to make it as small as possible. A typical arrangement of connecting rows and columns would need a total of 6 GPIO pins for 3 x 3 matrix. This is quite a lot considering that OLED display and SD card will be connected too.

When in doubt, Google it out! That's what I did and found a way which will need just 1 pin to control the entire matrix. This is made possible using Voltage Divider Matrix. Resistors are connected between every row and column. When a key is pressed, a certain combination of resistors gets connected in series which creates a voltage divider. Refer the circuit diagram. The varying voltage will be read by the microcontroller. Each key will produce a different voltage and thus it can be easily found out which key was pressed by reading the output voltage of the matrix. Since we want to read varying voltage levels and now just high and low, we will need an Analog pin. Luckily there is one Analog pin labeled as A0 on NodeMCU. Problem solved!

If you wish to buy a matrix check out the internal connections shown in the diagram. A matrix of any dimensions can be used. Make sure to use a 2.2kΩ resistor between the rows and 680Ω resistor between the columns.

Connecting Push Buttons

Pins 1 & 2 are internally connected. Same with pins 3 & 4. When the button is pressed, all the pins are connected together. Refer the picture to get an idea of connecting the switches on a perfboard.

I have connected a 3-pin male header so that it can be connected to the main board later.

Step 5: Putting Everything Together

You can plan on placing the components wherever you like. No restrictions on it. I will show you how I did it to make it compact as I wanted something that will fit in the palm. It can get a little messy so try my way if you are comfortable with soldering. I decided to populate both the sides of the board as a two-layer PCB would be. NodeMCU and SD card breakout board on one side and OLED and keypad on the other side.

The SD card breakout just happens to fit between the two female headers which are for the NodeMCU. I desoldered the angled male headers which the breakout board came with, rotated it and again soldered so that the pins go perpendicularly downwards as shown in the picture. Accessing the SD card slot becomes easier.

I bent the pins of a 4-pin female header at a right angle and soldered it on the copper side of the perfboard as shown in the picture.

Cover the solder joints under the keypad to prevent short circuits. Add a thin piece of hard foam (around 5mm thick) between the keypad and mainboard for extra protection and rigidity. Finally, solder the keypad which we made earlier. Having a soldering iron with a pointed tip will surely make your job easy. It was a messy job making it as compact as possible but finally managed to do it.

Double check all your connections for any short circuits before powering the device!

Step 6: Setting Up the Keypad

Once you have checked all the connections, you are ready to power your device for the first time. Fingers crossed! No magic smoke? Congrats!

Now we are ready to set up the keypad. Recall the working of the keypad. Every key press will output a different voltage which is fed to the analog pin of NodeMCU. ESP-12E has an Analog to Digital Converter (ADC) of 10-bit resolution. 2 raised to the power 10 will give 1024. This means that we will be getting a reading between 0 and 1024 for every key pressed. Let us see what readings do we get. But first, we have to write a small program to get those values. Open Arduino IDE, copy paste the following code and upload it to NodeMCU.

int keypadPin = A0;
void setup(){
	Serial.begin(115200);
}
void loop(){
	int r = analogRead(keypadPin);
	Serial.println(r);
}

Open the Serial monitor. Set the baud rate to 115200.
Now press any button. You should get a constant reading on the Serial monitor. Small fluctuations are okay. Those will be taken care of in the main code. Do the same for every key.
Every key should have a different reading.
Note down all the values. We will need them later.

Step 7: Let's Code

Download Scoreboard.ino file provided below on your computer and open it using the Arduino IDE.

Before you upload

1) Set the refresh time for the scoreboard. For example, 15L for 15secs.

2) Enter the SSID and password of the router to wish to connect.

3) Make necessary changes if you chose to connect CS pin of SD card to a pin other than GPIO15.

4) Remember the values which we noted down for all the keys? We have to assign a key number for each value. I had also told you about the fluctuations in the reading. This is because of the switch contacts not being perfect. In the long run, this value can deviate from the current value due to the aging of contacts which adds extra resistance in the circuit thus changing the voltage. We can take care of this problem in the code.

We will add an upper limit and a lower limit of the value with a margin of 5. For example, I got a reading of 617 for key 1.

Subtract 5 from it. 617 - 5 = 612. This is the lower limit.
Now add 5 to it. 617 + 5 = 622. This is the upper limit.
Scroll to the end of the code. Fill the space provided for the two values in the code as shown in the picture.
Do this for every 9 values.

if(r > 612 && r < 622){
keyNumber = 1;
}

What does this mean?

IF the reading (r) is greater than 612 AND less than 622, then key 1 is pressed. Any value between 612 and 622 will be treated as key 1. This solves the problem of fluctuating reading.

Scoreboard.ino
Download

Step 8: Building the Case

This is completely optional. I thought the project would look neat and complete with a case around it. With no proper tools for this job, it was going to be a huge task for me. The case is built using acrylic.

Prepared the pieces for gluing by smoothing out the edges using sandpaper. I used Fevi Kwik (Super Glue) to join the all pieces together. Super glue leaves a white residue after it has cured. So, apply it only between the joints. You have to be quick and accurate when working with super glue as it sets quickly. Acrylic Cement is best suited for this job.

Made a small opening to access the USB port using a file. It should be big enough to insert the USB cord.

Created a 3x3 grid on front cover for the push buttons. This will make the push buttons difficult to access. To solve this problem, I cut square pieces for each key so their buttons are now extended up to the surface.

After so much of sanding, cutting, fixing and adjusting, it was finally done!

Step 9: Have Fun!

Finally, all the hard work is done. Power up your mini scoreboard and stay updated with the game.

After powering up, it first connects to the access point. Initializes the SD card. It will show an error if the SD card is not initialized.

A list of all the matches will be displayed along with match number.

Select the match number using the keypad.

The scores will be displayed. You can customize what all things you want to see on the display. I wouldn't be going too deep into explaining the code. You can find a detailed explanation here on the how the parsing works.

To get back to the menu, hold the BACK (Key 8) button till the "Fetching Scores..." page is displayed.

Future Plans

Design a custom PCB with the ESP8266 12-E module.
Add a rechargeable battery.
Improve the code with new features.

Hope you enjoyed the build. Make it yourself and have fun! There is always some space for improvement and a lot to learn. Come up with your own ideas. Feel free to comment any suggestions regarding the build. Thank you for sticking around till the end.