## Inspiration

In the past 20 years, there has been a steady increase in rate of a number of sexually transmitted and blood-borne infections (STBBIs). The *Public Health Agency of Canada* has declared STBBIs **“a significant public health concern”** and they are disproportionately affecting two-spirit, lesbian, gay, bisexual, transgender, queer or questioning and additional sexual identities (2SLGBTQ+) communities. Stigma and discrimination against marginalized groups complicate existing barriers and increase inaccessibility to prevention. Concomitantly, online content by health agencies are often dry, tedious and neglect unique risk profile of individuals. In response, we aspire to design a platform that raises awareness of sexual health while cultivates a **safe, confidential** environment where everyone can access STBBI prevention options at **zero** cost.

## What it does

We aim to build an **evidence-based, user-centred** website that evaluates risk based on a user’s sexual behaviour, demographic, and socioeconomic variables. The test consists of two chains, one calculating scores from weighting the user's risky behaviours and demographical traits; the other assigning the **most accessible** (affordable and effective) prevention options corresponding to a user's risk profile and socioeconomic status.

## How we built it

We first used JavaScript, html, and css (bootstrap) to implement the test algorithm and design of the website. Then, we drafted the logo using Figma. Finally, to make sure our test is science-guided, we did extensive literature review on *PubMed* concerning STBBI risk factors and prevention options.

## Challenges we ran into

Neither of the two of us was from computing background and we stuck a lot. We also found ourselves hesitant when assigning weights to and across questions.

## Accomplishments that we're proud of

We learnt a lot in an entirely different field, which reminds us of the importance of interdisciplinary collaborations and exposure to a diverse school of thoughts.

## What we learned

The best offence is defence. Making sure we understand the algorithms from the beginning is the best way to avoid making mistake.

## What's next for Wholesome

We hope to dive more into the risk factors and optimize the prevention suggestions we provide to users.
## Inspiration

As 3 girls who have personal experience with negative stereotypes surrounding women's health, we wanted to create a site that would help women easily find the health products they need. Through an anonymous website that conveniently compiles the top products for many different issues, we hoped to reduce female users' stress in caring for their health.

## What it does

The main html page consists of relevant categories of women's health products (acne, painkillers, hygiene, supplements, and birth control). These labels are all placed on buttons that link to another html page, which contains some recommended products in the desired category. By clicking on a product, the site displays important information about that product, such as its approximate price, advantages, disadvantages, and a link to purchase the product. Since the three of us are from the GTA, we incorporated a page that marks women's health clinics in the GTA on google maps.

## How we built it

The user interface was created with HTML, and bootstrap CSS and SCSS. We aimed to format our UI so that it would be scalable across different screen sizes (including phones). Also, we tried to make our website very reactive (ex. changing button colours on hover), so that the user would be encouraged to continue navigating the site.

We set up a database in firebase with collections for each product category. Each collection contains documents representing individual products. Using JavaScript, we set the table on our product display page to dynamically populate with entries from the database. This would ensure the scalability of this product table, since it would populate correctly no matter how many entries we added or deleted in the database. When the user clicks on a product, the name of the product is used to query the rest of the product's information, which is immediately displayed.

We also used firebase to store a collection of women's health clinics. With the Google Maps API, we added markers to a map of the GTA, adding info windows to display the name and address of the clinics on click.

## Challenges we ran into

It was difficult to ensure both a lot of data and the reliability of the data since this was very time-consuming. Thus, we did more thorough research on fewer products and included only those in our database. In the future, more products could definitely be added to give the user more options.

Also, we ran into challenges with detecting the user's location on google maps and using that location to search nearby health clinics. Since we were on a time constraint and had never used this API previously, we decided to simplify this feature to only display clinics in the GTA.

As a first time user of bootstrap, we took on the difficult task of trying to modify the default bootstrap style attributes with SCSS. We tried to follow online tutorials for setting up SASS on our computers, however, because SASS has gone through many changes since May 2019, the tutorials were not up to date. Luckily, we were able to find the modifications of the updates after extended research through SASS's official website.

## Accomplishments that we're proud of

During this hackathon, we explored many technologies with which we were previously unfamiliar. None of us had used firebase, bootstrap, nor Google Maps. However, we persevered relentlessly and ended up implementing all of these tools in our project!

## What we learned

Throughout this hackathon, we have learned about many things, in particular, Google Cloud and Bootstrap implementation. Firstly, we used Google's Firebase as the database for our website, which was a lot more intuitive than SQL. We were also able to create an interactive map element using the Google Maps API that was kindly sponsored by MLH. For UI/UX, it was our first time using Bootstrap to assist with the styling of our website. Through this, we learned about Sassy CSS (SCSS) and its capability to help better organize our style sheets. Overall, it was an exhilarating weekend filled with knowledge and fun!

## What's next for SheCares

For our next steps, we want to implement a search-by-keyword bar, so that users may search for products they may need using associate keywords. We also would like to permit the user to shortlist items and then potentially produce a downloadable pdf out of the list they create. As well, we would also like to expand our database of selected products. Finally, we would also like to modify our map, so it displays the closest health clinics based on the user's current location.
## Inspiration

We have a desire to spread awareness surrounding health issues in modern society. We also love data and the insights in can provide, so we wanted to build an application that made it easy and fun to explore the data that we all create and learn something about being active and healthy.

## What it does

Our web application processes data exported by Apple health and provides visualizations of the data as well as the ability to share data with others and be encouraged to remain healthy. Our educational component uses real world health data to educate users about the topics surrounding their health. Our application also provides insight into just how much data we all constantly are producing.

## How we built it

We build the application from the ground up, with a custom data processing pipeline from raw data upload to visualization and sharing. We designed the interface carefully to allow for the greatest impact of the data while still being enjoyable and easy to use.

## Challenges we ran into

We had a lot to learn, especially about moving and storing large amounts of data and especially doing it in a timely and user-friendly manner. Our biggest struggle was handling the daunting task of taking in raw data from Apple health and storing it in a format that was easy to access and analyze.

## Accomplishments that we're proud of

We're proud of the completed product that we came to despite early struggles to find the best approach to the challenge at hand. An architecture this complicated with so many moving components - large data, authentication, user experience design, and security - was above the scope of projects we worked on in the past, especially to complete in under 48 hours. We're proud to have come out with a complete and working product that has value to us and hopefully to others as well.

## What we learned

We learned a lot about building large scale applications and the challenges that come with rapid development. We had to move quickly, making many decisions while still focusing on producing a quality product that would stand the test of time.

## What's next for Open Health Board

We plan to expand the scope of our application to incorporate more data insights and educational components. While our platform is built entirely mobile friendly, a native iPhone application is hopefully in the near future to aid in keeping data up to sync with minimal work from the user. We plan to continue developing our data sharing and social aspects of the platform to encourage communication around the topic of health and wellness.