A pioneer in the field of “narrative framing,” FrameWorks Institute conducts scientific research on how people think about and respond to complex social issues. Their innovative work on cultural mindsets and the issues that unite us is turned to by experts helping to shape and shift public understanding, dialogue, and solutions. Constructive has been FrameWorks’ strategic design partner since 2021—and with their 25th anniversary on the horizon in 2024, we collaborated to create a dynamic website that would better project FrameWorks’ brand leadership and impact. The result is a dynamic knowledge platform that educates and activates audiences, transforming the institute’s publishing operations with digital publications and reports that make their thought leadership more accessible and actionable.
Having worked closely with FrameWorks’ team for years, we understood them and the brand well. What we needed was insight into how audiences used their website, how to better engage them online, and how we could improve FrameWorks’ publishing operations. We began by conducting research to understand and prioritize audience needs, and then identified where and why the website was falling short of meeting them. The takeaways were clear. The site needed to do a better job explaining what FrameWorks does and the value of their research. It needed to better explain the science of framing to newer audiences and make it easier for issue area experts to find relevant content. And it was essential to improve editorial design and readability of FrameWorks’ long-form research. Once research was complete, we created a digital engagement strategy that established a shared vision for FrameWorks’ new website.
Now it was time to translate our shared vision for FrameWorks’ website into a blueprint that would bring it to life. Starting with a focus on the brand, we structured the site to quickly introduce FrameWorks to audiences and clearly communicate who FrameWorks is, what they do, who they work with, and why the social science of framing matters. Because most of FrameWorks’ site visitors are nonprofit professionals interested in specific issues, we made sure that issue areas were a central organizing principle of the website and easily accessible throughout. Dedicated issues pages give FrameWorks the opportunity to explore what their research reveals about the topic and present their most relevant findings. A new Resource Center aggregates 25 years of research reports, toolkits, videos, and articles, providing advanced search and filtering that makes it effortless to access resources by issue, sub-topic, and product type. Taken together, our new information architecture and UX design deliver an audience-centric experience that strengthens FrameWorks’ brand and delivers the wide array of value that people turn to them for.
We were now ready to translate our strategy and blueprint into a visually engaging online experience that embodies FrameWorks’ brand leadership. Building on several years of work by our team to evolve the Institute’s branding and design system for its publications, we focused on refining it to be more effective in digital. We introduced a suite of less saturated secondary colors that shift focus to FrameWorks’ content and add sophistication to the brand. To deliver an editorially rich experience for reading long-form content, we significantly expanded the brand’s system of typography, adding more varied weights and a condensed width to structure content, establish visual hierarchies, and make better use of small spaces, such as related content modules. And to deeply connect FrameWorks’ academic research to the human side of their mission, we developed a new system of illustrations that visually communicate complex issues thoughtfully and ethically.
The social science of framing communications is comparatively new, and while some people understand it well, others are just being introduced to its principles. Knowing that FrameWorks needs to engage both novice and experienced audiences alike, we created clear pathways for users to access and engage with the Institute’s content based on their level of expertise. Drawing on our UX research to understand site usage patterns and leveraging strategic techniques in digital storytelling, FrameWorks’ new website introduces Framing Fundamentals, which includes an interactive before/after framing tutorial and directs audiences to Essential Resources that expand learning. For audiences interested in learning about more advanced concepts like mindsets and movements, we created a Common Questions section. For experts seeking practical applications of framing research in the social sector, a library of Impact Stories brings these insights to life. The result is a website that delivers the expertise that FrameWorks is known for to a wider range of audiences while strengthening its brand leadership and influence.
FrameWorks’ new website strengthens their brand leadership and makes exploring and reading the Institute’s decades of research a delight—educating audiences on what the social science of framing is, how it makes a difference, and how to apply it more effectively.
Ensuring that the user experience and visual design of FrameWorks’ new website were exceptional was, of course, critical. Equally as important in our strategy was the opportunity to transition FrameWorks to HTML-first publishing of their research. While PDFs still play an important role for FrameWorks, we emphasized the benefits of digital reports—from greater accessibility and adaptability to mobile screens to stronger SEO and richer analytics data on content engagement and performance. In designing new digital reports, we applied a content strategy that leverages the inverted pyramid model for strategic communication—leading with summary pages that immediately deliver key takeaways and strong summaries of research reports; then providing deep dives into every section. The new website and custom CMS workflows transformed FrameWorks’ publishing operations with a digital-first approach that significantly expands the visibility and reach of their work and amplifies their ability to mobilize knowledge for social change.
“For any of my comms friends thinking about working with a new design agency, I can’t recommend Constructive highly enough. Designing, writing, and building a new website is a daunting undertaking—and their process made ours so much easier. Having worked with their team for years now, I really value their team as thoughtful, strategic partners who help us strengthen our brand with smart design.”
