Philanthropy Colorado

A redesign of a statewide nonprofit's website around one finding: nobody could find anything. Live, built by a partner firm from our Figma documentation.

My role

Co-designer, with By the Pixel's Chief Design Officer

Team

Two designers

Deliverables

Wireframes, Mobile-responsive design system, High-fidelity designs

Rural Funders Learning Network page
Programs and events page
Philanthropy news and resources page
Impact page with by-the-numbers stats
About page fragment with history timeline
Arts and culture page fragment

About Philanthropy Colorado

120 members, one front door

Philanthropy Colorado is a 501(c)3 nonprofit membership organization that strengthens communities across the state by bringing people, information, and resources together. More than 120 member organizations sit under its umbrella, from foundations and corporations to public agencies, and together they shape Colorado's philanthropic ecosystem.

As the organization grew, its website stopped keeping up. They brought in By the Pixel to redesign it, and I co-designed it with our Chief Design Officer. This case study covers that design work: the research, the architecture, the identity, and the handoff.

Redesigned Philanthropy Colorado homepage: hero over Colorado mountains, member logos, and 120+ active members

The problem

A welcoming mission behind an unwelcoming site

Stakeholder interviews, a content audit, and a look at peer organizations all converged on one finding: nobody could find anything. Navigation had grown by accretion, content was disorganized, and visual inconsistencies made the site feel less welcoming than the organization it represented.

The redesign's operating principle was simple: fewer clicks, greater clarity. Whatever someone came to do, become a member, register for an event, or find a resource, the path had to be short and obvious.

Philanthropy Colorado site header with primary navigation
About mega menu: mission summary, section links, and a featured story
Membership dropdown links
Engage dropdown links
News and resources dropdown links

Information architecture

Four sections instead of a maze

The old structure had grown page by page until finding anything meant already knowing where it lived. A full content audit and stakeholder interviews established what users actually needed and where the structure failed them, and the answer was consolidation: the streamlined navigation collapses everything into four primary sections, About, Membership, Engage, and News & Resources.

Contextual sub-navigation was modernized rather than discarded, keeping the wayfinding members already relied on while making the whole site easier to navigate and easier for the team to manage.

Philanthropy Colorado logo
Fonts: Archivo Narrow and Roboto Flex specimens
Color palette: light, black, primary purple, teal, and green, with three accents
Button styles
Design elements: line-pattern shapes
Components: blog card, filters, event list card, and contact form

Visual identity

Energy the brand already had

The organization's spirit was never the problem; the site just didn't express it. The redesign translates that energy into a digital identity: blocks of yellow, purple, orange, and teal put the brand front and center, soft neutrals keep every page polished and welcoming, and confident typography holds it together.

High-contrast buttons, badges, and icons add personality without getting in the way of use, and the whole system is built to accommodate growth as content and programs expand.

Content library

One hub for everything they publish

Instead of scattering blog posts, news, and resources across separate corners of the site, everything now lives in a single content library that doubles as the organization's thought-leadership hub. Filtering, tagging, and clear categorization let users find exactly what they're after, a policy update, a news article, a downloadable guide, and the consolidation makes the library easier to maintain as it grows.

Home page hero ticket card from the Figma handoff board
300px spacing measurement
Ready-for-development note with menu guidance and author
Annotation pin 1
Annotation pin 2
Annotation pin 3
Numbered annotations: hover state, infinite scroll, and room accordion

Handoff

Documentation a dev team can build from

We designed this site rather than building it. Philanthropy Colorado belongs to a consortium that requires its members to use a specific development firm, so the handoff was part of the product. Documentation, annotations, and specifications live directly in the Figma files: component behavior, responsive layouts, accessibility considerations, and styling guidance, everything that firm needed to build it right the first time.

Outcome

A site that finally sounds like them

The site is live. Philanthropy Colorado's consortium required a specific development firm to build it, so the Figma documentation was the product we delivered, and the built site reflects the design: navigation that works, accessibility built in, and an architecture that scales with them. Most importantly, it communicates who they actually are.

See the designs.

View the Figma file

Contact

Fill out the form and I’ll get back to you ASAP. Or email me directly at jesse.bisignano@gmail.com.

Jesse Bisignano smiling