A Tour of the Redesigned Drupal.org
By now you’ve noticed that Drupal.org looks a little different! To understand why these design changes were made it may be helpful to read the redesign user experience research lead Leisa Reichelt’s post Why is it so? Some insights into our design strategy. Here’s what’s new on Drupal.org:
Last month Drupal.org had over 2 million unique visitors, many of them coming to the home page to learn about and evaluate Drupal. The home page was designed with these visitors in mind. Our UX research revealed that Drupal.org is primarily a searching site, so the home page features a large search box with optional search filters. The rest of the home page focuses on the needs of Drupal evaluators, including a section showcasing the newest and best Drupal sites.
The home page also shows stats and Drupal community activity. The world map indicates the worldwide breadth of the Drupal community’s recent code commits, updates to documentation and more. A post detailing the map implementation will be posted in the near future.
During the user research it became clear that regular users were passionate about their issue queues and how they digested information from drupal.org. But there was no consensus on what information needed to be presented. The concept of a customizable dashboard was something that was very popular on social sites and other web content management systems. The solution to the varied demand for different IA’s is a dashboard that has a default set of widgets that can be rearranged and added or removed.
The Get Started page provides a guided process to help new Drupal users be successful. A direct download is helpful for most advanced people, however many others want to evaluate Drupal first and seek help before they start. Ensuring people have the resources they need will help with successful evaluations and increase adoption.
The Community & Support section helps to categorize community resources more effectively. The tabs provide access to different methods of engaging with the community online, as well as find a local Drupal user group. The large search documentation block allows people to find the documentation team’s curated content. The recent activity block shows how active the community is, an important evaluation criteria.
Community Spotlight
The strongest asset of the Drupal project is the community. The Drupal community values its users and critics, but we celebrate the contributors. The user research suggested that it was critical to feature members of the community on the new site, which is done in the Community Spotlight.
Groups and Meetups
Connecting groups.drupal.org site to the main drupal.org site through the information architecture, single sign-on, and search results is important to unifying the user experience. Getting people from the drupal.org site to join a common interest group and ultimately attend an event organized through the local groups where people can meet other Drupalers in person is key to growing the Drupal community.
Documentation Search
With thousands of useful handbook pages and helpful comments, the challenge for people wasn’t whether the information they wanted existed, but was whether they could find it. A dedicated documentation search block helps users find the curated information they need. We have plans to include this search block on the Documentation page soon.
Logging In
Drupal.org has grown organically to almost 20 different sites including Drupalcon sites. A dedicated single sign-on solution (called Bakery because it makes web browser cookies!) was deployed to allow seamless integration between these sites. The Groups, Association, Localize, Drupalcon San Francisco, Copenhagen and Chicago sites, and API sites are all using this single sign solution.
The key observation from the user experience research was that Drupal is not a browsing site, but a searching site. We needed a fast, scalable document search system that allowed for faceted search of different types of content to be presented.
Faceted Search
The redesign team created search facets to be displayed as filters in pages and blocks in the Apache Solr module. These improvements allowed for faceted search results in blocks in our Download & Extend landing pages as well the search results page.
Multi-site Search
Drupal.org sites have rich and valuable content, for example, the curated Drupalcon videos and working groups. Unifying that content into a single set of search results helps users discover what the community has to offer.
Download & Extend landing pages allow users to quickly discover the ways they can extend their Drupal website. Some of the individual blocks of extensions are delivered with Solr searches instead of Views so that we can quickly search (and crucially sort) across very large data sets with diverse fields spanning many database tables (such as the usage statistics, release activity, and so on). Doing these queries directly in SQL via Views would be extremely expensive. Instead of denormalizing the data into another SQL table, we can put everything we might want to filter or sort projects on into the Solr index, and then the queries are all equivalently fast.
Download & Extend landing pages for project types
Each project type has its own landing page, including specific blocks depending on the project type.
Faceted search on Download & Extend pages
Each type of project can have different search criteria. Modules can be searched by categories, and in the future themes will be searchable by theme-specific attributes (e.g. mobile vs. desktop, fixed vs. fluid width, etc).
A new page we added is the Modules categories page, which lists the top 5 most installed modules from every module category on the site. This not only provides a good overview of all the different kinds of modules available for Drupal, it helps people find the most used modules at a glance. Each category links to a faceted search for further exploration.
Project home page improvements have been deployed throughout the redesign process. For example, the blocks in the sidebar (“Maintainers for X”, “Recent Issues” and the “Issues for X” summary) were deployed in 2009. However, when the redesign went live we added a new “Project information” block with the following features:
- Makes the “Maintenance status” field visible so users can get an idea of how actively maintained a project is.
- Displays if a project has automated tests.
- Displays the current number of sites that report using the project (in the future, we’ll include a ranking here, as well).
In the future, the Project home pages will see even more improvements, including visual displays of automated quality metrics, and ratings and reviews.
Where’s the Druplicon?
The Druplicon is our beloved mascot. It appears on the front page, the Community & Support page, as the favicon, and will eventually have its own dedicated section as it appears in this Druplicon section prototype. To learn more about the Drupal project’s mascot, wordmark, and trademark read we need the fish.
How to Improve Drupal.org?
The redesign is not just a redesign of a series of websites, but the creation of a platform to allow the developers, designers, themers, and content contributors in the Drupal community to improve their home. If you’ve identified a problem with the current drupal.org implementation, check the redesign issue queue and make sure we know about it. If you’d like to help, you can learn how to work on the new Drupal.org.
Redesign Acknowledgments
The effort to redesign drupal.org began in August, 2005 at the OSCON Drupal meet-up. Drupal.org needed a great design and we set out to create the Drupal association and raise money for 2 years to hire a design firm. In late 2007, the Drupal association kicked off the design firm hiring process. At Drupalcon Boston in March 2008, the association committed that redesigning Drupal.org was it's number one priority. By late 2008 the community kicked off a series of six in person sprints to implement the redesign. By Fall 2009 we moved from in person sprints to an online collaborative implementation process by recruiting volunteers from the community. At Drupalcon San Francisco in 2010, the Drupal association acknowledged the depth and complexity of the implementation effort and committed to hire a team to remove some of the technical hurdles that prevented the community from completing the redesign. The association redesign implementation team lead by volunteers and in collaboration with the community volunteers led the redesign to this phase one completion.
A partial list of the people and organizations involved in the redesign effort are listed on the redesign acknowledgment wiki page.
Front page news: Planet Drupal