The School of Public and International Affairs building
SPIA logo

Princeton University School of Public and International Affairs

Redesigning a Drupal website and enabling change

We created a new user experience strategy for Princeton’s School of Public and International Affairs (SPIA) and redesigned its digital identity to highlight both the international reach of the school and the pragmatic nature of its curriculum and programs.

Image
Screenshots of Princeton School of Public and International Affairs website

In late June 2020, the School announced that it would be changing its name to Princeton School of Public Affairs. This highly public turn of events meant that the new website would need to launch several weeks ahead of schedule. Ultimately, our team was able to complete the project within the reduced timeframe, and the new website went live in early July 2020.

Icons for Princeton School of Public and International Affairs

Background

The Princeton School of Public and International Affairs (SPIA) is a renowned institution for graduate and undergraduate studies. It boasts not just a prestigious name, but also an impressive list of alumni, faculty and guest speakers who attract a highly ambitious student body. 

The school’s community comprises a global network of students, faculty, and alumni across a broad range of disciplines. What brings them together at Princeton is their shared dedication to using their domain-specific knowledge and research for the public good. The SPIA curriculum turns students into leaders and changemakers.

Goals

The project’s main goal was to revitalize the School’s web platform and digital identity in a way that would bring the stories of students and faculty to life, highlight the research that comes out of the school, and emphasize the relevance of the institution’s work for both policymakers and potential students.

Specifically, we were tasked with better prioritizing and contextualizing content to make the website more compelling while improving the overall experience.

We sought to modernize the site’s look and feel, balancing the School’s individual character with the overarching Princeton identity. Our design process aimed to emphasize the international reach of thought leadership generated within SPIA in addition to communicating the institution’s strong commitment to diversity and inclusion. To achieve this, we created a new web platform flexible enough to accommodate the broad range of messages the School might wish to share with its global community. 

Solution

For most faculty members and potential students, the SPIA website is the first point of contact with the School. Our team prioritized these audiences to create a more engaging and externally focused design. 

The website also showcases the breadth of SPIA’s research activity and internal expertise, putting forth information that can be used to generate new ideas and perspectives on policy making at the national and international level. It acts as a knowledge base with the power to inspire and challenge visitors in their thinking about public and international affairs. 

The new information architecture is designed around the two priority audiences, potential students and policymakers, with current students and staff as secondary audiences. As part of the project, we gathered input from stakeholders and real users at the school and thought through the user journey of potential students and the criteria used to select a school. Our methods included a UX workshop with diverse participants, competitive analysis, user testing, and user journey mapping through the wireframe content. We created a new color palette that is aligned with the Princeton brand while maintaining full accessibility.

  • Redesign and replatforming on Drupal 8
  • User-centric experience and content strategy
  • Design patterns
  • Managing input from multiple academic and administrative stakeholders
  • Flexible landing page tools for content editors
  • Deployment on Acquia Cloud
  • Integration with Princeton's single sign-on
  • Integration with Princeton's centralized events calendar (Timeline)
  • Automated data migration from Drupal 7
  • Integration with Kaltura and Soundcloud for embedding media assets
  • Unified integration with social media using a social wall

Results

The new visual identity enables the application of consistent design patterns across the content of the entire website. Content editors now have the freedom and tools available to independently create much more engaging pages that integrate harmoniously with the site’s overall design. They can also easily ensure that all published content meets WCAG AA accessibility standards.

We migrated the content of the website to Drupal 8 and implemented a brand new information architecture, visual framework, and content strategy. The updated site is fully accessible according to WCAG AA standards, easier to use, and, crucially, easier for content editors to update. The new website now integrates with Princeton’s single sign-on system and its event calendar, reducing duplicate logins and duplicate content entry.

Evolving Web Newsletter

Sign up for tutorials, best practices and insights, plus info about our acclaimed Drupal Training series.