ReadyMapper
UI/UX & Visual Design • Desktop
I designed an interactive data platform for CrisisReady that streamlines the decision-making process for disaster responders by turning live, geospatial data into actionable insights.
Overview
What makes this powerful is the ability to have an iterative process with real consumers of the data.
– CrisisReady
Role
Lead product designer
Team
6-person team
Timeframe
About 10 months
Client
CrisisReady & Direct Relief
Company
Stamen Design
Read the blog post I wrote for Stamen Design 👀
Outcome
1.5x faster analysis for responders in real-time disasters
Accelerated critical decision-making by converting complex geospatial data into clear, actionable visual insights
Strengthened disaster response coordination by uncovering workflow gaps through direct research with data managers
Improved analytical outcomes by enabling users to filter, compare locations, and explore trends across time and geography
Increased confidence in the platform by ensuring scientific accuracy and intuitive usability through close collaboration with researchers and engineers
Expanded the tool’s long-term value by designing a flexible interface that scales to new disaster types and evolving data needs
Enhanced stakeholder alignment by enabling teams to generate customizable reports that clearly communicate key findings and visuals
Problem
Combining crisis and community data for decision-makers in moments of panic
To start the project, we asked the client to define what success looked like from their perspective. This approach helped align expectations early, clarify the problem we were solving, and provide a benchmark to measure our progress throughout the project.
Failure
Success looks like avoiding 100% of the following
Broken or lagging data
Key audiences don't see use/value of the tool
Failure to understand workflow
People hate it
Minimum Success
Success means achieving 100% of the following
Clear presentation of data and workflows
Live data in the report (real and timely)
Includes ability to generate pdf report
Able to successfully demo Dixie Fire use case
Used by more than one agency partner
More ways to visualize vulnerability beyond age
Target Success
Success means achieving 40–60% of the following
Users are able to easily use the product
Successfully demo more than one use case (beyond Dixie fire)
Able to toggle between two scenarios
Teams/offices have internal capacity and interest to use dashboard regularly
People are excited about this tool and it’s future development
Ability to customize the pdf report (rank order sections, include/exclude sections)
Discovery
Learning what questions emergency responders are asking
We began our research by speaking directly with disaster responders to understand their workflows in practice. Using the 2021 Dixie Wildfire as a case study, we pinpointed where key pain points occurred. One major challenge was the need to switch between multiple applications to view different types of data, which was slow, cumbersome, and prevented users from layering data sources effectively. Through this discovery work and user research, we identified which data types would be most essential for the dashboard:
Disaster data: Where is the wildfire? Is it growing or shrinking? How many acres have burned since the start?
Vulnerability data: Where are the vulnerable people (i.e. over 65 years old, under the poverty line, etc.)? Where are people experiencing power outages?
Mobility data: Are people evacuating? If yes, where are they going?
Infrastructure data: Where are the hospitals that might need evacuation? What is the bed capacity for nearby hospitals? How long does it take to drive to these hospitals?
Cartography
Designing a map to convey disaster data quickly
For the dashboard to effectively replace responders’ existing workflows, it needed to support visualizing many different data layers simultaneously. To reduce visual overwhelm, we designed a clean, minimalist basemap using a black-and-white palette that emphasized place names, road networks, and topography. This provided clear spatial context for the overlaid data, where we used color, texture, and iconography to enhance legibility and focus attention.
Although the final application would run on live data, we began the design process using historical data from the 2021 Dixie Wildfire. Our first step was to map the fire’s location and progression over time. We represented the fire boundary with a red texture and indicated new fire growth with a darker shade. Vulnerability metrics, such as the percentage of the population over age 65, were displayed using solid fills and vibrant colors. The example below shows how these visual techniques helped convey multiple layers of information clearly within a single map view:
After designing the disaster data for the Dixie Fire, we took a step back to consider how the dashboard would scale for other types of disasters that require a broader view. For hurricanes, for example, users need to zoom out to a country level to track events that unfold more quickly and cover larger areas than wildfires. In the example below, which uses historical data from Hurricane Ida in 2021, the user zooms out to see how the storm is developing over time. In this view, we intentionally hid details such as vulnerability metrics and power outages, as these would distract from the primary focus being the hurricane’s forecast path and category.
Once users identified where the disaster and vulnerable populations were located, the next key question was whether and where people were evacuating. The movement data we used represented population shifts through raster points distributed across the map, rather than by zip code or county boundaries. We visualized this using a colored dot pattern to show the direction and density of movement in disaster scenarios. This approach also helped visually distinguish the movement data from the vulnerability and disaster layers.
Finally, users want to understand which medical facilities could require evacuation or have capacity to receive evacuees in and around a disaster area. We represented health infrastructure using colored icons to indicate different facility types: hospitals, long-term care and other facilities, and outpatient centers. The pin-style iconography also helped visually distinguish these data points from the movement, vulnerability, and disaster layers.
User interface
Designing a user interface that is effective in moments of crisis
With a data-rich application like this, the interface needed to be as compact as possible without sacrificing essential interactions or detail. The final mocks showcase a sleek, minimal design with numerous collapsible elements that help guide users through their workflow. Key features include:
Users can quickly switch between disasters using the collapsible side navigation menu on the left.
A collapsible disaster legend panel in the top-left corner displays key disaster information.
A second data legend panel allows users to toggle between data types, adjust supplementary layers, and view details for any selected location or county.
At the top, a timeline scrubber lets users animate historical data or select a specific point in time.
A prominent generate report button at the bottom enables users to create a PDF of their findings.
Snapshots from the wireframing process 📷
Supporting data viz
Quantifying disasters overtime for quick, high-level overviews
Users could scrub through the data using a timeline, but there was no way to quickly see a summary of the disaster’s impact over time. To address this, we created a compact line plot showing key metrics, such as total acres burned or wind speed. To save space, we removed the y-axis and instead display the exact value as a header, such as the total acres burned or the current wind speed category.
Report design
Turning insights into actionable reports for coordinated response
Understanding each role in the disaster-response chain of command clarified how users interact with the data. Incident commanders typically review reports, while planners spend more time in the dashboard and generating insights. To fit their workflow, we identified PDF report generation as the most effective way to share summary views with stakeholders. We then defined several goals to guide the feature’s design and ensure it met user needs:
The report provides a clear summary at the beginning before presenting detailed information.
Users can customize which sections appear, ensuring the content is intentional and never distracting.
Data is presented in multiple formats to accommodate different users and use cases.
The design is flexible, allowing the report to work across various types of disasters.
When using the dashboard, a user can select the "Generate Report" button at any time to view a comprehensive overview of their map focus and any selected locations, including data on disasters, vulnerability, movement, and health infrastructure. Users can personalize the report by removing sections or adding their own notes before saving or sharing it. The report combines cartographic visuals, tables, and small visualizations, giving users flexibility to create clear and effective presentations of the data.
