This was a medium scale CMS project for the Coastal Arts League of Half Moon Bay, CA. The gallery hosts an annual photographic competition - the Michael H. Kellicutt International Photo Show.

What they needed initially was an online submission form so that artists could submit their work to the show and enter the competition. The form needed to check to make sure the address was valid and that the submitted files were of the correct size and format. It also needed to calculate the contest entry fee based on the number of submissions and create a PayPal button. PayPal's Instant Payment Notification was utilized so that once payment cleared through PayPal the entry would be automatically entered into the contest database.

A short time afterward I was contacted again to build an admin backend to handle the juror voting and selection as well as managing entrants, submissions & jurors with CSV import and export functionality.

The competition this year had 527 entrants and just over 1,800 submissions. Each submission would need to be rated by at least 3 jurors.

The back end consisted of a "payments pending" table for users who opted to pay by check, a juror management section which allowed the administrator to add, delete and assign jurors to groups. There was a pool of about 14 jurors. Jurors in the same group would be assigned to the same set of images to vote on, group 1 would get the first 250 submissions, group 2 the next 250 and so on. A summary view showed how each group was progressing. Once a juror had voted on every entry in a group they became free to join the next group.

After preliminary juror voting was completed, a subset of the entire batch of entries was marked as 'promoted' and voted upon by the Final Jurors. These final jurors could rate and make selections. Selected images would appear in the show.

My final task for this project was building a section of the admin page to create the gallery. This allowed the editing of title and process for each image (through AJAX, to save some time) and the artist info. It also provided a means to mark a submission as 1st, 2nd, 3rd place or Honorable mention, "hang" which means it's hanging in the show, or "book" meaning that it appears in a display book. An artist statement and juror comments could also be attached to each entry. After all the information is entered, the gallery pages can be rendered with a few mouse clicks. Since artists can specify at the time of submission what contact information the do and do not want to appear with their work, the render script needed to account for this.

You can view the end result for yourself at the link below.

Url: http://www.coastalartsleague.com/kellicutt/2009/DisplayBook/index.html

Tags: php, mysql, applications, automation, html, css, javascript

This was a contract gig for RouteMe2 Technologies, a Silicon Valley company that specializes in developing location based service (LBS) applications for Google's Android smart phone.

My job was to digitize shuttle route maps and timetables and create sets of files conforming to the Google Transit Feed Specification. There were 95 routes in total, mostly free shuttles operating in the San Francisco, and the work was done on a milestone basis over several months.

All of the bus stops for each route needed to be Geocoded and the timetable and fare information extracted.

For the former it was a matter of reading the stops from the route maps and trying to pinpoint them on google maps. Street view came in very handy for this and many of the bus stops I could actually see, which was great for accuracy. That part of the job was a little bit like a cross between aerial reconnaissance and "Where's Waldo?". I was even able to call some of the agencies to dig for more information.

For the time-tabling, KPDF has a great feature that lets you draw a rectangle around a section of text in a PDF and extract it as plain text. which ended up being a big time saver. I wrote a few short perl scripts to take a timetable in CSV format and covert it into GTFS format. I used an OpenOffice.org spreadsheet to keep the datasets straight.

The final destination for all of this data is an application called "PedNav", developed by RouteMe2 technologies. It's a google Android application that works a little bit like a personal assistant. You tell it where you need to be for the day and at what time and it will create an itinerary for you with instructions of where to walk, and which bus to take. The application won the first round of the Google Android Developer Challenge.

Url: http://www.routeme2.com/

Tags: perl, automation, applications, parser

The brief for this project was to create a web app allowing the user to design their own letterman jacket. The user would be able to choose the body & trim style and the color of the jacket body, sleeves, snaps, trim etc. After completing the jacket, the user has the option to print their design along with style information, or email it to a customer rep for a quote. The app actually had a dual purpose, according to the CEO, who said that his staff would also be using it when interacting with clients.

I was fortunate to be working with a great graphic designer on this project who provided the basic layout, jacket designs and fabric swatches. I had the arduous task of creating nearly 1000 transparent gifs for the jacket panels. Lucky for me, Gimp made this a lot easier. In the application these transparent gifs were layered on top of each other to create the jacket.

The interface was done entirely as client side Javascript + CSS falling back gracefully to PHP on the server side for that 1% of users with Javascript turned off. No flash whatsoever! The ever-useful wz_tooltip script provides some nice color swatch detail on mouse over.

Now that know a little bit about how it was made, why not give it a try? Click the URL below.

Url: http://www.diamondspiritwear.com/index.php?page=jacket

Tags: php, javascript, applications, graphic design, web site

I built this site for a local antique dealer who specializes in chandeliers and tole lighting. She already had a design in mind for her logo, which I converted into a vector image.

The site was done entirely in PHP and MySQL. It has a few interesting features. The large images on the main page are not created by hand. Instead, they are pulled from the currently available inventory and created dynamically. The overlaid text, e.g. "Lamps... Explore>" is done on the fly with a PHP function, so when new content is added it will appear randomly on the front page.

The image links on the left hand navigation are also created dynamically. Since my client wanted to use a copperplate gothic font for the links, I chose to have the admin panel create a new image link automatically whenever a category is added or changed. This way the font will display correctly in every browser.

On the front end, the site includes e-commerce through paypal shopping cart, a mailing list, wish list and advanced search which allows filtering by price range and era.

For the back end I built a custom content management system to make changes a breeze. It tracks searches performed on the site recording the keywords, date the search was made, the price range and era (if selected) and number of results returned. For the auxiliary content, the CMS allows upload of images, and a means to insert them into the content using short hand tags.

Url: http://www.beauregardblue.com/

Tags: web sites, applications, graphic design, php, css, mysql, html

This was a logo for a distributor of animal health and nutrition products. The client already had a clear vision of what they wanted: "It needs a horse, a cow, a sheep, a hog, a dog, a cat and chicken..."

A lot of elements to combine in one logo! It was quite a challenge to pull off but the client was very pleased with the end result.

Url: http://www.TopChoiceLLC.com/

Tags: logos, graphic design