How Work & Co is Helping the Obama Foundation Pave the Way for the Future

What does it mean to support a former president’s legacy? Built In asked this team of digital product experts about this challenge.

Written by Conlan Carter
Published on Dec. 19, 2024
Various product screens of the rebranded Obama.org, shown in mobile view.
Image: Work & Co
Brand Studio Logo

How can one team build a website that bridges the gap between the present and the future — and live up to the legacy of a former President of the United States?

The team at Work & Co was tasked with doing just that. Working together with the Obama Foundation and brand identity firm Manual, they were called upon to design, build and relaunch the foundation’s website, Obama.org: for the existing organization’s programs and, importantly, help lay the groundwork for the future opening of the Obama Presidential Center on the South Side of Chicago.

They needed to create a functional rebrand that served the operational needs of the Foundation in 2024 and the practical needs of the Presidential Center in 2026.

What Work & Co Does

Work & Co is a design and technology company that partners with companies including IKEA, Apple, PGA TOUR, Gatorade, Google and more to launch digital products that transform businesses.

Luckily, the Work & Co team is experienced in designing and executing fully functional makeovers for iconic brands spanning a variety of industries. New Yorkers might recall the launch of the MTA Live Subway Map in 2020 — the first major subway map redesign in 40 years and a product of Work & Co’s design, engineering and collaboration skills. And Work & Co’s 2019 revamp of the IKEA app propelled the furniture store’s e-commerce sales to grow four times its size over three years.

Working collaboratively with the Foundation, the Work & Co team designed the 2026 version of Obama.org as it would look post-opening of the Presidential Center and worked backward, eventually launching the current version of the website for 2024. Parker Sapp, group director of product management at Work & Co, underlined the importance of client transparency throughout this highly collaborative process.

“We entrusted the Obama Foundation team with a clear and unfiltered picture of our process and learnings as if they were an extension of us,” said Sapp.

 

“We entrusted the Obama Foundation team with a clear and unfiltered picture of our process and learnings as if they were an extension of us.”

 

The success of this project hinged greatly on the consistency of brand vision over time. Work & Co approached this challenge by keeping the same teams involved from beginning to end, ensuring that the earliest productive conversations and goals for the project remained central to the final, published product.

“Consistency was crucial in walking this line,” said Sapp.

Built In sat down for an interview with Sapp to hear the story of this product in his own words, get a closer look at the way Work & Co’s teams work together and see what lessons the team took away from the process.

 

On left, a photo-realistic visual of the completed Obama Presidential Center on the south side of Chicago. On right, a mobile phone screen  of the Presidential Center on the website.
Image: Work & Co

Tell us about a product the Work & Co team is excited about.

Image of Parker Sapp
Parker Sapp
Group Director, Product Management • Work & Co

We recently designed, developed, and launched the rebranded Obama.org, which serves as the digital home of the Obama Foundation, and the forthcoming Obama Presidential Center — a 19.3-acre campus with a wide range of uses set to open in Chicago in 2026. Work & Co has done work with various nonprofit organizations in the past, and we have found that the Foundation’s product and technology team’s level of digital thinking and commitment to design exceeds even some Fortune 500 brands, befitting an organization founded by America’s first digital president.

 

Why did Work & Co need to build this website? Why was it important to launch a website now?

The Obama Foundation has an ambitious and meaningful mission: to inspire, empower and connect people to change their world. Today, Obama.org is a place for them to share with the public the stories and achievements they’re creating through this work.

At the same time, as the Presidential Center nears completion, the Foundation is entering a new era as a cultural institution with a physical home. Starting last year, the Foundation began reevaluating its digital platforms in anticipation of the Presidential Center opening and the transformation that will come with it. Work & Co is among a small group of partners who joined them at a critical moment — as a new brand was taking shape and new roles for digital products were emerging.

 

Work & Co joined them at a critical moment — as a new brand was taking shape and new roles for digital products were emerging.”

 

A screen of the rebranded Obama.org’s mission statement, shown in mobile view.
Image: Work & Co

 

What role did you play in developing and launching the website? What tools or technologies did your team use throughout the process?

We first created and prototyped a concept for the website — focused on a moment two years into the future, after the Obama Presidential Center had opened — to establish a vision for where we were headed. As with nearly all of our projects, this work was all done in Figma, which enabled our teams to learn constantly from one another as we iterated on ideas despite being located in several different parts of the country. We arrived at a conceptual framework that could unify the Foundation’s programs and the Presidential Center as a single entity while supporting the breadth of content and use cases across programs, exhibitions, events, ticketing and visit planning.

We then worked backward, designing the detailed component system and templates. We ultimately developed the front-end application for the initial relaunch in May, which was focused on showcasing the new visual brand. We built new, reusable components on top of the Foundation’s existing Svelte and Tailwind UI library and integrated them with their Contentful environment to take advantage of the years’ worth of content they had created.

 

Were there any obstacles that you encountered along the way? How did you successfully overcome them while staying motivated toward the end goal?

Many of our client engagements span several years across various products or workstreams, but the Obama Foundation was a unique case in that our timelines didn’t hinge on digital needs alone. We also needed to align with a large-scale architectural project that was underway.

As we set out to redesign Obama.org, we found ourselves bridging two very different scenarios: the one that exists today, where the focus of the website is centered on previewing the Center and sharing stories of the Foundation’s work and another that will come to reality in 2026 when the Presidential Center opens. When it does, the website will support visitors who need to plan and book, as well as people who want to experience everything the Center offers remotely. 

 

“We found ourselves bridging two very different scenarios: the one that exists today, and another that will come to reality in 2026.”

 

While we had a clear picture of the post-opening phase from our initial work setting the design vision, we needed to ensure that what we created for the initial relaunch would be a stepping stone toward that vision and not a prototype of it to be thrown away. Consistency was crucial in walking this line. We were committed to ensuring that the same people involved in setting the vision were driving the execution of the design system, taking advantage of the countless discussions and decisions they experienced firsthand.

 

Various product mock-ups of the rebranded Obama.org, featuring the new homepage for the Presidential Center, shown in mobile view.
Image: Work & Co

 

What teams did you collaborate with for this process? What principles helped you collaborate effectively?

At the outset, the Foundation’s leadership brought us together with some very talented firms like strategy consultancy Myself & Others and design and branding studio Manual. We worked closely together at the earliest, broadest phase of the design process as the visual identity was still being developed to ensure that the website would be an articulation and extension of the new brand.

As we moved toward execution, we partnered tightly with the Foundation’s product and technology team, working in unison on the user experience and systems across design and development. As with many of our strongest client relationships, we found transparency was key. We planned the implementation together, debated alternative approaches and openly discussed possible risks and pitfalls. By the time we began to prepare for launch, we had established a degree of familiarity and comfort that enabled us to operate as a single team, skipping past artificial formalities and putting our collective attention directly on the product itself.

 

As with many of our strongest client relationships, we found transparency was key.”

 

Three screens of the Obama.org website rebrand. In the center, a large banner reads BRING CHANGE HOME above a photo of Barack and Michelle Obama.
Image: Work & Co

 

When you compare to other companies in your field, how does Work & Co’s approach to building and launching products differ from its competitors?

Work & Co’s process is built around how designers, developers and product managers work best — by diving deeply into a problem with a high degree of focus and blurring the edges of our roles. Our people are generally dedicated to a single project at a time, enabling them to immerse themselves in the problem at hand. By working in small, cross-functional teams, we can also create an environment where everyone develops an informed point of view on the product as a whole — instead of focusing solely on their discipline — with the rapport to share ideas openly.

As developers engage with design, and designers weigh in on the product roadmap, we all develop empathy and understanding of the disciplines we’re collaborating with. This practice helps us anticipate and understand one another’s work more effectively and ultimately results in a better product.

Responses have been edited for length and clarity. Images provided by Work & Co.