What you should know about volume controls

Some thoughts on what the volume controls are, their logic and problems

As you know, the sound is a wave, vibration of the air. So-called analog signal. It is stored on your device in a digital format, as information with some size. The audio channel is the flow of such information from the source (microphone, application, web page) through the processor, to the target (speaker). Each stream reserves a certain amount of memory of the processor. At the endpoint, the speaker turns this information back to vibration of air.

As the element of an audio player interface, volume controls visualize the level of vibration at the target point (speaker). For this, we use mostly Mute, Zero, Quiet, Loud states.

It’s important to understand that Mute, Zero, and Quiet — are completely different states of the audio channel. Mute is the indicator of the absence of any sounds. It means there is no audio channel at all. Zero and Quiet — indicates the audio channel is present here, and the volume at the target point is 0% and ≥1% respectively. All these states are often mixed or used incorrectly.

Here will be appropriate to notice that there’s no need of using the Mute at all. This shortcut is not able to turn off the audio channel at the source point. So by pressing it the reserved memory on the processor would not be released. We got Stop or Pause for this.

Now let’s take a look to one of the widespread volume control layouts. It consists of Zero, Quiet and Loud volume states with a progress bar placed between the last two. The progress bar percentage gradation goes from 0 to 100%.

This logic is not quite correct because the progress bar gradation must correspond to the neighboring icons. In this example, it must go from ≥1 to 100%. This is the first important fix. The second one is to use the percentage gradation of the whole layout. So if Zero state is 0% and Loud is 100%, the Quiet state will be somewhere between them (in this example ~17%). Therefore, the progress bar will correspond to graduation from ~17 to 100%.

Such layout works correctly. Now you can simply remove the Quiet state. There are two reasons to do so. Avoid the visual misunderstanding of the progress bar gradation and make whole interface clearer by using fewer objects. So we would see Zero and Loud states with the progress bar between them. Now the progress bar will correspond to the gradation from 0 to 100%.

In my opinion, this is better, optimized version. Here we have full volume control with the least number of objects. Of course, if the progress bar is absent (keyboard shortcuts), you need to leave three volume states Zero, Quiet and Loud. Last two states will correspond to the decrease and increase of the volume respectively.

And little advise additionally. Please use icons to indicate the directions of volume states. Also, make these icons active in your interface. And please don’t use modality for the progress bar because it’s only one object.

Thank you. Feel free to share with me your thoughts and ideas about this.

Related posts:

Sensual is still a relatively new publication, and although we’ve been growing steadily, this week saw an explosion of visitors, views, and read minutes, doubling and on some days even tripling the…

Like eating potatoes every day of your life but always with a different sauce? Caramelized onions with a touch of garlic, a pinch of chili, salt and pepper is my go-to. That’s how I like sex, too…