60
votes
Is colour alone enough to convey warning?
No, it is not enough. This is how your image looks for people with achromatopsia (grayscale vision)
This with Blue-Weak Tritanomaly
This with Blue-Blind Tritanopia
As you can see, there are evident ...
23
votes
Is colour alone enough to convey warning?
Color alone is never sufficient to convey information because:
Roughly 5% of the world population has some form of color vision deficiency, either dichromacy (only two types of working cone cells), ...
19
votes
Is colour alone enough to convey warning?
The color alone is not sufficient as a distinguishing feature. The comparison to a traffic light is also not entirely correct. A traffic light has not only the three colors but also a very specific ...
15
votes
Accepted
How to indicate that a button is locked?
Consistency (WCAG 3.2.4) and labeling (WCAG 4.1.2) and are two important points in accessibility that apply to your situation.
In your first two button examples, the "quick scan" has an icon ...
10
votes
If decrease in time represents a better score, should I show an up or down arrow?
Let's back up—consider this...
The problem isn't up or down arrow. The problem is using an arrow to represent change in response time. The reason is because response time is viewed as higher numbers (...
7
votes
Accepted
How can "down arrow" mean "increase"?
It's very nearly the same as this:
Natural "reading order" for most cultures is from top to bottom, so when you place sequential things (whether it's a sequence of numbers, or the sequence ...
6
votes
How to indicate that a button is locked?
I'll take inspiration from both excellent answers so far and suggest the following: Place both icons on either the right or the left side, whichever you prefer, but ensure consistency.
Now, the issue ...
6
votes
How can "down arrow" mean "increase"?
My guess is that it's referring to the position of the next month in a calendar, which is either to the right or to the bottom of the current month. The calendar itself is just following the ordinary ...
6
votes
Accepted
Is there an accessibility standard for using icons vs text in menus?
I like the link posted in the comment section (When to use icons vs. icons with text vs. just text links?) but I wanted to specifically address the accessibility aspect since the question was tagged ...
6
votes
How to indicate that a button is locked?
There are different patterns to approach this but the main goal is to allow discoverability & learnability for the user on premium features.
I would suggest your research well on what works well ...
4
votes
How to indicate that a button is locked?
IMHO, if you want to transport the paywall message, please use a paywall icon. Not a disabled or locked icon. If there's a locked icon, I'd ask my IT support department why it is locked and how to ...
3
votes
Is colour alone enough to convey warning?
It is a misleading question because it is not about color, but about contrast.
Is colour alone enough to convey warning?
Yes, if these colors are strong enough to show a unique concept. In maximum ...
3
votes
What icon should Restore (previously deleted file) button have?
There is no definitive answer to this, as it needs to be compatible with the icon for deleting (as those two options are contextually connected).
However, here are some examples:
Material Design
...
3
votes
Accepted
Do small icons have to pass at least 3:1 for contrast accessibility?
Yes, it must have at least a 3:1 contrast with adjacent colors.
The size of the icon is irrelevant with regards to WCAG unless you are working on AAA compliance, in which case, WCAG 2.5.5 Target Size ...
3
votes
How can "down arrow" mean "increase"?
The arrow corresponds to direction of the eyes opposed date value:
The date values increase as the eyes look in the downward direction.
The date values decease as the eyes look in the upward ...
2
votes
Use open_in_browser icon or open_in_new icon inside native mobile app
I can't answer which icon you should use. But there is a difference between open a link in a new tab to open the browser and show something there. The second will open a new app on your device which ...
2
votes
Accepted
Why is the icon for password a lock, should it not be a key?
You’re not wrong, a password is more like a key than a lock. But, I can think of three reasons why a lock is shown.
In the real world, the lock is the signifier that you need a key. We just ...
2
votes
What should be the order of icons in an accordion?
I believe you're mixing elements and affordances in your current UI design.
The "info" icon is correctly placed next to the title, because the info is related to that title.
However, the ...
2
votes
Accepted
Does it make sense to visually differentiate between native select vs custom select/dropdown component?
This is a solid case for UI consistency, as there's no real possibility for the user to make an error.
Most of the users won't notice or care about the fact that these are different icons. And you are ...
2
votes
Should tooltip icons appear before, or after the element they refer to?
I don't think there's a rule for this. However, I think the vast majority of icons are placed right after the element they refer to, which makes a lot of sense. For example, when you read a sentence, ...
1
vote
Accepted
Visual way (icon or otherwise) to indicate localization language is only partially complete
I wouldn't use an icon at all.
Forty languages are a lot, and the icon's meaning will only be clear to languages with more speakers, such as English and Spanish. Discoverability in less common ...
1
vote
Buttons with icon. Possible problems
It depends. Without knowing more details and without testing, your client is right by default. You don't need icons for buttons, but you do need labels.
However, as you say, it's true that icons can ...
1
vote
How to show elements in a table row that are not combinable ? ( Pls see description)
I think the problem is in the distribution of items in each of the cells:
If the telephones are options, why do they appear in the description that it's a fixed element?
What's the meaning of the ...
1
vote
Basic question I know but what is the different between this dropdown to select with up/down icons rather than a dropdown with a chevron?
Apple calls these things pop-up buttons, as opposed to pull-down buttons. They say:
Use a pop-up button to present a flat list of mutually exclusive options or states. A pop-up button helps people ...
1
vote
Icon for partialy visible
This is a very common pattern, simply use + and - signs. As you can see in the image below, a + sign denotes there's more content, a - sign denotes that you can hide those visible items.
However...
...
1
vote
Is colour alone enough to convey warning?
No, color is not enough. But I'd be more general.
As software professionals, we're often careful not to be redundant in our systems (except as needed for reliability) because it is too easy for ...
1
vote
If decrease in time represents a better score, should I show an up or down arrow?
While other responses have suggested different icons to represent improvement or worsening, I'd like to take a different approach.
Consider using a graph to display the user's progress over time. This ...
1
vote
Using detail disclosure buttons on section headers
For me is hard to say without seeing a real case but you can use one of these components:
Onboarding Modal: As you suggested, a one-time onboarding modal can introduce users to the key features and ...
Only top scored, non community-wiki answers of a minimum length are eligible
Related Tags
icons × 830gui-design × 78
buttons × 71
usability × 64
website-design × 41
mobile × 38
menu × 38
symbols × 38
navigation × 30
user-expectation × 29
android × 27
user-behavior × 26
web-app × 25
color × 25
interaction-design × 24
tables × 21
labels × 20
mobile-application × 19
design × 18
forms × 17
ios × 17
accessibility × 17
lists × 16
info-visualisation × 16
image × 15