International flags lined up outside the United Nations

Foreign Affairs

Modernizing The Most Influential Source in The World on Foreign Policy

When the most influential resource on foreign policy wants to modernize its presence on the Web, how do you make sense of such an epic proposition?

Simple. You build on six years of experience with their existing content strategy and architecture to help them create a new site that incorporates a mobile-first design that helps bring over 90 years of content to life. Such was the case for Foreign Affairs.

Since its inception in 1922, articles and essays published in Foreign Affairs have helped shape political debate and policy on some of the most important issues of the day. Authors who have written for the journal have included influential intellectuals and political leaders ranging from W.E.B. DuBois to Henry Kissinger to Hillary Clinton.

Palantir had built the previous version of foreignaffairs.com in Drupal 6, and had a very good understanding of the publication’s content modeling and editorial workflows. However, make no mistake; this project was huge and there were plenty of challenges to address as part of the redesign implementation and migration to Drupal 7.

The first was translating over 150 static page design comps into a sustainable design system that would work across a wide variety of mobile and desktop viewports. To do this, we created living style guides in the browser for individual elements and most full pages that articulated the site’s behavior on smartphones, tablets, and desktops.

Foreign Affairs Style Grid System

We used Drupal’s Panels module in compelling ways for Foreign Affairs that made the composition of the design elements on site templates entirely comprehensible by anyone on the project. The end result was not only strong yet flexible for our client, it also produced Drupal markup that was semantic and accessible.

By establishing patterns that could be used for future editions, we created page management tools that would create a sustainable environment for our client both now and in the future.

One new feature of the site is a visual timeline that enables visitors to find content based on when it was published in Foreign Affairs. This feature is further enhanced by filtering for an area of the world or topic of interest. While the interface appears seamless to the end user, the backend of this feature involves sophisticated integration with the site’s functionality. This feature helps Foreign Affairs leverage one of its most significant assets: a wealth of content from the journal’s 92-year history.

Search results timeline graph

Foreign Affairs provides access to its online content via a metered paywall, which enables anonymous visitors to read some, but not all, content until they subscribe. Registered users can view additional content, and paying subscribers have access to all content. The site also supports site licenses and provides additional access to privileged users. Integration with the site’s ad network ensures not only that the correct number of ads from each advertiser render on each page, but also supports the ability for content to be sponsored by a specific advertiser. Ads appear in their correct context, regardless of whether they appear on desktop, tablet, or mobile browsers as well. Foreign Affairs is able to then view and track relevant metrics via integrated analytics tools, such as Omniture.

As part of this process, we identified a number of performance bottlenecks related to two modules. To solve this, we intelligently cached those modules, eliminating hundreds of thousands of unnecessary function calls and shaving hundreds of milliseconds from every page request. The patches that were written to resolve these issues were then contributed back to the Drupal community and integrated into the release versions of the modules in question. Being part of an open source community like Drupal is a point of pride forForeign Affairs, as it leads to a better product not just for their internal team, but for everyone to use.

Palantir worked side-by-side with Foreign Affairs' in-house team throughout the project to define user stories and acceptance criteria, share tasks, and to help establish a development workflow that theForeign Affairs team could adopt and continue to use even after launch. This created an environment of mutual respect and trust that was essential to the ultimate success of the project, and enabledForeign Affairs to take full ownership of its site generating new content, implementing new features, and performing ongoing maintenance.

Foreign Affair's site displayed on various devices to showcase the responsive design

"Without Palantir’s expertise, the project would have been lost at sea," said Anique Halliday, Foreign Affairs’ Digital Producer, stressing that organizations who adopted Palantir’s process would be better for it. By focusing on the project’s business goals and a mutually-agreed upon definition of success, Palantir built trust with the Foreign Affairs team, working together toward a common goal.

The results are not only represented with a visually-compelling site that’s a joy for Foreign Affairs’ visitors to use, it provides Foreign Affairs’ a number of options to deliver its rich content, monetize it, and gives the client content and development team a sustainable method to maintain and extend the site in the future.

Image Attribution: "United Nations Office at Geneva" by Falcon Photography (falcon_33) under Creative Commons.