If you’re reading this post, you know that Global Integrity has a new website! Hooray for us! We thought it’d be useful to share some of the objectives of the redesign as well as the successes and challenges we had in getting it up and running.

Why a New Website?

Setting aside the reality that most websites warrant a significant refresh every few years as technologies mature and style palettes change, we had a few key reasons for embarking on a rebuild of www.globalintegrity.org:

>> It was difficult to find some of our most valuable data and reporting. Accessing our most recent national-level assessment of corruption vulnerabilities in Syria, for example, would have taken several clicks. We thought we could do better.

>> It was visually unappealing. When we made the transition to Drupal more than two years ago, we slapped together a design that was never fully thought through or refined once we went live. We felt that we could vastly simplify the user experience and make our flagship website far more beautiful and image-centric with a new approach.

>> We couldn’t highlight or emphasize certain content without fighting wireframes or templates. Our now year-round recruiting push for in-country field contributors, for example, needed a higher profile as did our blogging and writing, which historically were given short shift in our old website.

>> From a user experience perspective, we generally hated Drupal. There, we said it.

The Process

Initially, we crafted what we thought was a well-written and precise Request for Proposals and put the word out that we were looking for a web shop to help us with the rebuild. We also reached out to a few firms that had come recommended by trusted friends and colleagues, as well as firms whose work we had admired from afar.

We eventually settled on a DC-area firm with decent comps and a decent price point. This did not end well, however, as we quickly encountered major cost creep as well as a disconnect between our desire for a design-led process and the vendor’s desire to find an off-the-shelf WordPress template that met some, but not all, of our needs. We severed the relationship, licked our wounds, and started over again. This time, we abandoned a public RFP and went solely with trusted referrals. That’s how we found Akora, based in Mexico. Not only were their comps impressive and beautiful, but they came highly recommended from technology-savvy colleagues in our universe. Those endorsements weighed heavily on our decision to hire the firm. Looking back, I wish we had stuck solely with word-of-mouth referrals and abandoned the RFP process.

Design First, Template Last

Akora only works with WordPress, and we knew we were 90% inclined to go with a WordPress-driven website after our frustrations with Drupal. But we had some worries: could a template-driven platform like WordPress really give us the customization and unique look and feel we were looking for?

The answer, which I hope you agree with after touring our new website, is yes. To Akora’s great credit, never once in the many months of discovery and design did we hear, “Well, you can’t do that in WordPress” or “We can’t find a template to make that work.” Instead, it was always, “Let’s design it, draw it, and then write custom code to make it work in WordPress.” And that’s exactly what happened. We think our new website is the best of both worlds: the backend ease of use of WordPress without the stock look and feel of a standard, off-the-shelf WordPress template.

Powerful New Functionalities

In the category of custom-stuff-that-most-people-don’t-do-in-Wordpress fall the following exciting new features of our website:

>> The Discovery search tool that allows for powerful free text, no-click searching across all of our data and content. Activate Discovery, type in “Philippines,” for example, and the website automatically points you towards relevant blog posts, Global Integrity Reports, Local Integrity Initiative data, and other content touching on the search term. This is a big step forward for us in offering users a one-step process for discovering and consuming our rich reporting and data. The user interface for the Discovery tool was directly inspired by MySpace’s search bar — a single, obvious place to search vast amounts of content.

>> Dynamic, live tiles. Despite being an Apple and Android user, I’ve always loved the simplicity and elegance of Windows Phone’s approach to using live tiles as a primary user interface (this, combined with their beautiful Metro design language, has spilled over into the desktop Windows 8 operating system as well). Inspired by that, you’ll find tiles in a few key sections of our website, including our homepage and What We Do. Tiles help to push key content to the front while maintaining an image-centric approach to page layout and navigation. In What We Do, we’ve relied entirely on dynamic tiles and short entries that can be filtered by the user to explain the myriad of things that Global Integrity does. Props to Akora for integrating the nifty Isotope tile tool into our website to help make this happen, all controlled by a standard WordPress backend.

Old Data is the New Black

As we’ve blogged about elsewhere, this redesign coincided with a major data migration project that brought into Indaba, and then onto our new website via Indaba web widgets, hundreds of thousands of legacy Global Integrity Report and Local Integrity Initiative data points. This finally gives our users a consistent look and feel across nearly a decade’s worth of Global Integrity fieldwork and projects. Combined with the Discovery search tool, this really puts all of our powerful data at our users’ fingertips.

Responsive Design

Visit new.globallintegrity.org on a mobile device or a 7″ tablet and you’ll discover a custom look and feel as well as mobile-specific navigation. If the future is mobile, your flagship website had better render beautifully on mobile, and ours does. We deliberately kept the content simple — social media links, blogging, basic About Us pages, and office contact details — while pointing users to the desktop site for more robust and complex content like our data scorecards. There are four responsive templates for the new www.globalintegrity.org: 4-inch (smartphone), 7-inch (small tablet), standard desktop, and giant projection screen/TV. The desktop version also responds to the width of your screen automagically — visit the blog home page, for example, and watch additional or fewer live tiles appear at the top as you constrain or expand the size of your browser window. Check out all the responsive sites and let us know what you think! (Pro tip: on a 7″ tablet rotate the device from vertical to horizontal and watch www.globalintegrity.org/new automagically re-render itself into a completely different layout.)

Last Minute Bugs, Of Course

No website launch is complete without annoying, unexpected problems at the end. In our case, this took the form of recent browser security patches that made passing data from Indaba to our new site (via iframes) difficult. Indaba went secure (SSL) several months ago while our website was still running in an unsecured environment; when browsers like Chrome and Firefox upgraded recently, this broke hundreds of our Integrity Indicators scorecard and Reporter’s Notebook pages (on both our old and new sites). We bought an SSL certificate and went full secure on the new www.globalintegrity.org (notice the https:// in your browser address bar) but this cost us the better part of an (annoying) week to sort out (shakes fist at sky.)

Feedback: We Want It

We’re treating today’s launch as a true soft launch. You can still access the old www.globalintegrity.org by simply typing that into your browser, but within a few weeks we’ll shut off /new and roll over the default domain to our new, beautiful, responsive site running on WordPress. We really want to hear from you in the interim: what do you like, hate, or find annoying? How can we simplify or enhance key features? What did we leave out that we shouldn’t have? Visit our feedback page to help us make the new website even better.

Kudos

A heck of a lot of work went into making the new site, and the folks involved deserve plenty of credit. First and foremost the team at Akora, especially Alecs Garza, who’s been an amazing partner during the journey. Mike Reich and the team at Seabourne, and Yan Cheng at OpenConcept Systems on the Global Integrity end, for getting our legacy data into Indaba, and from there to the new website. Internally at Global Integrity we had several colleagues leading the effort including Julio Urdaneta and Hazel Feigenblatt; Lyle Turner, Monika Shepard, and Christina Crawley also put in many hours debugging the new site and helping to migrate old content.