Breathe Ease

• 

  default view

Inspiration

My inspiration came from sports class. We were doing different running exercises when our teacher pointed out the importance of breathing rhythm. That's when I realized that lots of people struggle with this problem even outside of sports so this would be a perfect cause for this hack.

What it does

It lets you choose your current need. There are different exercises that provide different results and that also use different techniques that are all explained in a side panel.

How I built it

I first sketched out the way I wanted to have my website look on paper. Then I used HTML to build its basic frame. Continuing with JavaScript I made sure all the buttons actually worked. Only in the end did I edit the appearance of everything using CSS.

Challenges I ran into

I usually don't work with JavaScript, so figuring that part out was the hardest for me. I had to look up at least 10 functions. But in the end it all worked out. 'Cause getting the Information panel to change and be interactive was nerve wrecking.

Accomplishments that I'm proud of

I'm proud of the fact, that I managed to solve all of the problems above. This is also just the second time I'm doing something like this.

What I learned

I learned to be patient with myself and I learned how to link Spotify embedded Playlist into my programm, which honestly wasn't hard.

What's next for Breathe Ease

Just going to use it myself.

Built With

• css
• html
• javascript