top of page

Nuba Water Project

A non-profit organization based in Colorado that brings life improvement in the Nuba Mountain region of Sudan through clean water and education. 

Role

UX Designer

timeline.png

Timeline

3 Weeks

icons8-design-80.png

Toolkit

WordPress

Wave Web Accessibility Evaluation Tool

A mockup of the mobile version of the Nuba website that features the navigation and mission.

Summary

This project consisted of a complete redesign and accessibility analysis of a WordPress website. In addition to resolving technical issues this client faced, I also recommended accessibility improvements after conducting an accessibility audit of the website's then state. The final outcome of this project included a more modern UI that better reflected the mission's brand, an a more accessible experience for the client's users.

Client Goals

  • Integrate essential plugins and widgets that enhance functionality and user experience.

  • Customize a new theme's layout, color scheme, and typography to align with the client's branding guidelines.

  • Ensure compliance with WCAG 2.1 (Web Content Accessibility Guidelines).

  • Standardize text formatting and ensure consistent alignment throughout the site.

User Groups

  • Donors

  • Volunteers

  • Organization Stakeholders

Accessibility Evaluation

The first step in the redesign of Nuba's website was an accessibility review using WebAIM's web accessibility evaluation tool. The first accessibility concern addressed was the website's use of a carousel as a hero component. This was a concern for visually impaired users due to the rapidly changing images and the lackluster navigation tools. This piece of content also did not have user controls that meet WCAG standards, so it was recommended to remove the carousel completely and replace with a stable hero image.

Many of the site's other accessibility concerns were related to vision impairments. These concerns included a lack of alt text for the many images the website used. Many of these images consisted of people from the communities in which the Nuba Water Project is devoted to helping. For users who depend on alt text, it would be difficult to convey the importance of the non-profit's mission without them. The site also demonstrated issues with differentiating hyperlinked text from non-hyperlinked text.

Mockup images of the mission page of the final prototype for Nuba.

Outcome

The Nuba Water Project received much needed accessibility updates, including alt text, heading adjustments, and color adjustments for appropriate color contrast. After applying the necessary changes based on the accessibility analysis, I applied a more modern WordPress theme and customized it using CSS to better reflect the organization's mission and brand. The final prototype consisted of a up-to-date theme,  complete removal of the hero carousel, and font face changes to increase accessibility for visually impaired users. 

bottom of page