Purdue Community Environmental Health (PCEH) is a community-based, public health research lab at Purdue University.

Tasks

User Research
UI/UX Design
Copywriting

Timeline

March 2021 - July 2021
(14 weeks)

Team

Just me!

Context

This was a self-initiated project for my research group.

  • Background

    Martinsville, Indiana has been plagued with drinking water contaminated by toxic chemicals, which has resulted in adverse health effects, including a high incidence rate of cancer and hindered neurocognitive performance in local residents. To investigate, the PCEH lab has been conducting experimental research surrounding the correlation between the chemicals and the incidence of these health outcomes in Martinsville residents. The PCEH web platform was designed and created with an intention to disseminate complex research to impacted community members and help them understand how this research is relevant to their health.

  • Deliverables

    I designed a high fidelity wireframes and prototypes in Figma. The final website was implemented with Wix.

EXPLORATION

What are the needs of Martinsville, IN residents?

I began by distributing surveys and conducting 3 interviews to learn about the targeted users. From here, I determined the pain points of Martinsville residents via an affinity diagram. I also uncovered questions that interviewees had and made sure that these were answered in the final design.

 
PCEH affinity map.JPG

From these interviews, I discovered that there were many motivators driving community interest in PCEH’s research. This user research and demographical information helped me construct a persona of a Martinsville resident. The most prominent points that motivated residents included a desire to:

  • Learn how this contamination affects the health of their community, themselves, and their children.

  • Learn how this contamination happened, why it is still an issue, and what areas it has affected.

  • Help out the Martinsville community.

  • Become involved in the research studies.

  • Spread the word so that action can be taken to remove the contamination and protect future residents.

Persona.png

Analyzing Similar Websites

One of my biggest concerns was that users would become overwhelmed by the text-heavy research information. In cognitive psychology, Miller's Law states that an average of about 7 items can be kept in a person's working memory. Furthermore, a comparative analysis of similar research- and community-oriented websites reinforced my assumption that too much academia-heavy content can easily result in information overload and user frustration. ‍

Nonetheless, with proper content chunking and the use of layman language, complex information can be broken down into manageable groups.

 
Comparative Analysis.png

Feature Prioritization

With these research discoveries in mind, I began developing the overall structure of the site. Because I wanted to make sure that the PCEH website answered residents’ most prominent questions, I prioritized the features into high, medium, and low based on the frequency of the question asked.

Assumed Problems & Solutions

Based on my research and further discussions with the PCEH research team, I created several medium fidelity wireframes to quickly organize the website’s content. As I was doing so, several challenges arose. In light of these obstacles, I took some time to brainstorm solutions. Because these problems were assumed, I also made sure to test for them during the usability testing stage.

 

Problem – Users might have a hard time understanding some of the research language.

 

Solution – Plain English should be used throughout the website so that users can easily understand the research. In situations where research vocabulary must be included, the website should include underlined text links to external sites that explain the terms (taking inspiration from websites like Quora and Wikipedia), leaving it up to users to decide if they want to learn more.

 

Problem – Too much text-heavy information might overwhelm users, leading them to leave the website in frustration.

 

Solution – Information should be broken up into manageable sections. Proper typographic hierarchy, colors, images, and other visual elements should be included to balance text-heavy sections and highlight the most important information on each page.

TESTING

“This website does a good job making me see how important the issue is. After visiting the site, I would care about this problem a lot and I would be especially concerned for my parents and friends.”

— Martinsville Resident

Because I had already been working as a research assistant in the PCEH lab for several years, I wanted to make sure that my designs were not biased based on a researcher’s point of view. To assess my solutions, I tested 3 users with a high fidelity, clickable prototype using Figma. You can view the prototype here, and a few of the screens can be seen below.

  • Our Team Midfi Wireframe

  • Scholar List Midfi Wireframe

Usability Testing Insights

  • Users could easily navigate to the pages that contained the answers to their most prominent questions.

  • Users thought that the information was presented in a comprehensible format. Nonetheless, some still had trouble understanding some of the scientific terms.

  • Users were unsure what the purpose of the Facebook group was.

  • Parents might be showing this website to their children, so incorporating vibrant colors into the design might keep them more engaged.

  • Some of the buttons and links were not very clear.

To account for these insights, I added a brief explanation following scientific terms and external links to sites that further explain them, micro-interactions that emphasize active buttons and links, a “Contact Us” page with a form that lets users submit their own questions, and an explanation of the Facebook group’s purpose. Furthermore, I decided to use brighter colors throughout the website’s UI.

 

Final Design

 
 
 
 

REFLECTION

Throughout this project, I had a difficult time balancing information presentation and usability. In other words, since most of the user questions were content related, it was hard for me to present text-heavy information in a way that would be both understandable and easy to use. If I had more time, I would have implemented this website on a different platform so that I could create more micro-interactions to break up the text heavy information. Furthermore, I would like to interview children to see how they interact with the website.

It was also quite inspiring to see how far my UX skills had come after only a few months of self-study. Despite this, I know that there is still much to learn – nonetheless, this leaves me with a lot of opportunities for growth.