search

ksux / ks-design-guide

Live pattern library for Kuali Student.
http://ksux.github.io/ks-design-guide/
9 stars 1 forks source link

Error icon should be red octagon with exclamation mark #37

Open basham opened 10 years ago

basham commented 10 years ago

Current error icon:

Red octagon with cross mark error icon

[7/18/14, 1:14:05 PM] George Wendal: I got some feedback from some of the Red team devs on the error icon that is currently being used in CO and CR (possibly CM as well, not sure):

On 7/17/14, at 4:52 PM, Paul Richardson wrote:

I have feedback about the "error" icon we are using in the cart results:

http://prntscr.com/43p71z

The octagon with an "X" through it looks a lot like OS X button for closing a window. As a Mac user, my first instinct on seeing that is that it'll dismiss the message.

On 7/17/14, at 5:08 PM, Nelson LeDuc wrote:

In general, I agree that an X often means dismiss, not only in OSX. In fact, we had been using an X to dismiss messages up until recently. Not sure when the "Dismiss" buttons were added, I just now noticed them.

Perhaps a red octagon (stop sign) with ! inside it. Since the warning icon is a yellow triangle (inverted yield sign) with a !

Has anyone had a similar experience, or encountered any issues with that icon during usability testing? I haven't seen any confusion with it during the testing I've been involved in.

[7/18/14, 1:18:48 PM] Erik Rath: We have the icons, but they are only in our tabs to indicate that there are errors on a particular tab. I suspect a lot of the confusion may stem from placement. When I see an X near the top right of a message/dialog/etc. I definitely tend to think “close”. Though I would think being inside the icon would dislodge that association at least a little. However, the exclamation point seems way safer, since they don’t seem to be used as any sort of trigger or control, but still indicate a similar message (within a stop-sign seems to communicate you’re stopped, pay attention!).

[7/18/14, 1:20:00 PM] George Wendal: I agree, moving to the exclamation point seems to make sense to me.

[7/18/14, 1:58:36 PM] Chris Basham: I'm wondering about the larger icon ecosystem. Don't we use exclamation marks in warnings? https://useiconic.com/icons/warning/

Assuming that an error differentiates itself from a warning is by color (red vs yellow) and shape (octagon vs triangle), then I think the exclamation could be a nice way to unify both as being something that should be alerted to the user.

Moving the error icon closer to the realm of the warning icon is much preferable than closer to a close icon, especially given an octagon is probably closer to a circle in appearance than a triangle.

[7/18/14, 3:36:07 PM] George Wendal: Yes, we do use the exclamation point in warnings but like you said the differences in color and shape help to differentiate the two. Sounds like the exclamation point is the way to go for the error messages unless anyone else has a different opinion.

mtheoryx commented 10 years ago

There's nothing inherently wrong with using the error icon containing an 'X', as seen here

The main issue is where you're placing that, and the fact that you have more than one.