LRR.org Version 5

This month I completed a major software development and web design milestone: launching a completely re-designed and re-built web site for Labrador Retriever Rescue. I’ve been the webmaster for LRR for around eight years, and this is my fourth major revision for the site, both from a design and software standpoint. This revision took about a year to achieve, and I’m thrilled with the end result.

I had a several high-level goals in mind during the process.

• Make the site more attractive and modern looking
• Organize the content better and make navigation easier and more intuitive for visitors
• Make the page URLs more user-friendly (for example: http://lrr.org/reading-room/why-adopt)
• Create a simple but powerful administrative back-end to allow volunteers to easily add and update content on the site
• Develop the software to be easily extendable with new features in the future

Many of the goals were meant to address shortcomings of the fourth generation of the web site, which was live from early 2007 until early 2010. Version 4 was developed as a custom wiki application in PHP. I decided to develop Version 5 with Ruby on Rails in order to put some structure around the code for future extensibility, abstract out database record management, and to stretch myself to learn new programming techniques.

While the publicly viewable web site is what most people see, the more interesting code lies in the administrative interface that only Volunteers see. Some of the many “behind the scenes” features are:

• Role-based user accounts allowing specific volunteers to edit pages, dogs, users, etc.
• An AJAX group calendar for volunteers and foster homes to record their availability
• A multi-faceted interface for tracking dogs, including their photos, status, foster home journals, stories from adopters, etc.
• An interface for adding and editing web pages using the Markdown language
• Simple interface for adding news updates to the home page
• Interactive image uploader with feedback, and JavaScript image cropping functionality

The experience was very challenging at times, both from a programming and visual design standpoint, and there’s still much left to be done now that the site is launched. I plan to extract a few learning experiences from the project for future blog posts. Until then, enjoy a trip “back in time” via a look at some older LRR.org iterations. Notes: Versions 1 and 2 were created before I became a volunteer and started managing the web site; the Version 2 picture is missing its navigation menu images; many thanks to The Internet Archive’s WaybackMachine.