Thinkyhead's Site Portfolio

Educational Video Center

Educational Video Center teaches young people to use the tools of media production to tell stories. Students use their skills to produce documentary videos that are available for purchase.

This was my first experience building a site with the Drupal CMS, under contract for Knectar Design. The visual Design was produced by RockPaperPixel, and my job was to implement the various pieces that make the site work, including a few Modules, the Theme, and other custom elements.

Let me point out one cool part. Drupal uses a Javascript library called "JQuery" that makes it very easy to do dynamic content. The Video selector on the right side of the home page is built from two separate Drupal Views, with one designed to manipulate the other. Given more time it would have been easy to implement cross-fading or other fancy effects, but I restrained myself! Before JQuery it was voodoo to build such things, especially with so many cross-browser issues. Thanks to Drupal and JQuery, this only took about an hour to build.

Alchemist Lounge

Alchemist Lounge is a restaurant conceived and executed by the genius restaurateurs Lyndon Fuller and Relena Erskine. For most of the past decade Lyndon and Relena have been honing their service skills in the trenches of restaurant service, saving their pennies and waiting for the right time to take their first bold step into restaurant ownership. After years of blood, sweat, and tears - not to mention a few precipitous moments - Alchemist Restaurant and Lounge opened in 2006 to rave reviews.

The restaurant's interior is high-quality and high-ceiling'ed, Relena's misty black and white photographs are framed by walls of deep orange and brick. Sights, sounds, seats, tables, and more are provided courtesy of the kismet of Craig's List. Somehow the basic style of the interior led me to try an unusual color scheme: Black and White on Red-Orange. Just finding other colors that fit with red-orange has been the strongest design challenge of this site.

The "Circle-A" logo was conceived by Lyndon and Relena, produced by Keith Clark Design, and given to me to build a website around. I chose to use Flash for its idea-generating power, and the results have been very rewarding.

Alchemist Flash Posters

My favorite part of working on Alchemist Lounge is making posters for their special events. These give me a chance to have a little fun and make funny music loops in GarageBand. Some of them are admittedly pretty bad, but Flash is like that! Here are a few of the less egregious examples:

Thinkyhead

Thinkyhead was originally built in a very minimal style without any kind of framework, just using PHP as a glorified template system. For this reason it was a little tedious to add new content, and it didn't have all the bells and whistles we've come to expect in today's socially-interconnected Web 2.0 world. When it came time to update the site and give it a more modern foundation, I didn't have to give it a second thought. Drupal was the only way to go.

The Thinkyhead site remains pretty simple, but makes full use of the powers of Drupal for content management, syndication, caching, breadcrumbs, indexing, sitemaps, keywords, event logging, analytics, and much more. In terms of design, I expanded the layout and enlarged the font to accommodate today's higher resolution displays, added a nifty breadcrumb region to the page, and simplified the templates by using a table-free CSS layout.

The site has become my main staging ground for Drupal modules in development and for exploring new ideas and technologies. While not nearly as media-centric as EVC, the site hosts a little audio and will soon be featuring video demos of my Mac and iPhone software. At the moment the pages are kind of homogenous, but I'll soon be playing with the interior page layouts to add some variety.

UMass Amherst Gateway

In my capacity as a developer for Gravity Switch I had the opportunity to be the sole programmer on UMass Amherst's overhaul of their main gateway site and their News and Feature Story pages. The design was done in-house by Hal Marshall, and my first task was to adapt the code produced by Dreamweaver to create standardized HXTML / CSS templates that are used throughout the site.

The code behind the site is all custom PHP, using CodeIgniter and a couple of custom CMS's. The back-end connects to MySQL and Oracle databases to produce the timely content that appears on the front page and the large archive of News, Events, and Features. I was responsible for adapting their existing CodeIgniter News system to produce the Feature Stories that appear in different parts of the site.

The slideshow at the top of the page is based on Slideshow Pro, which uses a couple of XML files as input to customize both the appearance and content. The images and XML that drive the slideshow are generated by the CodeIgniter Feature Story back-end. (It's always fun to write code that generates other code - in this case XML -especially when it produces such nice graphical results.) Different sections of the site have different slideshows depending on where each Feature Story is set to appear.

As UMass Amherst prepares to update their site over the next year or so - this time with Drupal - I look forward to having the opportunity to work with them again!