Constructive Group Created with Sketch.
Case Studies

Nonprofit Digital Annual Report Design for Increased Impact: The Legal Aid Society

Nonprofit annual reports are a cornerstone of many organizations’ communications strategies and there are a lot of ways to approach designing an annual report—especially if your considering designing an interactive nonprofit annual report. In nonprofit annual report design, each year brings a new opportunity to create something that shares your organization’s impact—and tells the stories that bring this impact to life. Staying on top of trends helps make sure that your nonprofit’s annual report stands out and engages your most important audiences.

One of those trends is whether creating a digital annual report is worth the time and investment for your nonprofit over designing a PDF annual report. Digital publishing for reports is hardly new, but living through 2020, with many of us working from home, has elevated the value of a digital annual report for nonprofits who need to engage their most important audiences—particularly for fundraising. Because, when you can’t easily hand an annual report to someone in a personal meeting and you’re also not sure if you can mail it to their office, the value of a digital annual report starts to make a lot more sense.

This year, we channeled our energy into designing an interactive digital annual report for The Legal Aid SocietyWe’ve created annual reports for them in the past. However, print annual reports were always their priority. But Covid pushed us and The Legal Aid Society to take a different approach. So, we shifted gears and prioritized designing an interactive annual report—with the PDF version taking a back seat.


digital annual report design for nonprofit The Legal Aid Society

A New Vision for Nonprofit Annual Report Design

As the pandemic brought most in-person interactions to a halt in New York City, The Legal Aid Society’s typical strategy for distributing their annual reports shifted. Instead of distributing them primarily in-person during their Annual Meeting, this year they would need to distribute their annual reports digitally. Instead of moving the static annual report to a digital format where it would appear as a single-page, scrolling document, we decided to use this as an opportunity to provide The Legal Aid Society’s clients and stakeholders with a more interactive experience.

We pitched a multi-page, interactive annual report to The Legal Aid Society that would be more user-friendly and provide readers with an immersive digital experience. And for the print-inclined, the digital report also includes a downloadable PDF report.


UX design for digital annual report for nonprofit, The Legal Aid Society

Nonprofit Digital Annual Report Design with a Content-First Approach

Since we were creating a multi-page digital annual report, we approached things a little differently than usual. Instead of presenting The Legal Aid Society with a site-map and walk-through of how the navigation would be structured, we took a content-first approach. We went a level deeper to think about what content would be hosted on each page of the site and how we envisioned these pages being interrelated. Our wireframes, then, grew organically out of these content selection and layout phases.


Animated Interactive annual report for pubic interest law nonprofit

UX Design That Caters to Audiences’ Mental Models

We created an HTML-based site to host The Legal Aid Society’s digital annual report. The main question that guided our design was, “how would a user flow through this information?” Since the annual report was a multi-page experience, we knew a user wouldn’t be going through it in a linear fashion, as one does when reading a static annual report, from beginning to end. Even so, we wanted to make sure that we kept users’ mental models front and center when designing this annual report so that they would still be able to progress through the content from page to page, in a logical, even if not linear, manner.

We also enhanced readability through user interface elements. For example, the annual report included letters from executive staff, but instead of just presenting them in a static format, we loaded them in elements that slid out from the side of the report. This created the experience of reading a letter on the screen for the user rather than simply reading it in-line on a page.


Interactive nonprofit annual report showcasing team

Interactive Annual Report Design that Drives Engagment

Since we previously worked with The Legal Aid Society to design the nonprofit law firm’s branding and website, as well as multiple annual report designs, we already had a design system in place. To keep brand continuity intact, we drew on the same design elements, including typography, photo treatment and color palettes.

For typography, we used type overlaid on photos with a box, picking up on design cues from the main site. Additionally, we used bolder and larger numbers for statistics to immediately draw the reader’s attention to them, a design practice we implemented both on the main site and in previous annual reports for The Legal Aid Society.

For the digital annual report, while we continued to use the same color palette we used for the rest of The Legal Aid Society brand, we incorporated larger color fields to break things up a little and create better pacing as one goes through the report. While in one way, our use of color aligned the annual report with The Legal Aid Society brand, in another, readers also got the sense that they weren’t on their main site and were partaking of a distinct experience.


nonprofit annual report donation engagement

An Annual Report That Leverages the Main Website

Designing a more robust nonprofit digital annual report also expanded our opportunities to design for engagement. With more stories and information to explore—and more content to engage with—we had more places to engage audiences to learn about The Legal Aid Society. And because they have invested significantly in making sure that The Legal Aid Society website is filled with useful and actionable information—and countless opportunities to support campaigns, volunteer, and donate—we were able to piggyback on that work without having to reinvent the wheel when designing nonprofit’s annual report, which has a fraction of the budget.

In addition to driving engagement by directing audiences to the main website to explore further, we made sure to create immediate action by emphasizing how visitors could “Donate for Justice” as they learned about the amazing things that The Legal Aid Society accomplished over the year. A ubiquitous donate call-to-action at the bottom of every page turns the annual report from a simple recounting of the year in review to an opportunity to support their work. The call-to-action then gives audiences information on different sponsorship opportunities, from individual donations to corporate sponsorships.

Delivering Results

Since releasing this nonprofit digital annual report, The Legal Aid Society’s team has undergone a strategic shift, recently adding Directors for corporate giving and foundation giving. As their team shared with us, having a digital annual report has empowered these new members of their fundraising and development team to make adjustments that would be impossible in a print annual report—and easily connect with new fundraising audiences.

Moreover, the email The Legal Aid Society sent out to all their donors and supporters sharing the annual report was viewed 22% more, compared to average communications sent out by their team, and showed a 63% increase in engagement. Want to see for yourself? Have a look at The Legal Aid Society’s 2020 Annual Report


Explore Further

See more of Constructive’s work with public interest and social justice nonprofits or learn more about Exposition, our solution to designing engaging digital reports of any kind.

About the Author

Private: Queenie Sukhadia

Private: Queenie Sukhadia

Queenie comes to Constructive with a deep interest in engagement through storytelling. Her toolkit is diverse – she is as comfortable telling a story through a long-form thought piece as with a succinct tweet. Her passion for impactful communication, blended with a desire to drive positive social change, guides her work in digital marketing and brand strategy at Constructive. Queenie earned her BA in English and Psychology from Dartmouth College and her MA in English from Georgetown University. She is currently pursuing a PhD in English at the Graduate Center, CUNY. 

More about Private: Queenie Sukhadia
Copied to clipboard http://...