Consider that I am creating an interface for a mobile app which shows a list of buttons on the main screen. I can move through the buttons using mobile keypad (feature phones) or screen touch (smart phones). I wonder if I should implement the currently focused button in darker shade as compared to the other buttons? Or a lighter shade would work as well? I mean is there any unwritten UX rule that selected/focused button is always in darker color compared to the other buttons on the same screen?
There is no rule, written or unwritten. All that matters is that:
- The focused state is sufficiently different, yet still clearly the same button. A change from #EEE to #DDD is usually not enough, but changing a square red button with a border into a blue borderless circle isn't a good idea either.
- The focused state is consistent across the interface. If the focused state of one button is darker, other interface elements on the website, when possible, should follow the same system.