UX DESIGN
BeatHeat
A mobile app that locates nearby cooling centers and provides heat safety guidelines, emergency contacts, and community support features to help people stay cool and safe during extreme heat.
TOOLS
Figma, FigJam, Miro, Stark
MY ROLE
UX/UI Design, Research
TEAM
Aditya, Uma, Carly, So Young
TIMELINE
Oct 2023 - Dec 2023
Problem: Heat Island Effect
The urban heat island effect leads to higher temperatures in cities. This affects vulnerable populations, increases energy consumption, widens socio-economic disparities, and causes discomfort, illness, and even death.
People without AC in their homes struggle to find cool places during extreme heat, putting themselves, pets, and loved ones at risk of illness or death. People lack the resources and information they need to locate safe places to go.
BeatHeat app provides information and resources to prevent heat-related illnesses and deaths, addressing two of the United Nations Sustainable Development Goals. ​​​​​​​
User Research
We interviewed 12 people from the US, UK, and India who experienced extreme heat. They stressed the need for more assistance in locating nearby cooling centers and safety education resources.
​
My role: I interviewed three users—two from Los Angeles and one from the UK—who emphasized the need for resources on pet safety and finding cooling centers.
77% of the people we surveyed have felt a sense of helplessness during a heatwave.
Research Insights
1. People without AC in their homes struggle to find cool places during extreme heat.
2. Coping with a heat wave becomes challenging when juggling between different apps for temperature updates, cooling center locations, and safety tips.
3. It’s difficult for people to find the necessary information and resources to stay safe during a heat wave.
User Personas
Jasmine is a graduate student trying to manage the high cost of AC at home while staying cool during heatwaves. She prefers staying in campus buildings with AC but is concerned about her pet's safety. Her main challenge is finding pet-friendly, AC-equipped spaces and reliable resources to keep her pet safe in the heat.
My Role: I used insights from the users I interviewed to create a fictional persona that reflected user concerns about saving money, staying cool, and keeping their pets safe.
Ideate
After interviewing users, my team used FigJam to organize insights and identify key pain points. I recommended a whiteboard session for sketching and discussing solutions, and suggested increasing button and text size for better accessibility.
Site Map
User Flows
Heat Map/Cooling Locations
Storyboards
Big Picture Storyboard
I sketched a simple storyboard illustrating a user stuck at home during a heatwave, using the BeatHeat app to find a cool spot to work remotely, helping visualize the user's journey.
Close-up Storyboard
I sketched a close-up storyboard to detail how users might interact with the app, helping us visualize their navigation and generate ideas for improving the experience.
My sketches
My initial design sketches of how the app might look.
Low-Fidelity
Pet Care
Heat Safety
Menu
Heat Map/ Home Page
Emergency Contacts
Call 911
Emergency
Temperature Page
Grocery Checklist
Hydration Info
Language
Accessibility
Skin Care
Hi-Fidelity
I designed the main menu, heat safety, sun safety, pet care, selected location overlay, and the hydration page.
Prototype
Usability Test
After usability testing, we found that users struggled to find important information because of the dropdown style we had chosen. To improve navigation, we replaced the dropdown style with buttons that took users to a separate screen.