New answers tagged

0

How about simply a green circle for good, and a red circle for bad? I don't see how this portrays less information than your arrows - assuming that they universally agree with your assessment's that down in one category is bad, and up in another category is bad.


0

Perhaps instead of unprofessional emoticons, you can use a simpler symbol to indicate a good or bad result. In this case, I used a tick and a cross: But since the indication is probably more important than the direction, we can place greater emphasis on the ticks and crosses: I also agree with Gino's suggestion to use zig-zag arrows to communicate an ...


0

One thing to note in general, without considering implications of arrow cardinality or color: arrows that point straight up or down are confusing in general, since they can have multiple meanings: This row can be collapsed or expanded by clicking the arrow; This row can be moved up or down by clicking the arrow; This row has changed in value compared to ...


6

Put the good at the top and bad at the bottom (or maybe reverse this if you want to attract more attention to the bad). This way, you will have two sections divided by a clear conceptual mapping. I would imagine that the main question is more along the lines of "In what areas are we struggling?" rather than "Did this section increase or decrease?" This ...


19

I'll make this an answer so I can expand on my comment. Your main problem is not an arrow, icon, color or emoji thing. Your main problem is a conceptual one: you're mixing taxonomies with gradations that might be (they actually are!) absolutely opposed. Thus, you're adding a load where user has to make an interpretation of whether your taxonomy and your ...


1

Consider separating the list into two sublists, one of "things which are good when they increase" and one of "things which are bad when they increase". I'm not sure what your exact business domain is here, but it sounds like you have income generating items and liability generating items, so why not just make two lists? This could be done "in-line", i.e. ...


0

Why not show a numeric % change? You can color the text green/red to help non-color blind people know if the number is good or bad (in the case of a negative percentage for one category being a good thing); color blind people would still have access to the same information at a glance without the courtesy of a text color hint.


3

To build on @Adriano Repetti's answer, and again borrowing from Information Dashboard Design by Stephen Few, I would like to highlight some assumptions about your view and make a suggestion. As someone who is not colour blind, it still took me a while to figure out what all the arrows mean! Your interface confused me, so I tried to think about what you are ...


-2

Stock Market Ticker metaphor: triangular arrows pointing up and down I feel that you are going in the right direction with the arrows, but I think you could make use of the fact that your users may be already familiar with a stock ticker metaphor as shown below. (Even if they weren't, it's probable they would soon figure it out anyway.) (Sorry about the ...


1

I'd avoid to convey information only with colors. Green for "up" and red for "down" is not an universally worldwide accepted pattern (and color blind people may not see them). Given the fact that you don not need color then I'd simply drop it. Use a gray symbol, color is not needed. To better give sense of trend (and to clarify symbol meaning to don't ...


4

I have always liked these icons, which indicate a trend on a graph. The combined shape and direction of the arrow indicate how the trend is progressing. I got these from Ionicons: http://ionicons.com/


17

Perhaps you could use only black for the arrows so that the user knows of the increase or decrease, place them on the left, and then on the right use a "health-bar" style status report which would look professional and could indicate the positive/negative aspect and even severity. (Use colors other than Red/Green if you are worried about color blind issues) ...


3

You are right to avoid the use of colour alone - especially when considering red/green states of the same shape. The way to approach this is by changing the shape of the arrow and there are a number of ways you could do that. As a few of suggestions: 1) You could bring left and right into play, where right is progressive and left is retrograde - an arrow ...


2

While this is quite subjective, there are some guidelines on color based on frameworks or design philosophies. A very common one nowadays is Material Design Colors, which basically uses a primary color, a secondary color, and an accent, mixed with shades and tints. Similarly, Apple Color Guidelines are a must read resource since it has more theory, which in ...


38

Is it true? No. Nor is it true that it's good UX. It's a visual design question that can only really be properly answered in context...and part of that would be how it works with the overall page design. In the particular context of the cited question... ...it is asking very specifically about Red on Pink That's a very specific combination and ...


79

It hurts the eyes Certain colors and color relationships can be eye irritants, cause headaches, and wreak havoc with human vision. Yellow, pure bright lemon yellow is the most fatiguing color. Why? The answer comes from the physics of light and optics. More light is reflected by bright colors, resulting in excessive stimulation of the eyes. ...


9

Building off of several other answers: Never only rely on color. Adding an icon or text or texture not only helps colorblind people, but also makes things a bit easier for regular-seeing people. Using a dark grey or black bar gives a strong contrast with the background. It's also color neutral so you can put other kinds/colors of notifications in those ...


18

You might try adding a white border, then play with the background color. The one color that communicates 'something is wrong' louder than red is the color of death, black.


22

The standard color for error messages is red, see this question : One important point to understand is that using conventional colors for errors is important because they make the errors more noticeable. User being annoyed by the color of error message is lot less of a problem than user not being able to complete the form because they didn't ...


3

The question actually provided a lot of the alternate options available, but for clarity I thought it would be good to summarize some of the answers provided: Find a complementary colour to use that will stand out - there are plenty of tools for this, and you can also consult the branding guidelines as a secondary check; this could be for the UI, the font ...


62

I would go with something in the shade of the background, but have a more red text in the alert. You can add a border in the shade of the text to make it stand out as an error more, as well.


71

I'd go with a color that'll always retain stark contrast. I'd also avoid venturing too far outside of the styles that that users are generally familiar with. Because you're working in an atypical style, if you deviate and use unfamiliar elements you may risk confusing a percentage of your users. Here's what i think i'd recommend.


-1

You could also try a light red background for the alert:


43

A bright yellow background with black text would work well. Fits the colour scheme of a warning sign.


17

That's an accessibility nightmare! Try reversing your error message styles: Red text on a white background.


3

And Apple uses white background for their videos on website. While using light background colors, make sure you apply shadows to the player so the visual content stands out. Take a loot at the Video Player UX on Pinterest Here are some aspects of dark color


0

I am a designer usually i send my designs to the customers by WhatsApp Web. The main problem occured while seeing the design on phone colors are very different green looks light green, Blue looks cyan. I tried to send my Jpeg images after convert to RGB. That worked. Colours are perfect. Smart Phone displays only RGB colours perfect. Not CMYK.


0

If your website or software cannot handle regions, I would go: Green for approval Red for error Why? Because the traffic light, whether region you are in the world are pretty much universal and understood. They all follow the same code. To clarify the messaging and avoid misunderstand with color (also for our colorblind friends), I would add an icon ...


0

Before we can define a number of colors, we have to define: What is color? Color isn’t a particular wavelength or property of light, it is a cognitive perception. Color, is a perceptual property, something that occurs deep inside our brains. So if we can't see it, it is not a color. As such, colors are defined based on perceptual experiments. Another term is ...


1

Ok, though it depends on the details of application and the purchase process, but I believe that those are too much status. "open order" is the default status of any order, because there is no "closed order" before purchase. default status does not need an extra indicator. For "acknowledged" , it will make sense only if the order is from a third party ...


5

As a user, I would have no idea what the different colors would mean. I think you should write the title of each status underneath in small caps. If you do that, here are my color suggestions: OPEN - Blue, by default color. ACKNOWLEDGED - Orange, you need to notify the user. You could have the button fade rapidly from grey to white and back to show that ...


2

It depends on where this solution will be used. In western culture Green and Red has implied meaning which is very different to Chinese culture. http://translation-blog.multilizer.com/color-localization-infographics/ As others have commented, you should not rely on colour alone to convey meaning, i.e. couple the colour with an icon and the copy should ...


-1

The best color for displaying pop-up message is green and red. If there is no error then the output message should be reflected in green color and if there is any error then the output message should be reflected in red color. As we would choose these colors just to make it simple to the users because as a UX prospective you have to made it simple and clear. ...


0

You want to look at contrast by color and then by value. If the colors don't cause enough contrast, then look into making the color darker or lighter or even shades of gray. Note that the colors that are least noticed in your image are much lighter than the darker colors, which appear to be in the foreground, just be their darker shade.



Top 50 recent answers are included