I'm designing a remote control that only have Volume Up, Volume Down and Mute. But I can't decide where to put the mute button, in the middle or on the bottom.

enter image description here enter image description here

And what should I have for the Mute button? Just a speaker, a crossed speaker, or a speaker with a X, or anything else.

enter image description here

EDIT: I just made this prototype, based on the feedback. I will test it that way, and if I don't like I may change it. Any feedback is appreciated though.

enter image description here

I asked because I found it both ways around my house, few examples:

enter image description here
HP Laptop
enter image description here
Microsoft Keyboard
enter image description here
Apple Keyboard
enter image description here
Directv Remote

  • Very cool! Why not test it and have people try it out? – erik_lev Dec 17 '14 at 18:05
  • @lineplay how I made it instructables.com/id/… – Vitim.us Dec 18 '14 at 3:14
  • 2
    Just a thought: give the buttons, themselves, some context with shapes. Up and down triangles for volume and a fat X for mute? – DA01 Jan 14 '15 at 0:17

Alas whatever you do with those 3 buttons, it's going to be confusing for the user because they are all physically identical. 99% of the remotes I've seen in this century have rocker buttons for the volume control and a differently shaped button (usually smaller, because it's not used as often) for mute. That also allows one to figure out what he's pressing in the dark much easier (without needed a lighted remote). Don't copy the keyboard designs because the volume control is often an afterthought on those, so it's cheaply made with whatever common parts are available. There's also a difference in how one holds a remote in hand vs. holding hands on the keyboard, so even the ideal-case considerations are different between these two devices.

As example of good arrangement I suggest the XBox 360 remote below (image courtesy of Wikipedia).enter image description here

If you google a bit, you can see that Panasonic, LG etc. use a similar layout. Samsung is similar but different enough that's worth discussing. They normally put the mute where the "TV" button is on the XBox remote above, i.e. alongside the volume up. In the place of the Xbox's "mute", Samsung places the channel list button. The two small buttons in between the rockers are very easy to find in the dark, but the lower one is somewhat easier to press. So I think Samsung made a deliberate choice of making the channel list easier to find than the mute. I suspect they may have conducted some user studies before they decided this, because they use that layout on many different models. But since you don't care about making a full TV remote, you have no competition for your mute button, so place it alongside the lower volume button.

Also since there are no [TV] channels for the user to change in your application, you could place the whole set of buttons further to the right. Look at how some Denon remotes (an expensive and a cheap one) both place the volume buttons to the right side (image from electronicexpressinc.com):

enter image description here

That's because on an audio-oriented product changing channels/tracks (on the radio tuner or CD) doesn't happen as often as one zaps the TV channels. You are however taking some risk in doing this. If your users are very used to TV remotes, they may find this volume-column-to-the-right arrangement "unnatural".

  • 1
    I came to that conclusion with the prototypes, since theres no standard, it is confusing both ways. Its better to have the mute away from up and down, Im working on a new layout. – Vitim.us Jan 14 '15 at 3:10

Mute button at the bottom as this is going to be used less than your standard volume controls, and should also follow a logical flow: Volume up -> Volume down -> Mute. If this is in the middle a user could accidentally press mute which would be annoying. A mute button should follow conventional design so a speaker crossed out would be fine.

Check out the link below, it will give you an idea how the button tends to look on other remote controls, it is best to stick with what is already known.

Google search mute button on remote control

  • I found it both ways, on the bottom and in the middle. That's why I asked. – Vitim.us Dec 17 '14 at 15:23
  • One is for a keyboard and the other is for a remote. If you check out the Google link in my answer you should see a trend with the speaker crossed out for a remote button. There is not a better or worse icon in this case other than stick to the common trend of a crossed out speaker for a remote. For a computer keyboard you could go with either as there seems to be a trend in slight differences. – 80gm2 Dec 17 '14 at 15:24

I don't think the order is particularly important. What's more important is grouping. Volume up/down go together, so need to be grouped together.

As for icons, I also don't think that's particularly important either. Namely because this remote only deals with one thing: volume. There's no need to put a speaker icon on a remote that only deals with the volume.

I think you have a rather unique opportunity here. Most remotes suffer from being way to complex. You have the opportunity to go way minimal.

Based on all the above, here's a quick stab at an idea:

enter image description here

I've minimized things down to the essential:

  • Grouping: Two 'buttons' One for volume (actually two buttons, but grouped as one), one for mute.
  • Scale: mute button slightly smaller to both differentiate and because it's likely used less.
  • Simplified icons: up, down, 'mute'. No need for a speaker since that's all this remote does.

The biggest benefit to this, IMHO, is that it makes things a lot easier to deal with by touch. Your prototype is going to be harder to use without looking directly at it.


On the bottom, and just a speaker.

Photo of the Macbook keyboard fragment

enter image description here

UPD: I've submitted my answer and then noticed you've edited the question and added pretty much same photo.

  • Just remember that just because Apple does it a certain way doesn't mean it's universal. – DA01 Jan 14 '15 at 0:17
  • I don't have this particular belief :-) But, as they invest lots of effort into their research, I often consider Apple guidelines reliable in terms of UX. – Zoe K Jan 14 '15 at 9:52

The Volume up and volume down buttons should be next to each other, for the simple reason that when users adjust volume they press these buttons alternately and blindly until the desire volume is set, so you don't want any other bottom to be literally in the middle of that interaction. For me this is a must.

About the mute icon, I would personally go with any of this type...

enter image description here enter image description here

... because they have less cognitive load and make a clear visually differentiation between the other two (just one structure instead of two) :

enter image description here

About the position, you should take in count:

  • That the up and down buttons should be the ones with the "easiest access", so it will depend on the physical design of the controller.
  • That the mute button should be place somewhere where it's not possible to press it by accident.

btw, have you consider other designs as a possibility?

enter image description hereenter image description hereenter image description here

  • I would, but I can't. I can reassign functions to the exiting buttons, and change the layout accordingly, but I can't change the physical construction. Check out the prototype I added on the first post. Any positive/negative feedback is appreciated. – Vitim.us Dec 17 '14 at 18:00
  • Oh, if you cant't change the physical construction you don't have too much options. In these conditions your prototype is okay for me. – Alejandro Veltri Dec 17 '14 at 18:58

enter image description here

  1. Signs (labels) should be on the surface of the button itself (when user looks at the button it should tell the user what its function is, without having to look at other places. Therefore it's not a good idea to put the labels beside the button.)
  2. Volume up should be positioned on top of Volume down. (This will give a visual cue of high being on top and low being at the bottom. This way user doesn't have to remember the position of each button, he/she can operate it without having to look at the remote. Positioning buttons horizontally will create this problem. User will need to remember if right button means volume up or down etc.)
  3. Shape of the mute button should be different to give the user clear distinction (User should be able to press on the mute button without having to look at it i.e just by feeling the shape with the tip of his/her fingers.
  • 1
    "signs should be on the surface of the button itself" - on a screen, sure. When creating a physical product, the material demands on a labeling which does not wear off after being continually pressed are much higher than on a label beside the button. It may well be that a label beside the button is the better solution long-term, if for cost reasons it can't be guaranteed that the device will have keyboard grade labeling. – Rumi P. Jan 14 '15 at 12:44
  • Good point. Engraving could be the potential solution for this problem, since paints will likely to stay longer in this way. – Ades Jan 15 '15 at 4:38

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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