Music
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
Index.html
MYSQL.png
README.md
SongsandVideos.php
Style.css
bootstrap.min.css
bootstrap.min.js
jquery-1.11.3.js

README.md

Overair

PRODUCT DESCRIPTION

Out of the interest to learn HTML, CSS, PHP and Jquery, I decided to create a website based on how weather affects your mood and hence your music.

Do people make different music-listening decisions based on weather? Yes! OverAir uses the research on how weather affects mood and hence acoustic attributes of your music preferences informed by Spotify to create an experiential platform.

Spotify Research Link

You know that feeling when you’re cosy on your bed on winter nights but its too cold outside to actually step out and yet you want to feel the wind. OverAir relaxes you and takes you to the beautiful weather outside you. This website has been my first big coding project and is just a demo of the idea above. Ideally there would be a much bigger database of songs/playlist as well as videos carefully inserted from the research. I also envision the use of live satellite and environmental videos projected from the user’s location ideally. Or a VR OverAir experience! For this project I chose songs from SoudCloud artists that are legal to use and videos from free stock websites.

CODE MPLEMENTATION

I want people to be aware of the weather around them and acknowledge it. I used the geo-coordinates code and OpenWeatherMap API to detect the weather of the user first and then used the weather codes from the API to play songs from the database. The audio database was created based on the research by Spotify. The API call, https://openweathermap.org/weather-conditions

I used the ID of all the possible weather codes in my database, MYSQL and linked it to the playlist and the video as well. < The Interface displays the song and artist name of the audio file playing, weather descriptions, temperature and city name. The entire project has been implemented using HTML, CSS, PHP, MYSQL and Jquery.