This interface visualizes the height of rivers at specific geo-points, in real time, and through time, in the form of a website that emphasizes information prioritization, relevance, reliability, and accountability.  The goal of this project is to visualize in a non-interpretive way and in a user-friendly language, the height of rivers at specific geo-points on a map as well as across a timeline that can be analyzed, downloaded, retrieved and reused by scientists and volunteers of the Red Cross. 

visualising floods – a flood warning system

As part of a collaborative project focused on providing a flood-warning system –comprised of measuring the heights of rivers, collecting data, and translating data into a coherent package that is accessible to a variety of users or expert fields, and that contains appropriate and useful navigational tools– this proposal is geared towards scientists and volunteers of the Red Cross concerned with the impact of floods on the social, economic, political, and cultural dynamics of populations residing in flood-sensitive zones along rivers of Africa, where our proposed measuring devices would be deployed.

Digital and physical rendering of sensor structures by Manuel Rueda and Matt Ruby

Digital and physical rendering of sensor structures by Manuel Rueda and Matt Ruby

This project addresses the need for affordable and efficient technologies in the developing world, and focuses on flood-warning solutions in areas where the rates of floods are high and where there is a lack of data-knowledge. Providing such data and presenting it to communities in an understandable language, can help raise awareness of river behavior and offer new environmental insights and decision-making plans.

Solar power circuit diagram by Andrea Bradshaw

Solar power circuit diagram by Andrea Bradshaw

GSM communication flow by Ryan Raffa and Kelly Nichols

GSM communication flow by Ryan Raffa and Kelly Nichols

visualising floods – a flood warning system
There are two types of displays we wanted to include in our proposal: the first is a map to allow potential users to visually locate devices. The Weather Underground website presents a customizable map that has multiple layers of information and a wide range of map controls to pick from, that make this map useful and accessible for its users.

There are two types of displays we wanted to include in our proposal: the first is a map to allow potential users to visually locate devices. The Weather Underground website presents a customizable map that has multiple layers of information and a wide range of map controls to pick from, that make this map useful and accessible for its users.

The second type of display we wanted to include is a graph to allow users to juxtapose or compare different data points on a chosen timeline. Timeplot (SIMILE widgets), and Google Finance both provide a way of looking at measurements of multiple objects across a timespan in a simple, consistent, and effective way.

The second type of display we wanted to include is a graph to allow users to juxtapose or compare different data points on a chosen timeline. Timeplot (SIMILE widgets), and Google Finance both provide a way of looking at measurements of multiple objects across a timespan in a simple, consistent, and effective way.

The process whereby this project emerged has focused on criterion of user-centredness through user capture, usability testing, and redesign in terms of findings, for maximum User Experience (Effectiveness, Efficiency, and Satisfaction (Jordan, Patrick W. An Introduction to Usability. Taylor & Francis Ltd.: 1998)).

After attempting to define the target audience in terms of its physical and cognitive characteristics, and creating a task list responding to defined user-goals, I developed an initial concept of a layout. This layout was tested on three peers who have some knowledge of technology, but less analytical knowledge. The concerns that emerged from this first test defined the changes made in the second prototype implementation. This second layout was, in turn, tested on two computer engineers who are used to looking at data and specifically at graphs. The responses from this test determined the final version of the layout that we have today, and which has been used as a starting point for programming the Website (programmed by Kelly Nichols).

visualising floods – a flood warning system
This 2-page mockup consists of a map view and a graph view. One or multiple devices could be selected with a location-based search; a calendar view would let one select an individual date or a timespan; the data could then be scrolled through by navigating a scroll bar at the bottom of the map; and the graph view would provide different graph styles for displaying this data.

This 2-page mockup consists of a map view and a graph view. One or multiple devices could be selected with a location-based search; a calendar view would let one select an individual date or a timespan; the data could then be scrolled through by navigating a scroll bar at the bottom of the map; and the graph view would provide different graph styles for displaying this data.

Databases: Ryan Raffa, Front-end implementation: Kelly Nichols

Databases: Ryan Raffa, Front-end implementation: Kelly Nichols