Decibel Monitor for Gamers

Ik heb als project gekozen om een Apparaat te ontwikkelen die Gamers eraan helpt te herrineren om hun stemvolume te beperken. Zelf ondervind ik dat ik vaak in de late uurtjes wat te luid kan spreken.

Dit apparaat helpt de gamer om zijn volume te beperken / te monitoren doormiddel van enkele sensoren:

·     Geluidssensor

o Hiermee zal het geluid gemeten worden en hiervan de decibels berekend worden, er zijn standaard decibel grenzen ingesteld, maar de gebruiker kan aan de hand van zijn ondervindingen deze grenzen naar gewenste waardes aanpassen op de webapp

·     Lichtsensor

o Er is ook een optie om ervoor te kiezen om de grenzen wat gevoeliger in te stellen wanneer het apparaat een donkere ruimte detecteert, ook deze grenzen kan de gebruiker via de webinterface volledig aanpassen

·     Schakelaar

o Er is ook een fysieke schakelaar aanwezig die het apparaat veilig kan uitschakelen

Ook is er een display aanwezig waar je de huidige decibelwaarde kan zien, maar ook het huidige IP adres van de raspberry pi. Er zal ook een ledstrip verwerkt zijn in het toestel die aan de hand van 3 kleuren kan aantonen of de decibelwaardes te hoog zijn.

Er zal ook een webinterface aanwezig zijn waar je enkele zaken kunt zien/instellen. Zo zal je enkele statistieken kunnen zien van de voorbije dagen. Ook zal je daar enkele zaken kunnen instellen/aanpassen. Zo zal je er de grenzen kunnen aanpasen en of je de lichtfunctie wilt gebruiken.

On the linked file, there will be a list of all the materials used to create this project.

Before you start your project, you should always create an wiring diagram. It will help you later on when it's time to connect all the parts together. On the image you can see my version of the wiring diagram.

After you created your own wiring diagram, is it time to begin to connect all of the electronical parts together. for me it went surprisingly well. it's mainly because of the well created wiring diagram i created earlier. after some minor tweaks it was done.

The database is a fairly simple database. There are just a couple of tables present. there is one for storing the data of the sensors. that table is linked to a table for storing al the sensors. there is also a table for all of the settings and one to store the color changes of the ledstrip. this will be used to create a nice graph.

from the moment I started working on this project, had I already a vision of the product stored inside of my head. So it wasn't that hard to come up with a 3D design. this was influenced by the design of the streamdeck+. after the design was ready i send the design over to a buddy of mine to print it on a 3D printer.

after all of the preparation, it was time to dive in to the code. after a lot of trial and error and a lot of hours of work, i finally managed to store all the data of the sensors in the database.

then I started to write the code for the LCD screen and the rotary encoder. that was a whole other level. My raspberry Pi wasn't able to read the rotary encoder properly because of al of the other stuff it needed to do. luckily I got some help of one of my professors. he helped me to figure out a solution for this problem. after the help it still had sometimes a faulty read but it was a whole improvement.

Now it was time for the most relaxing part of the project, designing the frontend on a program called Figma. It is a great tool to design web applications.

the previous night I randomly watched a youtuber redesigning some of their favourite websites. She created an amazing colour palette. It was very inspiring, so with that in mind I also created a nice colour palette.

After that is was just a fast process until the final product was created. I stayed in the dark theme mainly because it's more and more becoming a common theme.

The HTML code wasn't that hard to write, but off course it couldn't be all smoot sailing. the css was just a pain in the ass to write.

And when I finally managed to pull it off, I got a devastating setback. all of the css and HTML i just wrote was gone. the SD card of my Raspberry Pi formatted himself just before I could manage to create a backup of it.

luckily I managed to find a backup of the HTML code. with a fresh mind, I managed to write the CSS again, and even better this time.

then I went off to start writing the JavaScript for the site. it was all smoot sailing until I started to begin on Socket IO. it was a big struggle but with some help of the professors I managed to pull it off.

after some proper testing, I put everything together. i just needed to drill a small hole in the back of the device so the wires of the ledstrip can be nicely tucked away.

now that everything is created, its time to install the apache server so the site is available on the local network. we also need to run the backend file on startup. make sure to add a small delay, so everything can set up before the backend runs.