CoolFords.com is a community and media site centered around Ford automobiles and the Ford enthusiasts who drive them. Website visitors are encouraged to log in and create a unique Ride page for their Ford automobiles and then to upload & assign photos and videos to their Ride page for all to see and talk about. Rides are categorized by Ford models so that viewers interested in a particular automobile can search the database for specific results. The goal of the site is to become “The Premier Website For Ford Enthusiasts” and to create an all encompassing website that is more than just a forum site.
The site was conceived by my passion for being a Ford enthusiast. I was aware of several competing Ford enthusiast websites that share information about the Ford brand or specific Ford vehicles but I believed that many of these sites are still stuck in the nineties and there was room for competition. Some sites are just forums, and most are just static html. There are a couple of sites that offer great information and articles, but absolutely no user interactivity, built for one and done searchers and not for building relationships. A large portion also seem to be stuck in the realm of older vBulletin configurations. The goal for CoolFords.com was to build a site to match the passion of the demographic while harnessing the power of Drupal.
This was a very unique project because of the duration of the build. CoolFords.com is a hobby project that had to be pieced together over several years because of financial reasons and what was originally started in Drupal 4.7, evolved through Drupal 5 and now is currently running on Drupal 6. My knowledge for php is limited so I had to hire several Drupal freelancers over the years which created a major challenge by itself. As some coders took short cuts others made things more complex then it needed to be. Fortunately I found a freelance coder named Petr Vacha who was able to see my vision and take more of a lead role throughout the development and create what you see today, he also help me put together this case study.
Popular Site Features:
Photos & Video – Ford owners love to show off photos & videos of their rides. To many hardcore enthusiasts their automotible is like a member of the family. So an easy way to upload and share media was a must for the site. We are using Image FUpload module to allow users to upload up to 100 photos at once. For user's albums we are using Taxonomy terms with custom module which limits users to post only to their albums.
My Garage – When a user is logged in, this area of the website ties everything together. It is the central place where a user can navigate and see site activity from their friends, it's similar to the “NewsFeed” section on Facebook.
Social plugins – To generate interaction and utilize tools from popular social websites, the “Like” and “Tweet” buttons were incoporated on nearly all node pages. With almost 20,000 photos and 100+ videos on the site a fair amount of traffic is generated from simply using Social Plugins.
Ride Search – With a steady database of user submitted Ford vehicles an extensive vehicle search by model and variation of the model was created. There is also an advanced ride search available to search rides with specific modification and part installed, the advanced search also includes brand of part installed and general location of the rides.
Ride Challenges – Ford owners are an especially competitive bunch, once a user adds their ride to the website they can duke-it-out for bragging rights by challenging another users ride to a heads-up competition. Once a challenge is posed and then accepted by the opponent a challenge lasts for 5 days and the ride with the most votes/points at the end of the challenge is crowned the winner.
Gallery, Events, … homepages
The site uses a custom module which calls Views to generate output. We couldn't use simple Views Page as we needed to combine different sorting with different filters based on user's choice which Views itself didn't allow us to do. (Example: Photo page where user can browse by: Most Recent, Most Viewed, Top Rated, Most Discussed and Top Favorites)
Theme:
We made a custom theme based on the Blueprint Module. Making it with different parts was challenging in two ways.
1. Design changed during development, many times it happened that some parts needed to re-done from original plan.
2. Some design requests were not as compatible with the way Drupal works. Quick example is node links, where we combined standard node links with other elements like Fivestar voting widget and moved other elements like ‘Add to favorites’ or ‘Add to any’ widget to different place.
Drupal's amazingly flexible template system with preprocess functions allowed us to make such changes, but the question was if it was worth the time.
Video Encoding – Heywatch:
1. User uploads video to CoolFords.com
2. Media Mover module saves original video file on Amazon S3
3. Media Mover Custom Command (module we contributed on drupal.org) sends request to Heywatch.com to convert uploaded video to flv
4. When Heywatch.com converts video it pings our website with encoded video id
5. We then download thumbnail and save it to the video node
Spam:
ReCaptcha Module was installed to combat automatic user account creations. For the spammers that manual create accounts, they frequently post spam links on their profile ‘about’ fields, so we made it that you have to be logged in to view the Details section of user profiles. Spammers then found a way to abuse the private message feature and a limiter was set so users can only send 3 messages within a 30minute time frame. The Mollom Module was also installed to filter the forum from spammer attacks.
Speed:
The website servers up many photos and videos and website speed is of importance. To provide better speed for downloading photos and videos we are using Cloudfront module to save files from different Imagecache's presets to Amazon S3. We are using Linode with installed Mercury for hosting.
To lower number of requests during page loading we are using Drupal built-in feature to aggregate CSS and JS files and also we put together many background images used in theme into a sprite image.
To optimize speed for authenticated users we wanted to use the potential of the Views built-in cache, but at the same time we wanted to have our updated content visible. So on some Views we are using 6 weeks cache, and if created module we are checking if related content is added / changed and then we erase specific cache for those Views, so user doesn't need to wait till views cache will expire by the set time.
Lessons Learned:
We learned a lot by mistakes and trial & error.
Many hours were wasted by re-doing things in theme after unexpected design/features changes/bad coding. So it is useful to make a good list of expected features and prepare wireframes before development starts and don't allow too many big changes after development starts.
Also as mentioned in the theme section, some theme changes are too time consuming, so it should really be considered if it is really worth the time to go for it.
Conclusion:
Drupal is an awesome tool. The hook system together with template engine allows you to build all kinds of feature rich websites. I also want to thank the guys at Nextide, Inc. for their help with the Ride Challenges & Ride of the Month sections. We hope your enjoyed reading this case study, please visit the website at www.CoolFords.com to see it in action.
| Comment | File | Size | Author |
|---|---|---|---|
| ridechallenge1.png | 131.85 KB | jgavin | |
| ridesearch1.png | 100.68 KB | jgavin | |
| homepage1.png | 143.9 KB | jgavin |
Comments
Comment #1
laura s commentedThanks for posting this. However, you should post this at http://drupal.org/forum/25 -- see also http://drupal.org/node/281920 about process for getting case studies promoted on drupal.org.
Comment #2
tvn commented