top of page

Keep Kids Fire Safe Foundation

K1.png

PROBLEM:

How can we redesign a nonprofit organization to give a strong message surrounding fire safety?


 

SOLUTION:

Make a kid's corner page to attract children, and provide the resources parents and teachers need to integrate a fire safety program

ROLE:

UX Researcher

UI Designer

Project Manager

TOOLS:

Miro

Figma

Trello

Google Suite

ZOOM

Adobe Illustrator

01. Research:

With the help of 3 other designers, a website brand audit was conducted to discover the strengths and weaknesses of the current layout.
 

Current website : https://www.keepkidsfiresafe.org

k3.png
k5.png
k2.png

Key takeaways

The contact page is broken. No contact option can be found through the entire website

Each page is short, but messy. 

In order to make a donation, users would need open a new page donate with PayPal

02. Stakeholder and User Interviews:

k9.png
k6.png

User interviews transcript 

Full stakeholder interview transcript 

Key takeaways

KKFSF wants a strong community engagement, and a fun platform for children from K-12 to find out the importance of fire safety.

They want more children to visit their website, but even better if they have a parent by their side.

They have a Dalmatian, Molly, as their mascot to attract multiple age groups.

Affinity Diagram

k12.png
k13.png

Persona

k14.png

03. Ideate

What I Like, What I Wish, What If Diagram

k17.png

Feature Prioritization Matrix

k18.png

Storyboard

k19.png

Style Tile

k20.png

04. Wireframing:

k4 1.png

About

Screen.png

Home

k6 2.png

Donate

Iterations of Home Page

k22.png
k23.png
k24.png
k25.png

05. Final Product

Try desktop prototype

Mar-31-2021 18-29-16.gif

Try mobile prototype

mobile.gif

Create a Kid's Corner page to attract children. They can play games and be educated about fire safety. However, the main users we are trying to target are educators, young adults with children and caretakers.

Use a subtle red because red can signals fire and alarm, which we did not want. However, we felt we had to implement a bit of red to our layouts because this is a non profit regarding fire protection

Remove the donate tab from the navigation bar, and add a donate paw icon as a fix position when scrolling.

Other case studies

Group 1215.png
Group 13952.png
Group 13922.png
Group 1391.png

An app for job hunting

Joblify

Government Agency

Montana State Parks

A social app for food lovers

Yum Yum

GET IN TOUCH

​

Johnuxui@gmail.com

​

      2025 John Nguyen

Made in San Francisco, CA

baseline_copyright_black_18dp.png

LET'S CONNECT

​

Group 1372.png
Group 1370.png
Group 1371.png
Group 1373.png
bottom of page