top of page
Fluid mobile app screens showing water quality meter, details of water quality, forecast, community page

Fluid - Research & Design Report 

A mobile application that communicates water quality data to river users.

In collaboration with

Blue CoLab logo

Overview

Problem


 

‬In the US, an estimated 4 billion water recreation events take place annually, resulting in an‬ ‭estimated 90 million illnesses. With Water Quality Monitoring technology available, water quality data‬ should be accessible to all water users.

Goal

Create a mobile application to communicate water quality data to river users such as swimmers, paddlers, and boaters.

Project Details

  • Team Leader of five-person UX Research & Design project in collaboration with Blue CoLab

  • My Contributions: literature review, competitive analysis, user interviews, personas, prototyping, usability testing, affinity mapping, field study, stakeholder presentations

Generative Research

Literature Review

Onboarding for app

We analyzed research papers on related topics including annual water reports, communicating water quality emergencies, communicating data creatively, and using analogies to enhance data comprehension. Our insights helped us find current gaps in the market, and proven practices for communicating water quality data.

Gaps:
Understandable water quality data

Accessible water quality data

Best Practices:

Make data easy to understand, emphasize the main message,include calls to action, establish trust.

Competitive Analysis

Onboarding for app

We analyzed Swim Guide, Riverkeeper, Edeya, Paddle Ways, and Air Visual to understand the interaction between water quality data (or similar data) and people. Our
insights helped us understand what we want to achieve and what we want to avoid when aiming to improve the interaction between water quality data and people. 


Things to achieve:
Clarity, Calls to Action, and Trust

Things to avoid: 
Jargon, Data Gaps, and Long Text

User Interviews

Onboarding for app

Target Group:

 

River users, including swimmers, paddlers, and boaters. We reached a diverse group of users with different ethnicities and ages, including older adults and immunocompromised individuals. 

Affinity Map

affinity map showing motivations, wants, pain points, needs

Research - Driven Design Goals

MoSCoW Method

Must Haves (majority of interview participants have this need)

Our users need an easy and efficient way to access water quality information on the go.

Our users need a clear answer to weather or not the water is safe. 

Our users need other relevant water information including water temperature and tides.

Should Haves (half of interview participants have this need)

Our users need a detailed breakdown of water quality information that is easy to understand.

Our users need to be able to check estimated water quality information in advanced.

Could Haves (some (2+) interview participants have this need)

Our users need to know how and when the water is tested.

Our users need to be able to see the history of water quality in their area.

Our users need to be able to report water conditions, and read reports from river users.

Personas

Amanda

"I wish I could check the water quality myself... I'm completely putting my faith in other people"

 

About:

Amanda is a professional swimmer who competes in events around the country. She loves swimming because it helps keep her in shape and she feels like she can relax her mind while she's in the water. 

Frustrations:

Amanda ended up sick for a week after her last swimming event, and thinks it was because she swallowed some river water with bacteria in it. The event managers supposedly tested the water that day, but Amanda wishes she could have seen the water information for herself that day, and the estimated conditions before deciding to attend the event. She wonders if anyone else got sick from the event, and wishing there was a way to connect with other river users about it. 

Needs:

  • A quick way to check water quality and water temperate the day of, and in advanced

  • A way to report conditions to other swimmers, and read reports from other river users

Professional Swimmer

First Design

Main Features

  • Color-coded “Good,” “Bad,” or “Moderate” water quality display on the home screen

  • Call to Action / Recommendation i.e. “Swimmable” or “Avoid swallowing water”

  • Water temperature and tides display on the home screen

  • Easy-to-interpret details about water quality information

  • Water quality forecast

  • Water quality community forum

  • Water quality testing information

  • Water quality history

Wireframes

Screenshot 2024-11-20 at 8.03.22 AM
Screenshot 2024-11-20 at 8.05.13 AM
Screenshot 2024-11-20 at 8.05.45 AM
Screenshot 2024-11-20 at 8.03.31 AM
Screenshot 2024-11-20 at 8.05.27 AM
Screenshot 2024-11-20 at 8.04.48 AM
Screenshot 2024-11-20 at 8.05.37 AM
Screenshot 2024-11-20 at 8.03.53 AM
Screenshot 2024-11-20 at 8.03.43 AM

Usability Testing

Affinity map showing key findings

Overview:

We conducted 8 usability tests with river users including swimmers and paddlers. Our participants had a mix of technology proficiency.

Key Findings:

  • Forecast is difficult for users to find, users prefer calendar icon

  • App organization / flow is hard for users to interpret

  • Bottom Tab Navigation isn't intuitive 

  • Bottom Tab Status isn't intuitive

  • Users find it difficult to skim / find information on the Home Page

Stakeholder Presentation

Community forum on app

Overview:

We presented our design to a key stakeholder from Blue CoLab.

Stakeholder insights:

  • Lean into community forum, crowdsourcing 

  • Add link to Marine Costal Conditions for accurate wind and tides conditions

Field Study

Affinity map showing key findings

Overview:

We conducted a field study with 9 river users including swimmers and paddlers. Our participants had a mix of technology proficiency.

Recommendations for future iteration:

  • Notifications for water quality changes

  • Display the time of the most recent water quality test on the homepage

  • Create distinct sections for reports from the community, and casual posts.

  • Get rid of the “details” page to reduce redundancy, and draw users to the information page.

Meeting Our Goals

  • The Fluid app communicates important health and safety information to river users such as swimmers, paddlers, and boaters, in an accessible and easy to understand way.

Challenges

  • Working on this complex environmental, community, and data-visualization problem was a big challenge for me with no prior knowledge of the field. I enjoyed conquering this challenge by doing literature reviews and talking to stakeholders.

Personal Findings

As a team leader, I learned to find the balance between encouraging everyone to do outstanding work and meet deadlines, and offering support and understanding to teammates' unique situations and experience levels. I successfully kept the team on track to meet key deliverable deadlines and put the user front and center throughout the process.

bottom of page