Group Created with Sketch.
Case Studies

Digital Web Design to Deepen Engagement with the U.S. Constitution: The National Constitution Center

The National Constitution Center is a non-partisan nonprofit established in 1987 with the mission of increasing awareness and understanding of the U.S. Constitution among the American people. It does this through its landmark museum in Philadelphia and its flagship online product, the Interactive Constitution—a first of its kind digital interactive learning platform. We partnered with NCC to magnify the Interactive Constitution’s impact by redesigning the experience to incorporate extensive audio and video content from live events, and make it an even more powerful tool by adding a robust teacher development and classroom component to be rolled out to millions of middle-school students and high-school students preparing for the AP U.S. history exam across America.

Constructive and NCC team members collaborating to develop the digital web design for The Interactive Constitution.

Creating a Collaborative Vision

As the most visible and visited website of its kind, the Interactive Constitution yields enormous potential to reach and engage millions of Americans in conversations about the document’s history, its interpretations, and how they’re relevant today. We kicked-off digital strategy with staff surveys and interviews to prioritize goals and opportunities, surface pain points and challenges, and understand the implications of adding an online curriculum. We then dug deeper through collaborative workshops to develop a strategy to reach a wider audience, engage and empower educators, and broaden appeal to the wider general public while retaining the Interactive Constitution’s impeccable scholarly reputation.

Wireframes of the new digital web design for The Interactive Constitution.

A Structure That’s Faithful to the Text 

The Interactive Constitution is a content-rich site by nature that serves the needs of diverse audience groups, all of whom bring different needs and levels of understanding of the Constitution. Our challenge was to balance designing a user-centric experience while remaining fully focused on the text of the Constitution. To better understand people’s reactions to and understanding of the site’s navigational flow, content relationships, and on-page content, we conducted usability testing on both the existing site and on new prototypes. The result was UX/UI with a strong content hierarchy that makes each page clear, digestible, and actionable—guiding users and retaining the scholarly integrity of the text. 

Two different digital web design options for The Interactive Constitution shown on desktop abd tablet.

Providing Two Different Interpretations

Redesigning the Interactive Constitution was also an opportunity to strengthen a distinctive sub-brand of the National Constitution Center. We offered two different approaches—interpretations, if you will—to the Interactive Constitution’s visual identity. One design is a bold take on history, leading with imagery and rich colors that create a more emotional connection to the Constitution and what it means. Our other design concept delivers a fast, web application-like experience by using minimal imagery, ample white space, and vibrant colors so that audiences can quickly navigate and focus on the text.

Data infrastructure for the digital web design of The Interactive Constitution.

 

A Narrative Flow to Share The Interactive Constitution’s Story

The Interactive Constitution is unique in that it complements the full text of the U.S. Constitution with insights from leading scholars, an extensive multimedia library, and interactive features to deepen understanding of America’s foundational document. It also appeals to a wide range of audiences, from students, teachers, and Constitutional experts, to lawyers, the media, and the interested public. To develop a homepage that would effectively introduce the breadth of the Interactive Constitution and engage its many audiences, we workshopped digital strategy to collaboratively design content priority. We then designed two distinct approaches that give users the context they need to understand, appreciate, and engage with the Interactive Constitution—providing a variety of entry points for audiences to jump in.

Home page of both digital web design options for the new Interactive Constitution.

Remaining True to the Text

Interpretations of the Constitution can hinge on the addition or exclusion of particular words and punctuation—with significant consequences for American life as a result. Not surprisingly, it was therefore a priority for the National Constitution Center to present the full, original text of the document with minimal distractions. We designed the Constitution’s Articles and Amendments to create a great reading experience that encourages exploration. Clean text is complemented with minimalist navigation that makes it easy to access Articles, Amendments, and Sections or to print, share, or embed content. And understated calls to action highlight the IC’s scholarly interpretations for added perspective.

Different interpretation web pages for clauses within The Interactive Constitution.

Adding Additional Perspectives

The Interactive Constitution is much more than just a digital version of America’s founding document. It’s also an interactive experience that invites audiences to explore perspectives from leading Constitutional scholars and justices on its interpretations and their consequences. With a mandate to remain non-partisan, we designed an experience that highlights what unites Americans by leading with common interpretations, and then ensuring equal time to conservative and liberal voices that explore what’s up for debate.

The new media library digital web design shown next to the old media library.

Enriching the Experience with Digital Web Design

The new Interactive Constitution includes a robust Media Library that makes The National Constitution Center’s events and thought leadership content easily available. The Library provides advanced search and filter functionality that makes it easy for audiences to quickly and easily sort information by Article, Amendment, or topic. We designed a rich repository of resources that provides videos, podcasts, and articles to expand people’s understanding of the Constitution in relation to current events and historical context.

Bringing Live Events to a Wider Audience

A key differentiator of the IC is that it is an initiative of The National Constitution Center—America’s preeminent institution for engaging citizens with America’s foundational document. Highlighting this vital connection, the IC includes recordings of NCC’s live events—providing audiences around the world with access to insightful interviews and panel discussions. The result keeps the Constitution relevant in today’s civic discourse while providing the NCC with a bigger platform for showcasing their thought leadership and contributions to American civic engagement.

The Constitution Classroom edition digital web design.

A Better Way to Teach the Constitution

A key objective of the IC redesign was to create a dedicated teaching and learning experience for millions of advanced placement classrooms across America. To make sure what we designed would meet the needs of teachers and students, we conducted audience research, interviewing educators to hear their challenges in teaching the Constitution and exploring ideas to support them. We then architected an educator portal that pairs the Interactive Constitution with lesson plans, videos, and worksheets to make it easier for teachers to incorporate lessons into their curriculum. An online classroom exchange and professional development opportunities then expand opportunities for educators to enrich exploring the Constitution for millions of students across America.

Bringing the Constitution Alive in Classrooms Across America

The IC’s “Classroom Edition” provides a vibrant place for students and teachers in classrooms across the nation to come together and engage deeply with the content, history, and relevance of the Constitution. An expanded design system adds color and character to the core Interactive Constitution, positioning the brand for teachers and students while also providing visual cues that make it easy to navigate and access content.

The Classroom addition Classroom Exchange, Professional Development, and Educator Institute digital web design.

Supporting Educators Around the World

The IC does more than just provide access to education resources, it also proactively engages educators and students. Professional development workshops and seminars bring teachers together to sharpen their skills and curriculum plans. Facilitated classroom exchanges give students across the country the opportunity to debate interpretations of the Constitution. The result expands the National Constitution Center’s reach and impact, providing opportunities to empower teachers and engage students to understand and appreciate the Constitution more holistically—sparking new conversations about the text and what it means with a younger generation of Americans.

—————————

If you would like to explore a more visual case-study for our work with The National Constitution Center, click here.

If you’d like to explore more of Constructive’s work with public interest and social justice nonprofits, case studies are available here.

Check
Copied to clipboard http://...