I'm working on a project where we are trying to figure out in a horizontal
layout for physical buttons that are used for navigating a list of options
(primarily) that are layed out vertically how would you layout these
So you have a button on the left and another one on the right.
while button goes up the list and which button goes down?
Here are some cursory thoughts.
#1 Forward = add = up
Based on that a "volume control" seems to be the most used example and
adding volume (going up) is always on the right.
#2 If we look though at the same metaphor which is a knob.
turning right goes up for volume. So that seems compatible with #1 where
"going right" = clockwise from the top.
#3 Back/forward buttons are written back = left and forward = right in
many circumstances again confirming that flow. But this does not have a
#4 here is where it gets different.
previous/next are probably the closest allegory
but "next" which is usually on the right, actually goes "down" when
navigating a list, which scrolls the screen "up" creating a paradox for
I know for me, when I navigate my channels on my cable provider's DVR
(don't know about TiVO) they list the channels in the guide #1 at the top
and #1000 at the bottom. But the down actually takes me to a higher
channel b/c they put the visual ahead of the numeric presentation.
#5 On the click-wheel of an iPod, the clock-wise sequence is "forward" and
thus going down (descending) the list.
My only thought here is that if I had a D-pad with 5 buttons the down and
up would work by
Down button: would move the selection visually under the previously
Up button the opposite.
since these are clearly UP & DOWN, I would hold to the allegory to the
up/down for numeric purposes like the volume control or knob example.
I realize there might be people saying:
1. Why not make it vertical? We can't
2. Why not use clearer lables than up/down icons? No space.
So these are the design constraints. We can only change the mapping of the
buttons, not the placement or the labels of the buttons.