Premier publication of the 'Impact Report' and select brand collateral.

Design Brief

Propose a new and refreshed design direction for ‘Resume Now’ that influences the look & feel of the product, as well as the future UX and UI design.

Role: Lead Visual & UX Designer

Research Phase

First, we did a competitive analysis of existing philanthropy websites and analyzed their visual design and user experience design. Then, we gleaned the most compelling aspects of a few case examples. Next, we compiled two comps, 'What You Like' and 'What We Are Liking', containing sites and visuals the client provided which informed our own the visual + interaction design research.

Content Outline > 'Copy Dump' > Site Maps

Using the content outline provided by the client, I designed a 'copy dump' to help Pilot and the client see how much content we would be working with. This 'copy dump' helped inform sitemap variations + UX models because as I learned from previous experiences, UX models are most helpful when you know how much content you are working with.

Content Outline > 'Copy Dump' > Site Maps

Using the content outline provided by the client, I designed a 'copy dump' to help Pilot and the client see how much content we would be working with. This 'copy dump' helped inform sitemap variations + UX models because as I learned from previous experiences, UX models are most helpful when you know how much content you are working with.

1/5

THE DONATION FLOW (wireframe)

After doing research on existing donation flows on other philanthropy websites, we felt that there was a way this experience could be designed better to ultimately be a simple, personal, and eventually a branded Donate flow.

 


Thinking about the future versions of the site, we wanted to create a space that would allow for the opportunity of organic content creation. Part of the initial flow concept was to prompt users to share their stories on why they give.

 

An early Invision prototype is here

GPP'S BRANDED DONATION FLOW (designed)

 

The yellow bar at the top connects back to the homepage and functions both as a visual brand element as well as a useful progress bar, as shown here in the Donate flow.

THE UX FLOW: THE PATHWAY TO THE WEBSITE

Another crucial aspect to consider when designing the website was how the user was going to get to it from the Bill & Melinda Gates Foundation's homepage. Our proposed UX model (which I came up with), cut the number of clicks in half and included changing the CTA from 'Gates Philanthropy Partners' (vague for those who don't even know what GPP is) to a clear call-to-action: 'Donate'.

GPP Homepage (Desktop + Mobile)

 

The 'Partner Wall' showcases the 'Power of Giving' -- a phrase I coined. The wall (with the opportunity to be interactive and expand in the future) visually brings together all people as partners working to make GPP possible: this includes everyone from the grantees to donors to people working on the ground to make the important work happen.

The Impact Report 2018

 

This is the premier publication sent out to donors -- showing them the impact the gifts have. I designed all layouts, edited the photography, designed the data graphics, and helped shape the content.

The GPP Identity

 

We also developed the brand identity and system for GPP. The logo references the Bill & Melinda Gates Foundation, maintaining and leveraging the trust and equity already built into the main brand. The yellow line symbolizes the partnership GPP stands for and is a metaphor for how GPP aligns to the goals of the Foundation.