Redesigning an Early Warning System
Enhancing a web-based early warning system to ensure safe water quality.
Summary
River watersheds serve as vital water sources for drinking water and other purposes, and effective response to incidents and spills within them are essential to protecting water quality.
Our goal was to redesign a web-based early warning system for a multi-organizational network of people dedicated to protecting water quality surrounding a major U.S. city. We intended to support mobile spill event reporting and response, simplify legacy workflows, and enhance event communication and response.
My contributions evolved and scaled to available resources and funding. I addressed assumptions with a prototype persona, conducted heuristic evaluations of legacy features, created wireframes, mockups, and prototypes, and tested key flows. We delivered a responsive web app with improved legacy features, augmented event information, advanced data visualization for predictive analyses, and a training webinar.
Context
The Problem
Two rivers and watersheds supply public drinking water for a major city and water resources for other purposes (e.g., industry). Spills, accidents, storms, and other events can negatively impact water quality. Timely reaction to such events is important to ensure clean up/response, safe water usage, and public safety.
This is also challenging for operators along the watersheds or those responding to events, because organizational barriers block seamless communication and event information can be unreliable to adequately respond to events.
Target Audience
A network of people representing over 50 organizations devoted to safe water quality, including public and private drinking water supply and treatment facilities, industries, and government agencies. Users included water intake operators, engineers, water resource planners, emergency responders, and more.
Our Team
A cross-discipline team of internal and external/consultant members, including a product owner, project manager, developers, and a designer. I was the lead UX designer consultant-side.
Vision
Our vision was a redesigned early warning system web app usable on any device. The new experience would simplify event reporting, enhance notification protocols, and capture and communicate more valuable information to improve response and better protect water supplies.
Process
My semi-agile approach was adaptive and dependent on available funding for UX activities, active development work, and what our small, cross-functional team needed to achieve product or contractual goals.
The app was partially built when I joined the team, and objectives and my accompanying contributions evolved throughout the project. My contributions started as quick UX consults, which grew to leading design and testing for critical flows.
By the end of the project, I supported planning conversations for future design and development, onboarded a new designer to the team, and led the design of new product offshoots.
Discovery
There wasn’t a discovery budget for this project, so I collaborated with the team to define simple, prototype personas.
Also, I collaborated with the project manager to identify priority features. If such a feature existed in the legacy app, I conducted a heuristic evaluation of it to kick off, inform, and inspire a redesign.
Over time, I compiled a list of global usability concerns relating to consistency and standards for aesthetic design decisions made by others on the team.
Design
Designs efforts focused on a specific, information-dense page or interactive flow. All designs started with low-fi Balsamiq mockups and feedback from the team to iterate. I increased fidelity to Figma mockups and prototypes for more formal design reviews and development.
All design outputs demonstrated the mobile and desktop experiences, and a few included tablet mockups to clarify design specifications.
When budget allowed, I developed and communicated new design standards to correct global usability concerns captured across heuristic evaluations.
Testing
I conducted formative usability testing of key flows, such as reporting an event, with representative users. Tests were conducted in-person and remotely via Microsoft Teams using a scenario-based, think-aloud protocol.
Training
Following the release of the new app, I planned, scripted, and conducted a virtual user training session via Microsoft Teams with over 40 attendees.
Result
We delivered a redesigned web app that provides a responsive experience for mobile devices, and a refreshed training webinar with accompanying materials.
For the app, critical legacy features were simplified and made accessible whether in the field or office. New data visualization and spill modeling features enhanced the value of reported event information and created opportunity for more predictive analyses.
Lessons Learned
When working on teams with historically low UX maturity, quickly and consistently deliver valuable outputs with simple, multi-modal communication, and be strategic with education.
When working across disciplines, it’s valuable to understand and learn what your teammates do and their strengths and weaknesses, so that you can better support each other for the common goal.
Thoughtful questions with strategic moments of silence can help calm difficult conversations.
Want to learn more?