The TurnKey Linux Virtual Appliance Library - Powered by Drupal
The TurnKey Linux Virtual Appliance Library is an open source project developing a free virtual appliance library that pre-integrates the very best server-oriented open source software. TurnKey Linux appliances are simple, ready-to-use servers that are designed to "just work" and can be deployed in minutes on a virtual machine, bare metal or in the cloud.
The purpose of this case study is to discuss our experience using Drupal to implement TurnKey's web site.
In case you're not familiar with the project, TurnKey is all about making it super simple to deploy open source based solutions (up to 40 so far). For example, need a file server or domain controller? An email server (e.g., Zimbra), web development framework (e.g., LAMP, Rails, Tomcat), or issue tracking system (e.g., Redmine)? And let's not forget TurnKey Drupal, which we pre-integrate with MySQL, phpMyAdmin, Postfix and a collection of popular modules.
From the beginning it was clear that a big part of the challenge in building a successful new open source project would be developing the right web site to nurture the community and showcase the appliances.
When TurnKey met Drupal
To make things more difficult we started out two years ago without any experience with content management systems and were initially overwhelmed by the many options available. Fortunately we found Drupal and as we explored deeper it quickly became clear that it would be the superior choice for the project's needs.
At first it was a bit confusing because Drupal is more of a framework for developing highly customized web sites than a one-size-fits-all content management system. As can be expected from such a powerful and flexible beast, it can take time to master Drupal, but the investment is well worth it. Drupal, along with its incredibly rich ecosystem of contrib modules gave us the leverage to incrementally develop exactly the web site we wanted without having to develop any custom code.
Web site features
-
Visually attractive, clean Ubuntu'ish theme
TurnKey is based on Ubuntu. We decided to communicate the project's heritage in its look and feel by using a Drupal 5 community theme released by Ubuntu's sponsor. We ported the theme to Drupal 6, cleaned up the cruft and gradually customized it for our needs.
We began by paying special attention to foundations of good web site design such as typography (I.e., font types, sizes and use of whitespace) to maximize readability. We also payed attention to small details such as adjusting the color pallet the theme used to improve visibility amongst color-blind visitors.
-
Optimized front page
The original front page design was was inherited from Ubuntu and focused on explaining the project with the appliances themselves on a separate URL one link deeper. We noticed many people who wrote about the project tended to bypass our front page and link to the appliances page directly, which sort of made sense since they had already explained what the project was about.
We took the hint and redesigned the front page so that it would not only explain what the project was all about but also allow users to find and get to the appliance pages they wanted in the minimum number of clicks.
The main design challenge we had to solve here was how to fit all of that information into a reasonable amount of screen real-estate in a way that didn't look too noisy and would cater to different types of audiences (e.g., newcomers vs those who were already familiar with the project).
-
Virtual appliance directory
Tagging: each appliance node is tagged with a list of categories, which serve a descriptive and navigational purpose. Tagging makes it easy for users to understand at a glance what an appliance is about and also browse related appliances by category.
For example the Zimbra appliance is tagged under email, messaging and specials.
Updates: each appliance has a list of associated update nodes which serve as its changelog. (e.g., LAMP stack updates)
-
Screenshots
Screenshots organized by tabbed category make it easy for users to browse through hundreds of screenshots to discover applications they might want to try out.
- Community help resources
Includes a discussion forum, wiki-like community documentation (with revisioning), polls and links to off-site resources (e.g., Launchpad bug tracker).
- Blog: so far used mostly for project news and announcements.
- RSS feeds for everything
- blog posts by category of interest (e.g., just news and announcements),
- updates for all appliances or just a specific appliance
- forum discussion
- Short and sweet URL structure
- Example category URL: http://www.turnkeylinux.org/web-development
- Example appliance URLs: http://www.turnkeylinux.org/fileserver http://www.turnkeylinux.org/updates/fileserver http://www.turnkeylinux.org/updates/fileserver/feed
There's a module for that...
We gradually integrated several dozen modules into the fabric of the site. Initially we weren't sure we would find everything we needed. One of the frequently heard criticism's of Drupal is that for anything "serious" you need to develop your own custom modules. But our experience has been quite the contrary. Usually as soon as we could clearly think of the need for a certain type of module, we would be delighted to discover that it already exists, as if it had popped into existence by wishing for it. Yes, "there's a module for that..."!
Behind the curtain what feels like magic is really a rich and diverse ecosystem of savvy web developers who are eager to give back and share their own third-party contributions. In this sense Drupal is a shining example of the advantages of open source collaboration.
The hardest part was exploring what was already available and choosing amongst competing modules. With so many modules to choose that on its own can take considerable effort. On the other hand it's still easier than reinventing the wheel developing new code and bearing the full costs of testing and maintaining it - because you're its only user.
Foundational modules
Modules that implemented the site's basic foundations:
- Views: By now it's almost cliche to say it but Views is one of the most powerful tools in the Drupal arsenal. Learning how to get the most out of it can take some effort, but it's worth every second. Endlessly flexible and powerful, Views is the driving force behind most of our site's content presentation, including the blog, polls, appliance categories (example), appliance updates (example), per-category front page appliance grid, per category screenshots and even the feed of recent comments that drives TurnKey's twitter account.
- CCK and sub-modules: used to create custom content types for appliances, appliance updates and screenshots.
- Node reference: used to associate appliance updates to appliances, screenshots to appliances and vice versa.
- Panels: used mainly on the front page to seamlessly stitch together a diverse collection of nodes, blocks, views and random HTML snippets. Very powerful module which we'll probably use more of in the future.
- Imagefield: used to store appliance icons and screenshots.
- Imagecache: used to automatically scale down screenshots in grid displays.
- Quicktabs: used heavily on the front page, this is an easy to use yet powerful module for creating tabbed content using nodes, blocks and views as building blocks. Note that tabbed content doesn't have to necessarily look like tabbed content, you can style it any way you like.
- Pathauto: generate custom url aliases for different content types. So instead of http://www.turnkeylinux.org/node/630 we get http://www.turnkeylinux.org/zimbra . This happens automatically and can save a lot of manual labor.
Community experience modules
Modules we used to improve the site's community experience:
- Email Registration: allows users to register and login with their email instead of username. We believe this improves usability as users don't have to remember yet another username on yet another site.
- OpenID: having to remember yet another pair of account credentials can be a drag so we turned on Drupal 6's built-in OpenID support and restyled the login page to emphasize OpenID login was an option.
- Terms of Use: asks users to accept the Ubuntu Code of Conduct on registration.
User profiles
- Profile (core module): used to implement simple user profiles (example)
- RealName: uses configurable user profile fields to build a real name for user which will be used instead of username.
- One page profile: used to put all the user profile fields on a single page.
- Gravatar: adds a universal profile picture to community comments and forum posts. If a gravatar is not available, we've configured gravatar to return a cute automatically generated wavatar. We believe gravatar adds a personal touch to the site that enhances the sense of community.
- User Points: used to implement "Karma", which is a way to track and recognize community activity. Registered users get Karma for posting, voting, commenting, etc.
Community content
- Book (core module): for community edited documentation organized in a hierarchy.
- Forum (core module): implements threaded forum discussions. We decided to only have two forums (support, general) to prevent splitting up of the community into too many fragments.
- diff: add wiki-like revisions to forum posts and community documentation. Gives users the confidence to be bold and make changes, knowing they can't permanently destroy anything on the site. Also discourages vandalism.
- FCKeditor: a powerful WYSIWYG editing module we found to be more powerful than the competing, more generic WYSIWYG module. We believe WYSIWYG editing can help encourage community participation as casual users are not forced to use HTML to post to the forum or edit community documentation.
- Subscriptions: notifies users when comments are posted to forum threads they've participated in. Also makes it easier for site administrators to monitor community activity on forums, documentation, etc.
- AddToAny: enables a Javascript social sharing and bookmarking widget that supports all the major social bookmarking and sharing sites. Integrates nicely with Google Analytics.
- Mollom: an excellent spam protection service which saved our site's community sections from collapsing under the ever increasing weight of spam.
When we launched the site we decided we wouldn't add any unnecessary complexity until it was actually needed. In the first few months there was no spam - and it was good. Then spammers discovered our site and we had to turned on comment moderation. At first it was just a trickle, but it gradually built up into a raging torrent.
We found ourselves spending more and more of our time in the comment moderation queue. This delayed real comments from showing up on the site.
Then we discovered Mollom which blocks spam so effectively we've been able to turn comment moderation back off. I don't even remember what the comment moderation queue looks like any more.
Modules deserving honorable mention
- Feedburner: used to redirect some feeds (e.g., blog posts) into Feedburner, which provides some nice statistics, support for email updates and lightens the load on our web server.
- Better formats: used to set input format by role and content type. This allows us to use filtered input formats for forum posts and full HTML for blog posts.
- IMCE: an excellent image uploader and browser which supports image resizing and integrates nicely with FCKeditor.
- Menu per role: used to clean up the navigation menu for non-administrators
- Weight: used to provide editorial control over order of appliances and screenshots.
- Taxonomy menu: used to implement a secondary navigation menu of appliance categories.
- Google Analytics
Drupal version: Drupal 6.x