Smart Mini Football Table
by runedhaluwin in Living > Toys & Games
132 Views, 1 Favorites, 0 Comments
Smart Mini Football Table
Hello! I have created an awesome Smart Mini Football Table that's perfect for foosball fans who want to take their game to the next level. This table automatically keeps track of the score and shows it on a digital scoreboard and our website. It uses sensors to know where the ball is and which team has the ball most of the time. After someone scores, the ball goes back into play on its own thanks to the servomotors, and there’s a fun effect each time a goal is scored.
On the website, you can see the current score, the ball's live location, how long the match has been going on, the history of goals, which team has had the ball more, and stats from previous matches. It's a super fun and interactive way to enjoy foosball!
Supplies
**Electronics:**
**Basics:**
- Raspberry Pi 4 Model B (4GB)
- 16GB SD Card
- Raspberry Pi 4 USB-C Power Supply
- Breadboard Power Supply
- Jumper Wires
**Sensors:**
- 2x Ultrasonic Sensor
- 6x Hall Sensor
- 1x LDR (Light Dependent Resistor)
**Displays:**
- 2x 7-Segment Display
- LCD Screen
**Actuators:**
- 2x Servomotor
- 12x LEDs
**Components:**
- PCF8574 (I/O Expander for LCD)
- PN2222 Transistor
- Diode
- MCP3008 (Analog-to-Digital Converter)
- 2x Shift Registers
**Passive Components:**
- Potentiometer
- Resistors
- 2x Push Buttons
- 3x Breadboards
---
**Mechanical Components:**
**Structure:**
- MDF Board
- Wooden Stick (Flat)
- Wooden Stick (Cube)
- Aluminum Tube
- Velcro
- Decorative Stickers
- Artificial Grass
- Ditch
**Game Specific:**
- Mini Foosball Table
- Foosball Ball
- Magnetic Ball
**Cost of the project**
The cost of all the components is €343,42
The cost per component is specified in Bom-RuneDHaluwin.pdf (bill of materials).
Downloads
Assembling the Frame
The first step was to start assembling the frame of the foosball table. I began by attaching wooden supports underneath the table to form a sturdy foundation. Next, I drilled holes and adjusted the enclosure to ensure that all components would fit properly. Before installing the components, I insulated the connections on the jumper wires to ensure they were safe and secure. Once this was complete, we installed all the components into the enclosure, securing everything in place.
Advanced Framework
Now, I finished building the rest of the enclosure. This meant making the rods by cutting the aluminum tubes and drilling small holes to attach the players. After that, I put the ultrasonic sensors, the chute, and the servomotor in the goals.
Finalizing the Framework
In this step, I attached the last components to the enclosure, such as sticking the Hall sensors underneath the field. I also added wooden pieces along the sides and secured the MDF board on top. Additionally, I inserted the new rods into the game. Finally, I assembled all the parts of the foosball table.
Placing Breadboard and Other Components in the Framework
During this step, I securely mounted the breadboard onto the MDF board and connected each component to the Raspberry Pi as per the schematic using T-connectors. I ensured stability by affixing and insulating necessary pieces to ensure everything is firmly in place. Additionally, I applied Velcro to prepare for attaching artificial turf later. Furthermore, I added small pieces of wood on the field next to the goals to prevent the magnetic ball from getting stuck.
Finishing Touch to the Framework
In this final step for the enclosure, I added the finishing touches to perfect the appearance and functionality. To conceal the old holes, I applied soccer-themed stickers, making them less noticeable. Additionally, I added a textured tape along the sides to enhance the overall finish. Finally, I secured the artificial grass mat to the framework using Velcro for easy removal and maintenance.
Designing Database
With the hardware fully assembled, it's time to dive into the software setup. I began by designing the database, which I would later integrate into the backend. This normalized database structure ensures that the data is stored efficiently and can be easily accessed and managed.
Start Coding
After setting up the database, I began the coding process. I wrote test programs for each component to ensure everything functions correctly before diving into the main code. This approach helps to validate the proper operation of each part and ensures seamless integration within the overall system.
Backend Python Code
After writing short test code for each component, I have now integrated everything. Here’s a brief overview of the core functionalities of the code:
- The code starts by importing some libraries and defining classes that will be used. Next, it declares the GPIO pins and creates some variables.
- When the code runs, it first executes the setup function. From that point on, you can start the game at any time by pressing the yellow button.
- Once the button is pressed, it resets the scoreboard. If a game is not already in progress, it will start one. This is indicated by a small animation on the LCD screen and the LEDs.
- Then, all threads are started simultaneously: one thread to update the live timer, and one thread for each sensor that needs to be read.
- In each thread, the processed value is pushed to the frontend via Socket.IO. Later, in the JavaScript code, I will explain how these values are handled.
- Finally, my backend/app.py program includes some Socket.IO and app routes.
Managing Data in DataRepository.py
I retrieve data from the database and insert data into it in this way in my datarepository.py as shown in the photo.
Making a Design in Figma
Before actually coding the frontend, I made a design in figma of how I wanted my website to look.
Creating the Frontend
After finishing the backend, I began developing the frontend of the website. The photos above show the basic HTML code alongside some SCSS snippets that I created to design the initial layout and styling of the website. These pieces form the foundational structure and appearance of the site. After designing the basics of the site, I also had to make sure the website was completely responsive, you can also see this in the pictures above.
Finalizing the Frontend
In this step, I demonstrate how I use JavaScript to dynamically update the data on my website.
These are the values i update using JavaScript:
- The timer when a new game has begun
- The score of the live match
- The Value of the light dependent resistor (light sensor)
- The Value of the hall sensors (magnetic field sensors)
Final Product
And finally, once everything is working, it should look like this