SelfStats

Your personal hub for simple, everyday health tools.

Comment

SelfStats

Inspiration

SelfStats was made as a solution to your scrambling of many small but useful day-to-day health tools on many different platforms, onto one unified website. SelfStats provides essential health tools in a user-friendly and convenient manner. Additionally, the website's UI was completely inspired by Apple and their health features. In fact, the Noise UI really mimics the Apple Watch Noise app UI!

What it does

SelfStats is a website that offers a variety of small health tools, including:

  • UV Index: Provides real-time UV index information to help users protect their skin from harmful UV rays.
  • Noise Level: Monitors ambient noise levels to help users protect their hearing.
  • Breathe: A guided breathing exercise to help users relax and reduce stress.
  • BMI Calculator: A tool to calculate Body Mass Index (BMI) and provide insights into healthy weight ranges.

How we built it

SelfStats was built using HTML, CSS, and JavaScript. The project is structured with separate HTML pages for each tool, and corresponding CSS and JavaScript files to handle styling and functionality. We used the Weather API to fetch real-time UV index data and the Web Audio API to monitor noise levels.

Challenges we ran into

  • The Domain: The .xyz domain provided does not have SSL certificate support, making it impossible to use HTTPS. Additionally, it took a long time for the DNS records to propagate, and I almost assumed that the website wouldn't work entirely.
  • The APIs: Finding a quick and easy Weather API, as well as figuring out decibel calculations for the noise tool.
  • Time: The time given to us this year is lower than usual, thus making the whole process more of a rush.
  • Advanced CSS: The CSS required for the breathe app was very difficult to implement, as it required advanced positioning and animation skills.

Accomplishments that we're proud of

I am proud of making such a beautiful, simple, and useful website at the same time. It is such a big improvement from other hackathon projects I've made, and it is accessible to everyone.

What we learned

I learned many things, such as the Web Audio API, sharpening my CSS skills, and what makes good UI.

What's next for SelfStats

In the future, I plan to add more health tools to SelfStats, such as hydration, heart rate, symptom checker, and nutrition features. I also aim to enhance the existing tools with more features and improve the overall user experience for all users.

Built With

Share this project:

Updates