I am thinking about designing a mobile application that would guide the user through a slow breathing technique. Typically, inhalation and exhalation would have a fixed duration of a few seconds each. Graphical and audio feedback should provide clear indications of when to inhale, when to exhale, and how to adapt the pace to meet both end-points (empty or full lungs) at the right time.

Existing solution

Found examples of such applications mostly display a vertical bar filling at constant speed from bottom to top during inhalation, and emptying from top to bottom during exhalation. Here are a few downsides to this approach, apart from the absence of sound:

  • The constant speed of the filling and unfilling does not fit the way we breathe: lungs fill quickly at the beginning and slow down when approaching the end-point (full lungs). This can be compared to car breaking, when strong force is applied on the pedal initially and gradually released to adjust to the stopping point.
  • A thin, vertical bar is not adapted to minimalistic UI design: the screen space should be used as much as possible.

Possible improvements

Presence of both graphical and audio feedback:

  • providing a compelling experience when using both,
  • relying on the graphical interface when in a noisy environment, such as public transportation, and allow for hearing-impaired users,
  • enabling the user to practice while closing the eyes, and allow for visually-impaired users.

The user should also be able to quickly adapt his/her breathing pace, in order to avoid taking too much air too quickly (resulting in an almost-apnea during the last phase of intake), or too few air (resulting in a rushed end-phase of air intake). The above vertical-bar solution proves to be subpar in this area (I realized it as soon as I tried it).

Finally, the aeshetics should have an organic feel to them. For example, the process could be represented as a growing and shrinking circle, moving at an "organic" pace.

What graphical and audio feedback types and techniques do you think would suit this breathing motion?

  • Inhale - circle expands/enlarges - inhale sound - turns redder as it grows (to symbolize the intensity of the shakiness of one's body as they push the limit of their VO2 max); Exhale - circle contracts/wanes - exhale sound - turns bluer as it shrinks
    – HC_
    Aug 11, 2015 at 18:55
  • @HC_ Don't hesitate to write an answer along those lines (instead of a comment) and add more details, especially regarding the sound part. Thanks for your solution!
    – Benoît L.
    Aug 12, 2015 at 10:58

2 Answers 2


I just saw this "Paced Breathing" app on the Play Store. I think some of it's features fulfill your criteria like - a variable but linear path of breathing pattern, adjustable session times, visual, audio and haptic cues, custom breathing profiles and color themes.

You can make a few changes in the visual representation. For example, replace the lines with a proper trapezium (Isosceles Trapezoid to be precise). I think a growing and shrinking circle represents normal breathing but not the kind of paced breathing that you do during meditation (more deep).

enter image description here

As you mentioned, it's not entirely constant. For this case, an Isosceles Trapezoid structure makes sense - increasing slowly, a period of holding the breath and then releasing slowly.

Hope this helps!


A dot that grows and shrinks—which you request because it has an organic feel—can signal the breathing rate by switching from expansion to contraction, showing when to breathe in and when to breathe out.

If the dot that grows and shrinks is inside a circle that represent lung capacity, then you can help the user see when to take shallow breaths and when to take deep breaths.

Breathing dots that grow and shrink

You can combine the two. Maybe it's better to put the circles in a box rather than in a circle, because too many circles look like eyes, eggs, or other organic objects.


I suppose you could also combine this with sound, and you could make the volume correspond to how deep/full the breath is. That would allow users to close their eyes or to focus their eyes on something else.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.