Read Now

A free non-profit company that teaches Adults how to read

Overview

Challenge

Read Now is a non-profit company that teaches adults how to read. The founder has over 12 years of success in the area of Austin, Texas. 

I had an initial meeting  with the CEO of the company. This will be the first website for the company and he has no specific direction on the aesthetic appearance or structural composition.

This website must meet all rules of accessibility. It will be designed for Adults who read at the 3rd grade level.

Read Now also wants a way to have a way for people to make donations.

Solution

1. Research other non-profit companies websites to get inspiration on design and layout. 

2. Work with Researcher and Developers to create a flawless accessible website.

3. All colors and typography need to meet accessible requirements while being age appropiate.

4. Create a donation page.

Role

Head UX Designer | A team of 4 ( 2 Developers, 1 Researcher) 

 

Research

I started with researching websites that focus on non-profit companies, accessibility concern and functions, and have a donation section.

​Takeaway:

  • The most visually appealing websites have open space, larger font size, and buttons to indicate clear call to action. 

  • Icons to support short text is an accessible way to convey an understandable message for the user.

  • All websites have a donation section. They are all accessible to use, gives the option of payment amount and reoccurring payments.

Clear call to action : Icons and short text 

Amesty International

Room to Read

Autism Speaks

Site Map

 

Design

Sketches - Lo fi Wireframes

I approached wire-framing with the idea of readability

  • A simple layout with large images. 

  • Boxes that have supportive images and icons. 

  • Text that is effortless to comprehend.

  • Highlighting the 100% success rate with testimonies. 

  • Explaining the heart of this company.

Home Page

About Us

Student

Style Guide - Color Palette

Design that meets W3C accessibility standards. 

  • A classic color palette

  • Gender neutral

  • Bold and light shades to support black and white text

Medium Wireframes

Home Page

Header & Footer

  • Working with icons and testing the validity of each one.

  • Color is used to place color blocking and call to actions.

  • More improvement on the Header and Footer.

Outcome

The new designs are currently in development and being applied to the desktop website. 

Creating the companies first website, the goal is to bring more awareness to the program : having more students and volunteers sign up. 

The donation option will also allow this non-profit company to make more money in order to expand their business. 

 

Final Wireframes

Home Page

About Us

Students

Key Takeaways

I loved working on this project and learning about all the ways a website needs to be accessible.  Accessible design is about learning to design for all people and I look forward to applying what I learned to future projects. 

I also strengthened  my skills of working inside a team with developers and other designers.