Events Encapsulated

Start of quiz
Our short quiz to test the kids knowledge on COVID-19
Start of diagnosis
Simple questions that then guide the child to performing the appropriate procedure
Our design template

Inspiration

Our team wanted to do something focused on the health stream and after scouring the internet for ideas we realized that there is not a lot of information about the pandemic dedicated to children. Most sites have information that would be too difficult for an average child to digest so we have tried to condense the information hence our name Events Encapsulated.

What it does

Events Encapsulated is a website that aims to help children gain a better understanding of Covid-19. By conveying the information in a more child-friendly way, the children are able to retain more knowledge about Covid-19. This is done through a short informative section on all aspects of Covid-19, and a short quiz that stimulates active recall in the children, strengthening their knowledge about Covid-19.

How we built it

We used a variety of technologies to build this app. Firstly, we used Figma to develop a prototype of the app UI. Then, we moved on to coding the app. We used HTML, CSS, Bootstrap, JavaScript, React, and Node.js to build our web app.

Challenges we ran into

It was our first time dealing with React so we struggled to implement it into our site. However, after attending some workshops and reading documentation we managed to include a quiz and self-diagnosis section. Additionally, we found that it was really difficult to make the actual website look like the prototype in Figma, so we had to make some changes there.

Accomplishments that we're proud of

We were able to learn many new things during the hackathon. We learned more about web development with frameworks such as React and node.js, alongside learning how to center a div :> We're proud of our website and all that we could do, and had a great time doing so, creating many great memories!

What we learned

We learned how to center a div :>

Jokes aside, we learned many things. Most of our team wasn't very experienced with developing web apps, and it was a bit hard to get started. Additionally, the majority of our team never used React before so it was quite frustrating at first. One of our team members learned to use the parallax effect in CSS for our background, so it was quite a new experience.

What's next for Events Encapsulated

We wish to include more pages that simplify events in hopes of educating children about what is going on around them. As Events Encapsulated grows further, we aim to make more articles talking about other current events.