SlideShare a Scribd company logo
Towards Cartographic
Standards for Web-Based
Flood Hazard Maps
ICON Engineering, Inc. & University of Colorado, Boulder
Who We Are
Eben Dennis
ICON Engineering, GIS Coordinator
Civil Engineering firm
FEMA Mapping Partner
Primarily Public Sector projects (UDFCD,
Boulder, Denver, Greeley, Ft Collins)
Certified Floodplain Managers
UC Denver Geography Program Graduate
Robert Soden
University of Colorado, Boulder, PhD Student
Co-Risk Labs, Principal
California-based research and design
company
Previous Background
World Bank Global Facility for Disaster
Reduction and Recovery
Why Are We Doing This?
Web-based flood maps and web-based maps in general are mostly garbage.
The tendency to create a GIS in the browser is a massive pitfall for both the
public and experts attempting to utilize these applications.
Web-based mapping is still a relatively new field, and cartographic/design
standards are not widespread if they exist at all.
These applications have clear potential, but the design standards still need to
be developed to provide best practices for effective communication and end-
user suitability.
User Centered Design
Specify the context of use: Identify the people who will use the product,
what they will use it for, and under what conditions they will use it.
Specify requirements: Identify any business requirements or user goals
that must be met for the product to be successful.
Create design solutions: This part of the process may be done in
stages, building from a rough concept to a complete design.
Evaluate designs: Evaluation - ideally through usability testing with
actual users - is as integral as quality testing is to good software
development.
From usability.gov
Why Web-Based Flood Hazard Maps?
The ability to distribute and communicate flood maps in an effective and wide-
reaching manner enables its use in all phases of the risk cycle, from planning
and mitigation to response and recovery.
The barrier to access for both developers and end-users is becoming lower and
lower with each new iteration of web-mapping products.
Previous Research - Public Facing
Typical Problems:
“Map portals over-focus on the the map, under-
focus on text-based search and discovery”
Providing multiple data layers in a web-map
application decreases usability for most of the
audience
Solutions:
Treat your data more like a search engine,
include auto-complete, make it obvious.
Focused, single-topic applications; accomodate
the small number of power users by making
data available for download; provide custom
basemaps with some data already built in.
Previous Research - Public Facing
Timoney’s Four Requirements of a Web Application:
FAST, INTUITIVE, INFORMATIVE, FAST
Many tools included in out-of-the-box web applications look and act like a desktop
GIS, which is great if you’re a trained GIS user, not so much for the other 98% of
your audience.
If you want a layer to contain information on a click, why would you make a user
click on an ‘Info’ button first?
Previous Research
Roth & Cartographic Interaction
“How maps are manipulated by the
map user”
Contrasts with the classic
Communication Model
Map & user influence each other
Speed of application can affect
productivity and focus
Interviews
Conducted interviews with floodplain engineers, clients, and end users to help
determine the utility of the applications.
Two audiences were identified:
Public - typical homeowner, wants to know if they are in the floodplain
Expert - engineers and clients utilizing maps as a data immersion tool
Decisions made with this application will potentially affect the public user
Methodology
Competitor Analysis
Analyzed 25 different flood mapping sites
Nearly all government owned/operated
What interaction operations are supported?
How is flood risk represented?
Clear Statement of Purpose
Clear Branding/Ownership
Disclaimers
Address Lookup
Dictionary/Links to Further Info
Guidance for Property in the Floodplain
Base Map Options
Competitor Analysis
Almost everyone using ESRI stacks
Good news is that most sites had address lookups
Bad news is that almost none of the sites tell you what to do if, in fact, your
home is in the floodplain.
Who do I actually talk to about buying it? What if my house is elevated? What
the heck is an elevation certificate? These are all important pieces of
information that users want to know in this context.
Competitor Analysis
Competitor
Analysis
GIS on the internet
Too many buttons that have no
intuitive meaning to non-GIS
users
No clear purpose
Slow load times, near impossible
to keep user interest
Competitor
Analysis
Single purpose application
Limited interactions
Plenty of opportunity for self-
directed learning by users
Not too text heavy, but does a
good job of providing links to
users who are interested in
learning more
Walkthrough
Created web-map application for a public
audience
Single purpose of the application is to identify
flood hazards in Boulder, CO
Built on Mapbox GL and Turf.js (fast!)
Consists of search bar, map panel, info panel,
small legend
Limited interactions
Statement of purpose is given up front in the
info panel
Flood information is provided for users in and
out of the floodplain
Additional flooding information is provided in a
custom basemap
Had public users think aloud while they used the
application
Walkthrough
Walkthrough - Findings
People used the search bar, overwhelmingly - though some were confused by
autocomplete.
Almost as overwhelmingly, they don’t read text
Simple, actionable instructions - what is the key information the public needs at
each stage of the project?
Walkthrough - Findings
The NFIP 100-year floodplain presents a limited portrayals of flood hazard.
People were genuinely surprised when they realized that areas outside the
floodplain were affected by the 2013 Colorado floods.
In making these sites simple to use, we need to be careful to not convey
simplistic understanding of science - when we added the 2013 flood footprint
and it created just enough dissonance for people to get engaged and start
asking interesting questions
Survey
For the expert audience, we utilized two existing applications built by ICON
Engineering.
All of the questions on the survey were open-ended, with the exception of
difficulty ratings, in order to better simulate a real-world decision making
process.
The audience is wholly comprised of CASFM YMG members, so the
expectation is they will be comfortable with web-map applications and have the
ability to accurately answer technical questions.
Survey Application 1
Survey -
Application 1
Too many clickable elements
Alternatives aren’t easily
distinguished
Flow direction arrows extremely
useful
Speed, clickable information,
layer toggles? All good things.
Missing statement of purpose,
lacking instructions, more
description needed for layers
Survey Application 2
Survey -
Application 2
Transparency on transparency
isn’t the most effective
Layer switching not as intuitive
as toggles/checkboxes
Speed? Still a good thing.
Needs a better description of
what each layer represents
When multiple elements are
clickable, more clarity for what
layer fired the popup
Next Steps
Next Steps
Better in-page analytics
Click tracking
Time spent on page
More data!
Gather more user feedback on the
two expert systems
Iterate!
Questions?
Slides available at ebendennis.github.io/notes

More Related Content

PPTX
Towards Cartographic Standards for Web-Based Flood Hazard Maps
PPTX
Mobile App Design and Development Best Practices for Senior Demographics and ...
PPTX
App Convenience
PDF
Mobile App Design Global Trends
PPT
Bringing the Audience Back to NASA, Brian Dunbar / Forum One Communications W...
PPTX
Nokia Presentation
PDF
Mobile where it Matters - A Strategic Approach to Digital Ecosystems
PPTX
Location based services: What you need to know
Towards Cartographic Standards for Web-Based Flood Hazard Maps
Mobile App Design and Development Best Practices for Senior Demographics and ...
App Convenience
Mobile App Design Global Trends
Bringing the Audience Back to NASA, Brian Dunbar / Forum One Communications W...
Nokia Presentation
Mobile where it Matters - A Strategic Approach to Digital Ecosystems
Location based services: What you need to know

Viewers also liked (16)

PDF
Floodplain Modelling Materials and Methodology
PDF
Mapping social vulnerability to flood hazard in Norfolk%2C England
PPTX
005 Mapping and modelling climate change impacts, vulnerable features and com...
PDF
Hanson.GIS.DHS_FinalReport.Revised.04.20.2016 (1)
PDF
ICLR Friday Forum: National floodplain mapping framework (Oct 10, 2014)
PPTX
Flood hazard mapping four provinces of cambodia
PDF
Estimation of surface runoff in nallur amanikere watershed using scs cn method
PDF
Preparation of Web Mapping Application of Balephi-B Hydropower Project
PPT
Web Mapping
PPTX
Web mapping
PPTX
Analysis of runoff for vishwamitri river watershed using scs cn method and ge...
PPT
A Brief History of Web Mapping
PDF
Report on flood hazard model
PPT
Change Management
PPTX
Change management
PPTX
Change Management PPT Slides
Floodplain Modelling Materials and Methodology
Mapping social vulnerability to flood hazard in Norfolk%2C England
005 Mapping and modelling climate change impacts, vulnerable features and com...
Hanson.GIS.DHS_FinalReport.Revised.04.20.2016 (1)
ICLR Friday Forum: National floodplain mapping framework (Oct 10, 2014)
Flood hazard mapping four provinces of cambodia
Estimation of surface runoff in nallur amanikere watershed using scs cn method
Preparation of Web Mapping Application of Balephi-B Hydropower Project
Web Mapping
Web mapping
Analysis of runoff for vishwamitri river watershed using scs cn method and ge...
A Brief History of Web Mapping
Report on flood hazard model
Change Management
Change management
Change Management PPT Slides
Ad

Similar to 2016 web mapping track: towards cartographic standards for web based flood hazard maps by eben dennis and robert soden (20)

PPT
UGIC 2009 Conference
PPTX
Developing Efficient Web-based GIS Applications
PDF
OpenStreetMap Past, Present and Future
PPTX
AGI Cymru 2013 - Perspectives from Above - Getmapping PLC
PDF
ArcGIS
PDF
Hawaii Pacific GIS Conference 2012: Application Development - Using a Map App...
PDF
Hawaii Pacific GIS Conference 2012: Application Development - Using a Map App...
PPTX
What Would Steve Jobs Think About the State of GIS Mapping Applications in th...
PDF
What's new with OpenStreetMap
PDF
GI2010 symposium-koskova+charvat (flood)
PPT
Usability Engineering For OSM - SOTM 2007
PPSX
Interface by Audience
PDF
We are the music makers and we are the dreamers of dreams
PPTX
Intro to Internet Mapping (epan 2011)
PDF
Evaluating map design of ecosystem services models - NACIS 2017
PDF
A Web-Based, Federated, Marine Use Management System for Small Communities
PDF
Web and Mobile Mapping Application for Flood Information Service : A Case Stu...
PPT
BCS Geospatial SG - Usability of GIS and GI
UGIC 2009 Conference
Developing Efficient Web-based GIS Applications
OpenStreetMap Past, Present and Future
AGI Cymru 2013 - Perspectives from Above - Getmapping PLC
ArcGIS
Hawaii Pacific GIS Conference 2012: Application Development - Using a Map App...
Hawaii Pacific GIS Conference 2012: Application Development - Using a Map App...
What Would Steve Jobs Think About the State of GIS Mapping Applications in th...
What's new with OpenStreetMap
GI2010 symposium-koskova+charvat (flood)
Usability Engineering For OSM - SOTM 2007
Interface by Audience
We are the music makers and we are the dreamers of dreams
Intro to Internet Mapping (epan 2011)
Evaluating map design of ecosystem services models - NACIS 2017
A Web-Based, Federated, Marine Use Management System for Small Communities
Web and Mobile Mapping Application for Flood Information Service : A Case Stu...
BCS Geospatial SG - Usability of GIS and GI
Ad

More from GIS in the Rockies (20)

PPTX
GISCO Fall 2018: Bike Network Equity: A GIS and Qualitative Analysis of Ameri...
PPTX
GISCO Fall 2018: Colorado 811: Changes and Challenges – Brian Collison
PPTX
GISCO Fall 2018: Senate Bill 18-167 and GIS – Dave Murray
PDF
2018 GIS in the Rockies Workshop: Coordinate Systems and Projections
PDF
2018 GIS in Emergency Management: Denver Office of Emergency Management Overview
PDF
2018 GIS in the Rockies Vendor Showcase (Th): The Data Driven Government
PDF
2018 GIS in the Rockies Vendor Showcase (Th): Solving Real World Issues With ...
PDF
2018 GIS in the Rockies Vendor Showcase (Th): ERDAS Imagine What's New and Ti...
PDF
2018 GIS in the Rockies Vendor Showcase (Th): Building High Performance Gover...
PDF
2018 GIS in Recreation: The Making of a Trail
PDF
2018 GIS in Recreation: The Latest Trail Technology Crowdsourcing Maps and Apps
PDF
2018 GIS in the Rockies: Riparian Shrub Assessment of the Mancos River Canyon...
PDF
2018 GIS in Development: Partnerships Lead to Additional Recreational Content...
PDF
2018 GIS in Recreation: Adding Value to Colorado the Beautiful Initiative carr
PDF
2018 GIS in Recreation: A Creek Runs Through It
PDF
2018 GIS in Recreation: Virtually Touring the National Trails
PDF
2018 GIS in the Rockies PLSC Track: Turning Towards the Future
PDF
2018 GIS in the Rockies PLSC: Intro to PLSS
PDF
2018 GIS in the Rockies PLSC Track: Grid to Ground NATRF2022
PDF
2018 GIS in Development: USGS and Citizen Science Success and Enhancements fo...
GISCO Fall 2018: Bike Network Equity: A GIS and Qualitative Analysis of Ameri...
GISCO Fall 2018: Colorado 811: Changes and Challenges – Brian Collison
GISCO Fall 2018: Senate Bill 18-167 and GIS – Dave Murray
2018 GIS in the Rockies Workshop: Coordinate Systems and Projections
2018 GIS in Emergency Management: Denver Office of Emergency Management Overview
2018 GIS in the Rockies Vendor Showcase (Th): The Data Driven Government
2018 GIS in the Rockies Vendor Showcase (Th): Solving Real World Issues With ...
2018 GIS in the Rockies Vendor Showcase (Th): ERDAS Imagine What's New and Ti...
2018 GIS in the Rockies Vendor Showcase (Th): Building High Performance Gover...
2018 GIS in Recreation: The Making of a Trail
2018 GIS in Recreation: The Latest Trail Technology Crowdsourcing Maps and Apps
2018 GIS in the Rockies: Riparian Shrub Assessment of the Mancos River Canyon...
2018 GIS in Development: Partnerships Lead to Additional Recreational Content...
2018 GIS in Recreation: Adding Value to Colorado the Beautiful Initiative carr
2018 GIS in Recreation: A Creek Runs Through It
2018 GIS in Recreation: Virtually Touring the National Trails
2018 GIS in the Rockies PLSC Track: Turning Towards the Future
2018 GIS in the Rockies PLSC: Intro to PLSS
2018 GIS in the Rockies PLSC Track: Grid to Ground NATRF2022
2018 GIS in Development: USGS and Citizen Science Success and Enhancements fo...

Recently uploaded (20)

PDF
Network Security Unit 5.pdf for BCA BBA.
PDF
[발표본] 너의 과제는 클라우드에 있어_KTDS_김동현_20250524.pdf
PPT
Teaching material agriculture food technology
PPT
“AI and Expert System Decision Support & Business Intelligence Systems”
PDF
Blue Purple Modern Animated Computer Science Presentation.pdf.pdf
PDF
Reach Out and Touch Someone: Haptics and Empathic Computing
PDF
solutions_manual_-_materials___processing_in_manufacturing__demargo_.pdf
PDF
Per capita expenditure prediction using model stacking based on satellite ima...
PDF
NewMind AI Weekly Chronicles - August'25 Week I
PDF
Empathic Computing: Creating Shared Understanding
PDF
NewMind AI Monthly Chronicles - July 2025
PPTX
breach-and-attack-simulation-cybersecurity-india-chennai-defenderrabbit-2025....
PDF
Build a system with the filesystem maintained by OSTree @ COSCUP 2025
PDF
Unlocking AI with Model Context Protocol (MCP)
PDF
Bridging biosciences and deep learning for revolutionary discoveries: a compr...
PDF
Approach and Philosophy of On baking technology
PDF
Machine learning based COVID-19 study performance prediction
PDF
The Rise and Fall of 3GPP – Time for a Sabbatical?
PDF
Optimiser vos workloads AI/ML sur Amazon EC2 et AWS Graviton
PDF
Spectral efficient network and resource selection model in 5G networks
Network Security Unit 5.pdf for BCA BBA.
[발표본] 너의 과제는 클라우드에 있어_KTDS_김동현_20250524.pdf
Teaching material agriculture food technology
“AI and Expert System Decision Support & Business Intelligence Systems”
Blue Purple Modern Animated Computer Science Presentation.pdf.pdf
Reach Out and Touch Someone: Haptics and Empathic Computing
solutions_manual_-_materials___processing_in_manufacturing__demargo_.pdf
Per capita expenditure prediction using model stacking based on satellite ima...
NewMind AI Weekly Chronicles - August'25 Week I
Empathic Computing: Creating Shared Understanding
NewMind AI Monthly Chronicles - July 2025
breach-and-attack-simulation-cybersecurity-india-chennai-defenderrabbit-2025....
Build a system with the filesystem maintained by OSTree @ COSCUP 2025
Unlocking AI with Model Context Protocol (MCP)
Bridging biosciences and deep learning for revolutionary discoveries: a compr...
Approach and Philosophy of On baking technology
Machine learning based COVID-19 study performance prediction
The Rise and Fall of 3GPP – Time for a Sabbatical?
Optimiser vos workloads AI/ML sur Amazon EC2 et AWS Graviton
Spectral efficient network and resource selection model in 5G networks

2016 web mapping track: towards cartographic standards for web based flood hazard maps by eben dennis and robert soden

  • 1. Towards Cartographic Standards for Web-Based Flood Hazard Maps ICON Engineering, Inc. & University of Colorado, Boulder
  • 2. Who We Are Eben Dennis ICON Engineering, GIS Coordinator Civil Engineering firm FEMA Mapping Partner Primarily Public Sector projects (UDFCD, Boulder, Denver, Greeley, Ft Collins) Certified Floodplain Managers UC Denver Geography Program Graduate Robert Soden University of Colorado, Boulder, PhD Student Co-Risk Labs, Principal California-based research and design company Previous Background World Bank Global Facility for Disaster Reduction and Recovery
  • 3. Why Are We Doing This? Web-based flood maps and web-based maps in general are mostly garbage. The tendency to create a GIS in the browser is a massive pitfall for both the public and experts attempting to utilize these applications. Web-based mapping is still a relatively new field, and cartographic/design standards are not widespread if they exist at all. These applications have clear potential, but the design standards still need to be developed to provide best practices for effective communication and end- user suitability.
  • 4. User Centered Design Specify the context of use: Identify the people who will use the product, what they will use it for, and under what conditions they will use it. Specify requirements: Identify any business requirements or user goals that must be met for the product to be successful. Create design solutions: This part of the process may be done in stages, building from a rough concept to a complete design. Evaluate designs: Evaluation - ideally through usability testing with actual users - is as integral as quality testing is to good software development. From usability.gov
  • 5. Why Web-Based Flood Hazard Maps? The ability to distribute and communicate flood maps in an effective and wide- reaching manner enables its use in all phases of the risk cycle, from planning and mitigation to response and recovery. The barrier to access for both developers and end-users is becoming lower and lower with each new iteration of web-mapping products.
  • 6. Previous Research - Public Facing Typical Problems: “Map portals over-focus on the the map, under- focus on text-based search and discovery” Providing multiple data layers in a web-map application decreases usability for most of the audience Solutions: Treat your data more like a search engine, include auto-complete, make it obvious. Focused, single-topic applications; accomodate the small number of power users by making data available for download; provide custom basemaps with some data already built in.
  • 7. Previous Research - Public Facing Timoney’s Four Requirements of a Web Application: FAST, INTUITIVE, INFORMATIVE, FAST Many tools included in out-of-the-box web applications look and act like a desktop GIS, which is great if you’re a trained GIS user, not so much for the other 98% of your audience. If you want a layer to contain information on a click, why would you make a user click on an ‘Info’ button first?
  • 8. Previous Research Roth & Cartographic Interaction “How maps are manipulated by the map user” Contrasts with the classic Communication Model Map & user influence each other Speed of application can affect productivity and focus
  • 9. Interviews Conducted interviews with floodplain engineers, clients, and end users to help determine the utility of the applications. Two audiences were identified: Public - typical homeowner, wants to know if they are in the floodplain Expert - engineers and clients utilizing maps as a data immersion tool Decisions made with this application will potentially affect the public user
  • 11. Competitor Analysis Analyzed 25 different flood mapping sites Nearly all government owned/operated What interaction operations are supported? How is flood risk represented? Clear Statement of Purpose Clear Branding/Ownership Disclaimers Address Lookup Dictionary/Links to Further Info Guidance for Property in the Floodplain Base Map Options
  • 12. Competitor Analysis Almost everyone using ESRI stacks Good news is that most sites had address lookups Bad news is that almost none of the sites tell you what to do if, in fact, your home is in the floodplain. Who do I actually talk to about buying it? What if my house is elevated? What the heck is an elevation certificate? These are all important pieces of information that users want to know in this context.
  • 14. Competitor Analysis GIS on the internet Too many buttons that have no intuitive meaning to non-GIS users No clear purpose Slow load times, near impossible to keep user interest
  • 15. Competitor Analysis Single purpose application Limited interactions Plenty of opportunity for self- directed learning by users Not too text heavy, but does a good job of providing links to users who are interested in learning more
  • 16. Walkthrough Created web-map application for a public audience Single purpose of the application is to identify flood hazards in Boulder, CO Built on Mapbox GL and Turf.js (fast!) Consists of search bar, map panel, info panel, small legend Limited interactions Statement of purpose is given up front in the info panel Flood information is provided for users in and out of the floodplain Additional flooding information is provided in a custom basemap Had public users think aloud while they used the application
  • 18. Walkthrough - Findings People used the search bar, overwhelmingly - though some were confused by autocomplete. Almost as overwhelmingly, they don’t read text Simple, actionable instructions - what is the key information the public needs at each stage of the project?
  • 19. Walkthrough - Findings The NFIP 100-year floodplain presents a limited portrayals of flood hazard. People were genuinely surprised when they realized that areas outside the floodplain were affected by the 2013 Colorado floods. In making these sites simple to use, we need to be careful to not convey simplistic understanding of science - when we added the 2013 flood footprint and it created just enough dissonance for people to get engaged and start asking interesting questions
  • 20. Survey For the expert audience, we utilized two existing applications built by ICON Engineering. All of the questions on the survey were open-ended, with the exception of difficulty ratings, in order to better simulate a real-world decision making process. The audience is wholly comprised of CASFM YMG members, so the expectation is they will be comfortable with web-map applications and have the ability to accurately answer technical questions.
  • 22. Survey - Application 1 Too many clickable elements Alternatives aren’t easily distinguished Flow direction arrows extremely useful Speed, clickable information, layer toggles? All good things. Missing statement of purpose, lacking instructions, more description needed for layers
  • 24. Survey - Application 2 Transparency on transparency isn’t the most effective Layer switching not as intuitive as toggles/checkboxes Speed? Still a good thing. Needs a better description of what each layer represents When multiple elements are clickable, more clarity for what layer fired the popup
  • 26. Next Steps Better in-page analytics Click tracking Time spent on page More data! Gather more user feedback on the two expert systems Iterate!
  • 27. Questions? Slides available at ebendennis.github.io/notes

Editor's Notes

  • #9: The gulf of execution describes the disconnect between the user’s objectives and the provided cartographic interaction operators. The gulf of evaluation describes the disconnect between what the user expected to accomplish through the cartographic interaction and the interface’s representation of the result of the cartographic interaction
  • #27: Finalize and write up the results of this study Gather user feedback on two expert systems once they are fully launched Better analytics - we need data