5

I am designing a mobile UI and I was wondering if having the buttons the same color as the canvas background is bad visual design? There will be a border around the buttons so it will be noticeable to see that they are buttons but will that potentially confuse a user? Here is an image:

enter image description here

enter image description here

  • 2
    IMO they seem like buttons just fine. However it's not very appealing to the eye – Zach Saucier Feb 28 '16 at 1:43
  • 3
    Filling in the color like the second example makes it more clear that they are buttons – Zach Saucier Mar 12 '16 at 23:39
1

It isn’t “bad visual design” necessarily, but I recommend you try one of the following:

  • invert the buttons so the button background is orange and labels are white — maybe try the labels in black also, maybe at 70% opacity

  • color the entire background orange.

If you make the above alternates and then put all 3 on screen and stand way back about 3–4 meters, you might see that one of them remains very obvious and the others do not.

  • I tried the button backgrounds orange with the icons and text in white. The buttons look look a lot better this way visually but I am worried about the header also being orange. I want the header orange to keep it consistent with all other headers that will be on my other mockups of this project. I just put an image of how it looks now, only thing I worry about is that there might be too much orange now. What do you think? – Ralphunreal Mar 12 '16 at 18:08
1

Simon White suggestion looks better. Any particular reason to only use one color? (except from the dark borders.) If not, you could check color palette websites like coolors.co or adobe color. I usually use at least 3 colors, even on a black and white design, having a light/dark gray in it makes alot of difference.

If you still feel like using borders, i would make the border thicker, also make the title in uppercase and the button labels capitalize. Something like this:

enter image description here

1

It may confuse elders, but if you are targeting people of younger age that are quite familiar with mobile technology, you won't make them confused. Believe me, I've seen terrible UI design and people still managed to use it.

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.