Inspiration
According to a report from the United Nations Office for Disaster Risk Reduction and the World Meteorological Organization, half of the countries globally are not prepared for disasters. This is extremely concerning. Disasters such as earthquakes, floods, and fire eruptions have marked human existence throughout history and have always caused peaks in mortality and morbidity. They cause even more damage when people are not prepared and do not have emergency plans. A lack of preparedness for disasters could be fatal and it is immensely important that as many people as possible are educated on disaster preparedness. Although resources related to disaster education are accessible on the internet, many are complicated, technical, difficult to understand, and lack user-friendly interfaces. Additionally, no all-in-one tool exists through which users may learn about preparedness for disasters, take quizzes to test their knowledge, access a toolkit to prepare for disasters, track disasters worldwide, and more, all at the same time. This inspired me to create “BeResilient”, an educational enterprise that centralizes essential resources for disaster preparedness in one convenient website. “BeResilient” offers a simple and convenient way for users to quickly stay informed and safe.
What it does
BeResilient is a web application that will aid users in learning about disasters and how to prepare for them. It will ensure that users are provided with adequate information and equip them with the knowledge, skills, and mindset they need to have to face emergencies with resilience and strength. It consists of 6 main features: 1- Animations that educate users on different types of disasters and how they occur. It allows users to acquire important general knowledge through an interactive interface, engaging visuals and informative content. 2- Interactive quizzes consisting of questions related to general knowledge regarding disasters, as well as actions one should take in case of an emergency. They are either story-based or fact based, and keep the user engaged either way due to their captivating nature thus making them very beneficial for educational purposes. 3- A disaster preparedness toolkit, which offers users all the necessary tools to prepare for disasters. It includes a planner for creating an emergency plan, a checklist of essential items to keep on hand, tips on preparedness, and much more. The disaster preparedness toolkit plays a crucial role in preparing users for emergencies. 4- Disaster trackers that enable users to detect disasters such as storms, wildfires, and volcanic eruptions. This feature is highly beneficial, as it helps users become aware of any potential disasters in their vicinity and take the necessary measures to prevent them or prepare for them. 5- Disaster managers that allow users to locate the nearest place that can help them out in emergencies, such as fire stations, police stations, etc. This feature would prove to be extremely helpful in emergencies and it would facilitate users in getting help fast. 6- A 3D game that consists of multiple realistic disaster scenarios and teaches users how to deal with them resiliently. Through this game, users can work on their evacuation ability, emergency responsive skills, and cognitive skills.
How we built it:
1- The Website: The professional, responsive, and functional design of BeResilient is based on a Webflow template which was then edited in various ways to serve different requirements. Its design is based on HTML, CSS, and JavaScript. 2- Animations: The animations were created using Canva. I referred to the website of WHO (World Health Organization) and Wikipedia to gather information about disasters, and then, utilizing my animating skills, created short, educational, and fun animations that could be watched by people of any age and background to learn all about disaster preparedness. 3- Quizzes: The interactive quizzes were made using QuizMaker, and then embedded into the app. 4- Toolkit: The toolkit was designed using Canva templates and elements. I utilized my graphic designing skills to create visually pleasing and easily understandable worksheets and templates that could be used by anyone to ensure preparation for disasters. 5- Disaster Trackers: The open space API that enables me to add this feature into BeResilient is NASA's open API which uses sources such as Copernicus for its data. This API can locate many types of disasters such as floods, avalanches, landslides, storms, droughts, extreme temperatures, and more. 6- Disaster Managers: This feature uses Google Maps JavaScript API and also uses Google's satellite imagery in order to serve its function, which is to locate places such as fire stations and police stations within the user’s vicinity. 7- Emergency Drill Game: The system framework of the safety drill game was first designed in the Core game engine for mockup purposes, after which the actual 3D game was developed on the Unity game engine. Thus, a convenient and accessible game was developed covering a wide variety of disaster scenarios (fires, tsunamis, earthquakes, etc.), along with provided step-by-step instructions.
What we learned
I have learned quite a lot while working on this project, including different types of new skills. I became more adept at creating applications with Webflow, improved my ux/ui design and graphc design skills, and also learned game development.
What's next for BeResilient
Although the BeResilient 3D game has been developed, it has not yet been published as it requires some improvements but I hope to release it in the future so that everyone may benefit fromt it by learning about disaster preparedness and increasing their resilience.
Log in or sign up for Devpost to join the conversation.