Inspiration

We were inspired by the power of nature on your mood. We felt that there were appropriate song choices for certain times of the day and certain types of days. This led us to create a web page that recommends songs depending on the current weather and time, which the user may not have thought of before.

What it does

This application takes in data about the current weather along with time, and recommends a spotify playlist to the user. It also projects a relevant image depending on the weather and time of day it is.

How we built it

We built our project as a single page application using ReactJS. We built this using a weather API to pull the current weather data from. Depending on the current weather, we would display a symbol representing a sunny, rainy, cloudy, or thunderstorming type of day. With the weather and time data, we checked how they matched and outputted a corresponding playlist and photo. We also used the Spotify API which allows us to embed certain playlists into our website.

Challenges we ran into

We had a hard time figuring out how to use the Spotify API to pull playlists and put it into our website. We also had challenges changing the background for each time of day. However, we were able to resolve our problems with team collaboration and further internet searches.

Accomplishments that we're proud of

We are proud of the dedication we had to creating a functional webpage using ReactJS, especially when our team members had zero prior experience in the language.

What we learned

We learned about the powerful capabilities of javascript, css, and html. We also got exposure to using APIs including the weather and spotify APIs.

What's next for Spotomosphere

We will move to a mobile application which can be used for Android and Apple. Since we learned mobile app development and UI/UX design for this hackathon event, we will keep working on this project for the foreseeable future.

As for the prizes, we are looking to compete for all emerging prizes and all general prizes.

Share this project:

Updates