HOT ZONE
Mobile UI Design (Personal Project)



hz1

Role:

UI/UX Designer

Tools:

Figma, Photoshop

The Problem:

Every year wildfires throughout the world are increasing in size and numbers due to the effects of rising temperatures from climate change so people need tools that can help them fight back against the dangers of wildfires.   pencilbacktotopicon

The Solution:

People carry their mobile devices everywhere, so what better way to keep people constantly informed about wildfires than by a mobile app. I designed the mobile app Hot Zone as a tool that people can always have on hand to help them navigate the evolving dangers of wildfires by providing a platform that provides up-to-date information on factors that contribute to wildfires such as current weather conditions, tracks and receives notification warnings about wildfires in their area and is a source of wildfire information to educate and prepare them for wildfires so that they can protect their loved ones and property.   pencilbacktotopicon
hz2
hz3
hz4
hz5
hz6
hz9
hz10

Inform and Educate:

The more educated someone is about a topic the more likely they are to be calm instead of scared, stressed or intimidated especially about natural disasters. Wildfires and climate change are complicated and terrifying subjects which is the reason why I designed pages on the app that inform users about the different causes and conditions of wildfires.   pencilbacktotopicon

hz11
hz12
hz13

Be Prepared:

To improve user engagement I designed a wildfire preparedness page. Users can create and edit their own Family Emergency Plan that is saved for future and this also encourages the user to keep the app installed in case they ever need to take out the app to review or put to use their Family Emergency Plan.   pencilbacktotopicon

hz14
hz15

The Process:

People from all walks of life were interviewed and asked questions related to wildfires such as what concerns them about wildfires, what tools they think can help them before and after a wildfire disaster, what they need to keep their family and property safe and what type of information they would like to see about wildfires. These interviews help me determine what kind of content to include in the Hot Zone app during development.

Tracking current wildfires was one of the most requested features so that feature is placed at the very start of the app. After you open the app you're shown a page that lists current wildfires automatically sorted by newest to oldest and the user is given more options to further filter the list. Another highly requested feature is how to prepare for wildfires. A preparedness page contains information such as a checklist and  a how to build an emergency Go Kit guide. After selecting how to build a Go Kit the guide utilizes an onboarding slide like style that shows a single step so the user is not overwhelmed with too much information and they can proceed to the next step when they're ready giving them a sense of control.   pencilbacktotopicon

designprocess


hotzoneuiwireframes


hotzoneuielements


hotzoneuiflowchart

The Outcome:

The rising threat of climate change grows each year as do the numbers and size of wildfires. It is vital to have a tool on hand with you at all times that can assist you through a wildfire disaster and keep you up-to-date on all the wildfire news. Hot Zone succeeds in being your virtual tool of choice for wildfires because of the large number of useful features it provides.   pencilbacktotopicon

Click here to experience the prototype version of the app.