Stephen DeMarsh and I just launched a new website for Change for the Environment, a cool new environmental charity aiming to raise some funds for tree planting. So far they have a bunch of retail partners in Toronto, Trenton and Belleville who have either agreed to host dropoff spots or have worked directly with CFTE on this worthy project.
My part of building the site was to create xhtml/css markup matching Stephen’s designs, build an interactive map to plot the various donation locations and integrate a WordPress blog into the core of the site. I used the the Google Maps API to build an entirely JavaScript map application and location database, complete with pagination, IP-based geolocation, search geocoding and distance sorting.
Since we were using the excellent Mootools JavaScript framework anyway, we decided to jazz up some of the less interactive parts of the website with some subtle Mootools CSS effects. Translucent word bubbles follow your mouse on the what can a loonie do page, the partners area dynamically describes each partner’s involvement and answers to questions slide in and out of view in the FAQs section.
As much as the nerd in me loves Mootools’ clean, class-oriented design patterns, I have recently started reaching for jQuery before all other js toolkits. Its popularity, terse syntax and extensive plugin offerings make it a clear winner in my books. It already does exactly whatever you need to do, and adopts the convention over configuration approach to development. I’m thinking that this will likely be my last Mootools project! *sniff!*
As always, it was great to work with Stephen DeMarsh whose unique illustration style has found a nice harmony with his clean, minimalist website design. Best of luck to Greg White and the rest of the team at Change for the Environment, my wish is that your donations list grows long enough to break the JS map application I built you 
What can a loonie do? page, featuring illustrations by DeMarsh
