Each year, Amnesty International releases a comprehensive report on the state of the world's human rights. Amnesty International decided on Drupal as their website platform for the 2009 report based on the successful redesign of their main site with Drupal in 2007. Like their main site, the Amnesty International Report (AIR) site needed to handle lots of traffic, be manageable by large teams of editors, deliver rich media in a multitude of formats, be completely multilingual, and be fully standards-compliant and accessible.

New Challenges

For the 2009 report, they added two additional languages (Portuguese and Russian) bringing the total to six, and wanted a mobile-optimized version for iPhones, Blackberries, and Android phones. As part of their new forward-thinking initiative, Amnesty International looks to reach the mobile Internet market, which is rapidly growing in most of the world and will soon overtake the desktop Internet market. To start, we needed to import the massive amounts of report content -- over 300 pages per language -- from Quark and Adobe InDesign files. Thanks to some XML manipulation and a lot of patience, we were able to batch import much of the content, which saved Amnesty International hours of editorial time and cost.

Theming Worldwide

Theming for six different languages proved challenging yet familiar, thanks to the experience we gained developing for www.amnesty.org. Most web developers never have to experience implementing a design in Arabic, which not only is right-to-left, but has its own set of per-browser, per-platform quirks. With a little elbow grease, a great QA team, and the ultimate cross-browser testing platform, the site looks stellar in English, Spanish, French, Portuguese, Arabic, and Russian, on all browsers and platforms. For the home page, the client asked us to implement a scrolling "ticker" to cycle through a series of article links fed by an RSS feed. To accomplish this, we built a custom module that utilized Drupal's core Aggregator module, and animated it using the existing jCarousel module. The new RSS Carousel module creates blocks from RSS feeds, which can be inserted into page regions or panels like any other block, a very handy way of displaying a constantly updating source of information. We plan to contribute this module as soon as it's ready for public consumption.

Amnesty International Goes Mobile

For the mobile version, http://air09.amnesty.org, we created a second theme optimized for phones, and used a special set of configuration options to enable the theme and change the homepage layout. There were other challenges with the user interface on mobile devices, such as how to deal with the lengthy report country articles. To improve the user experience on these articles we enabled the Paging module, which splits the long reports into mobile-friendly "pages" and allows users to navigate from one to the next. Most traffic to the site is expected to come from search engines or URLs in ad campaigns featuring the main site URL, so we needed to detect mobile browsers and redirect them from the regular site to the mobile-optimized version. We were able to seamlessly redirect to the mobile site using Apache User Agent detection and redirection. One challenge with the mobile version was finding an easy, intuitive way for mobile users to navigate the long list of country reports. A drop-down list was out of the question, as they are all but unmanageable on mobile browsers. We considered using an auto-complete text field, but the default Drupal auto-complete fields show the results in a drop-down, the exact problem we were trying to avoid! Our solution involved developing a custom module that displays the results in-line in the text field, similar to the auto-complete in the browser's location bar. This unique and easy-to-use interface enhancement makes the site much easier to use for mobile browsers.

We Have Liftoff!

The site went live on midnight on Thursday, May 28th, and had over 12,000 unique visitors and 60,000 visits in its first few days. Thanks to a lot of rigorous load testing, cross-browser and cross-platform QA, and plenty of preparation, the launch performed without a hitch and the site has been cruising ever since. The CivicActions team featured Marco Barulli as Project Manager, Henry Poole as Engagement Manager, Robin Barre and Nat Catchpole as Tech Leads, Sumit Kataria as QA Engineer, and Sam Lerner as Lead Engineer, Multi-Themer, Voodoo-Disposer, and general "get 'er done" guy. Thanks to everyone at Amnesty International for their tireless work and support, including Michael Chik, Dominic Kendrick, Daryl Manning, Kris Gil, and Owen Pringle.