Bringing Earthquake Early Warning to the Public
February - October 2020
UX Designer, Visual Designer
A mobile app focused on providing Earthquake Early Warnings and general preparedness information for Washington and Oregon.
ShakeAlert, an Earthquake Early Warning technology, was developed by the USGS, in partnership with the UW, UO, Caltech, and UC Berkley. This technology detects the initial P-waves of an earthquake and quickly determines the location and intensity of the earthquake providing seconds to minutes of warning before the damaging S-waves arrive.
ShakeAlert provides the alert but does not provide a vehicle with which to deliver the alert to the public. Current government text alerts, like Amber Alerts, take too much time to deliver, and infrastructural alerts like tsunami sirens take time to develop and build.
At the time of designing 2 weeks ready, three earthquake early warning mobile apps had been published for CA. I viewed these three apps to learn what information they provide the user. One complication that arose while analyzing these apps was that I am unable to receive alerts since I am not located in CA.
Two of the apps (MyShake and QuakeAlert) use hamburger menu navigation while the third app (ShakeAlertLA) has both bottom navigation and tiles on the homepage which contain two different options.
Hamburger menu navigation obscures options and makes it harder to move through the app. Bottom navigation is used by most mainstream apps and is easy to access. However, if there exists a secondary navigation structure, like the tiles on the homepage, that contain alternative options, the navigation becomes confusing.
All three apps used a set of screens that users have to swipe through as an onboarding process. It is easy for users to skip through these screens without reading the available text.
All three apps contain preparedness information focused on earthquakes. There are varying amounts of preparedness information in each app. MyShake focuses on all stages (before, during, and after an earthquake), ShakeAlertLA has all stages as well as various tools for preparing before, and QuakeAlert only has information about what to do during.
These three apps do not have extensive preparedness sections that focus on multiple hazards, so I looked at two other apps dedicated to emergency preparedness.
Both apps contain a way to document your emergency plan. The Putnam County app has an entire “My Plan” section that starts with five questions that document the adults, children, and pets in the user’s household, out of area contacts, and emergency contacts. It then walks the user through some other emergency preparations like compiling emergency kits, creating go-bags, and preparing your home. It also contains walkthroughs for various hazards like hurricanes, floods, and wildfires. The FEMA app has a much smaller section that focuses only on emergency meeting places. Both apps use text to designate emergency meeting areas.
Both apps contain some sort of emergency kit list with suggested supplies and the ability to check off items the user has obtained. The Putnam County app’s emergency kit list is customized based on how many adults, children, and pets live in the household, as reported by the user in the emergency plan section.
The Putnam County app focuses on a small area (a county in Florida) and highlights hazards that are relevant for that area. The FEMA app allows users to access information about all sorts of hazards but has a section where users can enter their zipcode to see what hazards are more likely to affect their area.
Both apps have a confusing navigation structure with Putnam County having three different navigation options that only show up on certain screens (homepage tiles, bottom navigation, and hamburger menu), and FEMA having navigation only on the homepage (dropdown menu) forcing users to tap back multiple times or tap the FEMA logo to return to other pages.
So how does ShakeAlert work? ShakeAlert uses seismic stations throughout Washington (WA), Oregon (OR), and California (CA) to detect the initial P-waves of an earthquake. The P-waves travel quickly through the earth and generally do not produce damage. The stations are constantly sending data to a central location. Once ShakeAlert identifies the P-wave, it calculates an epicenter location and magnitude in a matter of seconds. It then calculates the intensity of shaking at a given location and is able to issue an alert for when the damaging and slower S-wave will reach the given location.
Two Weeks Ready is being built specifically for the pacific northwest (WA and OR). The frequency of earthquakes plays a role in the type of app we want to develop. While the pacific northwest experiences over 1000 earthquakes >M1 each year, of these about 25 are large enough to be felt by humans, and there have been about 25 earthquakes since 1872 that have produced damage.
The WA Emergency Management Department had started working on the content for the app. I was brought in after ideas for the app had been proposed and preparedness content had started being developed.
It’s easy to forget that earthquakes pose a real danger to the pacific northwest when so few earthquakes are felt widely and produce damage. Thus, folks in WA Emergency Management were worried that users would delete the app when not many earthquakes triggered alerts. This prompted the idea to add a preparedness section that includes information about different hazards, emergency kits, and home hazards. It also includes an area to create an emergency plan.
I created an information architecture diagram for review. This helped illustrate the structure of the app and allowed for folks to provide useful feedback on the organization and content of the app.
Then I worked on creating wireframes of the screens. This portion consisted of three separate reviews and revisions with stakeholders. The revisions consisted of adding sections and content like location and user guide sections within the settings and further capabilities for the preparedness calculator.
I started creating high fidelity screens by deciding on colors and creating logo options. Color options were taken from Washington EMD’s current two weeks ready color scheme found via two weeks ready documents.
The name of the app was decided before I became a part of the project. During logo ideation, I focused on the earthquake aspect of the app rather than the preparedness aspect. The name “Two Weeks Ready” already communicates the preparedness aspect and does not communicate the earthquake early warning aspect.
After knowing the general logo design of the app, I knew what “vibe” I wanted the app design itself to evoke.
This is a current project and will be updated as it progresses.
Working on this project across organizations was a new experience. I wasn’t able to quickly receive feedback as I was developing wireframes and logo ideas, and progress was slow as the WA Emergency Department became occupied with Covid-19 response. Meetings were set up with these folks about every month, but feedback via email was negligible. In the future, having concrete questions about the design may help guide feedback. Another set back was that most ideation, in terms of what sections the app would have, the name, and general content ideas, had already been completed before I joined the project. This meant I had to get brought up to speed with their vision, and it was harder to challenge any ideas that would result in a badly designed app. There was also no research conducted with users prior to this ideation so I conducted competitive analysis. There is also a plan to conduct usability studies with users after the app has started development.
During this project I wasn’t working directly with developers, I was working with stakeholders that developed the content. This was a new experience knowing that developers will eventually look at my wireframes and work from them.
Overall I was excited to work on this project, knowing that this app has the possibility of saving lives through earthquake early warning and helping folks get prepared.