Product Designer, Butter Lover
ReadLead.png

Read Lead

 
 

Read Lead

YEAR
2013

DURATION
2 weeks

DELIVERY
Design, Front-End Development

 
 

 
 

Background

Read Lead is a nonprofit organization and educational initiative that provides literacy and leadership opportunities for underprivileged youth and young adults. They provide literacy-based summer and after-school programs, as well as a leadership institute focusing on civic and social entrepreneurial leadership.

I was fortunate to cross paths with Read Lead's founder, Cassandra Chase, at AIGA's Design for Good event, where I was volunteering, along with 3 other designers on Team Awesome, to overhaul Read Lead's identity, branding and website––all within 24 hours.

  • Their site did not have their mission statement, goals or the vibrancy and information about the organization's exuberant leadership.

  • Their last web developer had essentially skipped out on the job, leaving them without a proper way to receive donations, which is a nonprofit's lifeline.

  • The hope was to increase the number of children and the number of communities that Read Lead serves through donations, as well as through grants.

 
 
 

Stakeholders

There are several stakeholders for which this site would serve a purpose: The families of prospective and current participants, prospective and current volunteers, and government agencies and philanthropic individuals and organizations who have donated time and/or money to the effort. 

 
Amazing images from Read Lead summer activities
 
 

Design Process

I led the charge in the design and development of the website, as the sole interaction designer in the group. Due to the tight deadlines, I quickly began sketching the structure of the website, despite the fact that we had not yet begun the branding. 

Fortunately, my initial sketches essentially mirrored the final output.  

 
Wireframes

Wireframes

Wireframes for Subpages
Wireframes for the Alternate subpages
 

With 18 hours remaining, the remainder of the team developed a style guide, with fitting primary and tertiary colors, modified the logo and typeface for better readability and for branding, and produced graphics for social media content and a one sheet for promotional purposes and website mockups.

 
Final Color Palette

Final Color Palette

 
 

Interface Design

The previous version of the website felt generic, lacked a familiarity and a sense of community and warmth. It also needed the mission statement clearly defined on the home page, which would be achieved with typography, as well as introducing the founders of the nonprofit.

In the months following the event, I coded the website so that the mockups could become reality. I wanted to highlight the strength and sense of community in their website, as well as provide a strong call to action to donate.

 

Walkthrough

 
 

Outcome

Read Lead now has a focused direction in which to proceed––the homepage has a strong call to actions and shows the leaders of the organization, the work they do, and the children whose lives they impact. The injection of the actual images of the community they serve exemplify the real difference that is being made by Read Lead. The site no longer feels like a generic, fly-by-night nonprofit organization, but one effecting real change.

Donations increased 250% immediately following the launch.

 
Mockups for Read Lead