International Rivers

International Rivers Website Redesign

International Rivers is an environmental and social justice NGO that works to empower communities in developing nations to responsibly manage their natural resources.

The leadership team has recently released a new Strategic Plan, updating its mission and goals for the next five years.

A redesigned website will decrease the bounce rate, increase online donations, and make content more accessible to mobile users.

Key Issues

In the past, the organization has had difficulty conveying its message in a clear and concise way. This lack of effective communication has limited their fundraising success and hindered the growth of the organization.

The website redesign addresses four primary issues:

Site Structure: A more thoughtful site architecture will make content more findable.

Content Labeling: Naming conventions must be consistent throughout the site.

Information Chunking: The large amounts of information must be balanced with white space to improve readability.

Responsive Design: The site must be responsive to make content available to users on all types of devices.

Process

DISCOVER

Stakeholder Interviews

Competitive Analysis

DEFINE

User Personas

Site Map/User Flows

TEST

Wireframes

Paper Prototyping

DESIGN

Low Fidelity Prototypes

High Fidelity Prototypes

Stakeholder Interviews

I conducted one-hour phone interviews with staff members at six of the organization’s international bases. These interviews provided insights into the purpose of the site from the organization’s perspective and the range of user groups.

Site Purpose:
• Provide information to journalists, researchers, and philanthropists about the impacts of hydropower projects on human rights and local ecology.
• Provide resources that help partner organizations fight destructive development projects.
• Provide global context for regionally specific information.
• Give donors an overview of current projects.
• Highlight impact of current and past campaigns.

User Groups:
• Regional journalists/researchers/students
• Regional partners (NGOs, CBOs)
• Regional staff of international donors
• Local governments, hydropower companies
• General public

Competitive Analysis

I analyzed the architecture, labeling conventions, imagery, and visual design of nine international NGOs.

The insights from this exploration were shared with the International Rivers leadership to gain stakeholder buy-in for the redesign process and provide an opportunity to assess current design conventions and trends in the NGO market.

Personas

I developed six personas based on the primary demographic sets identified during the discovery phase.

These personas were used to help guide the subsequent phases of design and ensure that the needs of key user groups could be easily referenced.

User Journeys

I created a series of user journey documents based on the goals of each persona. 

These journeys were illustrated with a simple wireframe template built in Sketch.

Site Map

I proposed a new structure for the site based on the information gathered from our research, personas, user journeys, and my analysis of the organization’s goals as described in the 5-year Strategic Plan. Each major goal of the organization will be translated into a top navigation link.

I determined that it would be useful to create two primary, guided paths through the site

Both pathways are housed under a primary navigation item titled “Our Work”:
• One path is based on geography and titled “Where We Work”.
• The second path is based on the organization’s six primary goals, as addressed in the Strategic Plan, and titled “What We Do”.

This structure will provide easy access points to user. The structure and labeling convention is intended to make information easily findable and clearly articulate the mission of the organization.

Wireframes

I created desktop and mobile wireframes in Sketch for each type of page on the site.

ir-wireframe

Visual Mockups

Using the organization’s photograph library and an updated style guide, I created visual mockups for each type of page detailed in the wireframe documentation.

Primary page types include:
• Campaign Pages
• Goal Pages
• Program Pages
• Publication / Article Pages

ir-desktop-homepage

Mobile Prototype

I created an interactive prototype of a portion of the mobile site to illustrate a simple user journey

Next Steps

International Rivers has plans to raise funds for the development phase of the website redesign in late 2019. The new site, based on the work detailed in this case study, is scheduled to launch in 2020.