HiFi is an Audio/Visual radio powered by SoundCloud and Tumblr. You can visit HiFi online here.
You can checkout the code for the project here.
It allows the user to play sounds from a series of popular genres, as well as from their own sound library, or their favorite sounds. Plug HiFi into some speakers and a projector at a venue or at your next party and let the tunes and imagery unfold.
The design is minimal, with the main interface consisting of a series of buttons for sound selection, and then a viewfinder that becomes present once the images and sound are loaded. Additionally, I have added keyboard shortcuts so that the app can be controlled while it is in Full-Screen mode:
The user can connect to SoundCloud so that sounds from the user’s library can be used. It is also possible to continue without connecting SoundCloud, but you will only be able to select sounds from the genres in that case. As a prototype, I kept it to a basic one page app, and leveraged jQuery for hiding and showing elements during the connection flow.
Originally, I wrote much of the logic on the front-end using Javascript to query the Tumblr API to retrieve images and embed them into the page, but this approach had its limits. The load-time was significant, and only a minimal amount of images could be realistically collected during each request. I decided to migrate the logic to the backend which has been built on Python and Django. I wrote a script that gathers the images, and saves them to the application's database, and set up a cron job to run this logic once a day so that the latest gifs from Tumblr are collected daily. Finally, the front-end now randomly selects images from the database to embed in the page. This enables the app to continue to become more interesting over time, as the variety of images continues to grow as time goes on.
There are a number of ways the project could be further developed, but I believe this prototype creates an interesting experience, and demonstrates the potential for further compelling combinations of online sound and visual media.