Mobile app version of vmapp.org
Login or Join
Gretchen549

: Mobile buttons with the same color as canvas background 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

@Gretchen549

Posted in: #Critique #InterfaceDesign #Mobile

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:

10.03% popularity Vote Up Vote Down


Login to follow query

More posts by @Gretchen549

3 Comments

Sorted by latest first Latest Oldest Best

 

@Speyer780

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.

10% popularity Vote Up Vote Down


 

@Steve758

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:

10% popularity Vote Up Vote Down


 

@Deb5748823

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.

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme