Our team was inspired to create the Covidmity website after witnessing the strength in our own communities during the Covid-19 pandemic. We wanted to spread that solidarity to other communities through creating a website with simple tips and checklists to help adults and children make better choices during this troubled time.

What it does

The tip randomizer allows users to click a button for randomly generated tips(relating to Covid-19) for 4 different categories. They were “Helping Your Kids with Online Classes”, “Dealing with Teenagers' Concerns”, “Easing Your Child's Anxiety about Covid-19”, and “Self Care Tips.” With each randomly generated paragraph comes its partner image. The COVID Resource guide allows users to input the number of family members they have and accordingly be given the quantity needed for 3 necessities. Additionally, the web app sits on your desktop and be clicks at any time of the day to pull the best and most reliable news. After entering your personal info the app can either get you the best stocks of the day and the best coronavirus updates. It's simple UI and easy to use features are what makes it stand apart from the rest.

How we built it

The website aesthetic was built using HTML, CSS, and Javascript. The background images were from Videezy, a site that offers backgrounds that have the license of free to use. The logic behind the randomizer involved Javascript. For each of the 4 categories, we stored the tips into 4 variables, created 4 corresponding images that were also stored, and then put them into 2 separate lists. Using math. random we generated random selections and displayed them. For the resource guide, we designed the table and used Javascript to take the user input and translate it into a result on the table. The web app was built using Kivy, a python library for web app development after I laid out the framework for the app I used a separate function to hold the financial news and used a personal Robinhood account to get relevant information from the robin_stocks API. After this, the was created using the NewsAPI and then the parameters for the news were tweaked to get the best and most relevant news; we had to whittle down over 300k headlines. Eventually, the classes were put together and a Grid class for UI purposes contained all the relevant event triggers.

Challenges we ran into

Initially, we planned to have one randomizer button on the homepage, and when the user clicked on it, they would be directed to a page with the same title as the random button text. That was impossible to do at the time, so we changed the project to have a randomizer for each of the 4 categories. In addition, this was our first time using moving background images, so it was a struggle to get all the other elements to display in their proper places. For the web app, the hardest part was perfecting the UI, which is something we were very new too. Eventually, however, we were able to learn from the documentation.

Accomplishments that we're proud of

We are very proud of how the design turned out. The moving background images especially were the icing on the cake, as well as the consistent style between pages. We are also happy that the randomizer works perfectly! The web app was something new for our team and we are happy we were able to complete it so well in such a short time frame.

What we learned

We learned through designing the website how to randomize items in Javascript as well as utilizing movable background images smoothly in HTML files. We also learned a lot about the Kivy python library for making web apps.

What's next for Covidmity

What’s next for the covidmity website is to include more information in the randomizer, and include a general login/signup. The site would also include a price/store database in the resource guide for the user to find desired products most efficiently and to frequently display products the user needs based on their profile. We also want to clean up the UI for the web app to make it more visually appealing.

Built With

Share this project: