Case Study
Screencast can be found here
"Right from the very beginning, my team of developers engaged with the project and made helpful suggestions to guide my idea and ensure the product was the best it could be. They understood that aesthetics were one of the top priorities and worked hard to ensure the design was calming and consistently high quality. It looks beautiful! I want to say a big thanks and hope that we can work together again in the future."
Charlotte Barrett, Anna Freud Centre
Breathe With Me is a mobile web application that takes user-centred design as first principle. With smooth, flowing transitions, and soft, ambient music, it guides the user through a deep breathing meditation using animated animal avatars as a point of focus. Any time you need a break you can Breathe With Me.
Young people who suffer from anxiety need methods they can utilise regularly to manage stress and build resilience. Deep breathing and mindfulness are well researched techniques to do this for their calming affect.
Many clinician tools focused on stress management lack an aesthetic sensibility that appeals to young people, and so we needed to build something that can teach these exercises and promote self-care while being engaging enough for regular usage.
We built the app as a progressive web application, with cross-browser functionality and responsive design, so that it is available on any smart device or desktop, online or offline.
Our focus was on creating an attractive and atmospheric experience for young people. With cute characters whose simple movements and first-person prompts guide the user as they breathe into the immediate and calming affect of the breath.
We implemented the following technologies to accomplish this:
- Greensock.js
- Sass
- SVG
- Service Workers
- App Cache
- Granim
- Webpack
Sofia Pohjalainen | Noga Inbar | Bradley Reeder | Kara de la Marck | Gabriel Perales