AI Anecdotes

By: Kalea Gin, Catherine Park, Aashna Dureja, Rygel Ginete

What It Does

Our website takes in a song name and artist, and outputs a website page containing the chorus of the song and a picture relating to the chorus. These images are generated by an AI called "Craiyon", an AI that when given a phrase, will output a generated image relating to the phrase. This gives the impression of the "story" of the song being presented in the perspective of an AI, thus our name "AI Anecdotes".

How it Works / Technologies

Using a website made through HTML, CSS, Python, and Flask, the user input is received from our graphical user interface and taken into Genius, which is a website that contains lyrics to thousands of songs. Our program then scans the lyrics to find the chorus (as prompted by the subheadings in Genius), and returns the chorus that is printed on the final webpage using LyricsGenius, which is a Python client for the Genius.com API that provides an interface to the song, artist, and lyrics data. Next, the program selects a random line from the chorus and inputs it into "Craiyon" automatically. After "Craiyon" generates the image, our program then extracts the source URL that projects the image on the final website.

We decided to use Flask to bridge the gap between our front-end (HTML, CSS, and Javascript) and back-end (Python) code to communicate the two sides.

Genius is a popular song lyric website, meaning it would have a large range of songs at its disposal, making it incredibly useful for our purposes. "Craiyon" was used over other AI image generators because it was most accessible to us. Beautiful Soup is a Python library that was used to extract data out of the HTML files we use to web scrape and find source URLs to our images. LyricsGenius is an interface that makes it convinient to access the data on Genius, which is the file we used to extract the chorus from the lyrics.

Progress / Future Ideas

We had a funny idea and wanted to make it work into a simple side project. Our group discussed our goals for the hackathon and what we all decided to achieve at the end. Our group had a strong desire to push our boundaries by exploring concepts like web scraping, getting post requests from front-end and back-end, and learning new languages and technologies.

In the future, we are looking towards making this website more interactive using Angular by adding icons and menus, as well as incorporate a well developed loading screen.