1

enter image description here

I have an icon that looks like a chat bubble to send a message to a user. Now, you can send a message both to an online and offline user. I'm trying to have two different icons.

Right now they are only separated by color, where the online icon is filled with green. However, I want a visual indicator that is not dependent on color.

I have considered adding a slash over the icon but then I'm afraid the users will believe that you can't send a message to a offline user. Any suggestions?

Improve this question
5
  • Does the user click on the icon itself or is there a separate button? Can you share some screenshot / wireframe to give more context? – Luciano Nov 17 '16 at 9:57
  • @Luciano user clicks on the icon to get a popup where he can send message to the user. Updated the post with new screenshot – Tn Hn Nov 17 '16 at 10:09
  • Maybe put a cross over it when a user is offline ? Maybe like that: puu.sh/sT25Q/156135a91d.png – SitiSchu Dec 18 '16 at 0:31
  • @SitiSchu I've already addressed this problem in the original post. I'm afraid the user will believe that you can't send message to offline user. – Tn Hn Dec 19 '16 at 10:17
  • Yeah that might be a problem...I think the only way will be through colors @Tn Hn – SitiSchu Dec 20 '16 at 23:02
1

You could use filled / empty to differentiate both states. Skype does that: if the user is offline, the icon is empty. Else, it's filled with the color representing the user's status (Away / DND / Online). You can see at a glance who's online and who's not, and that is independent of the colors you choose for your icon' states.

Skype states

Improve this answer
2
  • 1
    But isn't that using a color indicator? What about colorblind people? – Tn Hn Nov 17 '16 at 10:23
  • that is using color/no color. Make sure the icon/background color combination passes on color blindness tests (the icon color should not be that subtle anyway) – Luciano Nov 17 '16 at 10:26

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.