Inspiration

Drake's new album "Her Loss" just came out, and obviously everyone wants to sing along. It's hard to memorize every bar of an album containing sixteen songs, so we had to figure out a way to make it easy. That's when we thought of LyricGenius, the most innovative and trending website today that accomplishes the task perfectly!

What it does

LyricGenius is a website with the purpose of assisting users in their journey of memorizing songs. It asks for two user inputs: an artist's name and their song's name. If they are valid inputs, then all the lyrics to their song will appear on a new screen. But there's a twist! Every line of the song has one random word missing, and it is the user's job to fill in as many of the blanks as they can which will help them memorize the song's lyrics.

How we built it

We built LyricGenius utilizing a frontend and backend structure. The frontend refers to the user interface whereas the backend refers to the actual code behind the website. Two members of our group focused on frontend, where they built the actual website (screens for taking user input and returning song lyrics) and created LyricGenius's very own logo using HTML, CSS, and Javascript. The other two members focused on backend where they utilized Python, Genius's API, Flask, Ngrok, and Libraries to write code that takes out a random word in each line of the song and transfer information to and from backend.

Challenges we ran into

Every program has its own challenges, and even though LyricGenius is like no other it did bring up some obstacles. Since we had no prior experience with web development, none of us knew how to transfer information from frontend to backend so we could actually utilize our code on our website. However, we overcame this challenge by using Ngrok and Flask, two tools that we learned just through ZotHacks. The biggest challenge that we weren't able to overcome is the time that it takes for the website to run. Since Genius's API runs through every song in its library looking for the song the user inputted, it takes a while for the requested lyrics to pop up. Unfortunately, we weren't able to overcome this obstacle since it's just how the API works.

Accomplishments that we're proud of

We're most proud of the fact that we were able to create our own unique user interface without any previous knowledge or experience. The fact that we were able to learn much more about web development through the formation of a very unique website idea is something else we're proud of. And finally, we're also proud of the fact that our website is able to successfully extract and edit lyrics from any one of the millions of songs in Genius's Library.

What we learned

Our group was full of beginners coming into ZotHacks. We quickly realized that none of us had any experience with the core components of Web Development. We were initially afraid of not being able to thrive because of our lower-level knowledge of the relevant areas, but we eventually labored and conversed with newfound enthusiasm due to the simple fact that we craved to learn and grow as beginner computer scientists. This enthusiasm inspired us to utilize as many distinct tools as possible in our quest of creating our own Lyrics Quiz. Through our own research and the assistance of our mentor, our group employed the various tools of HTML, CSS, JavaScript, Flask, APIs, Libraries, Ngrok, and Python to reach our goal. Besides Libraries and Python, none of us knew a single thing about any of the other tools, but after our project we know so much more. We wanted to complete a project that used APIs and programming languages (heavily) that we never learned about before, and even though it was a risk, it worked out greatly in the end.

What's next for LyricGenius

Although we're extremely satisfied with what we've accomplished with LyricGenius, there's so much more we would like to do with LyricGenius. Specifically, we're going to implement a timer into the website so that the user only has a limited amount of time to finish the quiz, working their brain a little more. We're also going to implement different difficulty levels (the harder the difficulty level, the more words missing from each line). In addition, we realize that this is going to be very difficult for some people, and so to gear LyricGenius more towards them we are going to implement a multiple choice option for the quiz and include hints which can be used if the user needs them. These are only some of the changes we hope to make to LyricGenius so it can finally be recognized as the greatest lyric quiz website of all time!

Built With

Share this project:

Updates