TheGrindLive

TheGrindLive was a team project I led last semester. Our task was to develop a site for Champlain College's open-mic coffeehouse, The Grind. We were given a list of things the owner wanted the website to do. On the top of the list was the requirement to include several different types of media, including the live stream that happens every week at UStream.

Note: Due to a barrage of page hits from Russia, China, and other faraway regions, I have decided to take the live GrindLive site down rather than leave it as a target for hackers.  Due to the fact that it is custom PHP, it could be hacked and used to spread spam email, or worse, viruses.  It's not that I don't trust my programming, but if I leave it up it's only a matter of time before some bot finds a hole and exploits it.  Hey, even the Mona Lisa's falling apart.  I can make copies available on request.  

Requirements

  • Several Types of Media
  • Easy to Update
  • Integration with Social Media
  • Encourage Viewer Interaction
  • Visually Appealing
  • Use Standards-Compliant Practices

The finished product represented many hours of work. I built a completely custom content management system (CMS) with PHP and MySQL. The site was hosted on my development server for the duration of the project. I can't take credit for the design of the site (that goes to Joel Wilke), but I did end up getting my hands dirty with most of the CSS as well.

 

Finished Product

  • Incorporates media from YouTube as well as uploaded files into a single, easy to manage back-end form. Uploading is simple, with images being resized automatically via PHP's GD library. Youtube video thumbnails being pulled in without any extra effort.
  • Gives a searchable, taggable front-end media database for fans and performers.
  • Handles player sign-ups for upcoming shows.
  • Combines the UStream feed with a Twitter client, allowing those that can't make it to the show to watch and discuss the show in real-time (thanks to Bill Shibley for the Twitter client).
  • Looks great, and uses nothing but standard PHP, HTML, CSS, and a pinch of Javascript to do it.
Screenshot: