10

We are building a cross platform mobile application and I am kind of responsible for iOS part. I'm the first one to begin to work on the instant messaging feature, so my decisions will affect my colleagues who develop Android and Windows Phone parts. And I'm stuck with the question how to properly indicate the message is sent, received, and (may be) seen?

I know that there is the WhatsApp way one tick sent and two ticks received, but this kind of mis-leading users to think that one tick is for received and two ticks for seen. I don't want this mis-leading but I also cannot tell how much damage this will do. I am open for suggestions in this matter.

6
  • 1
    "kind of responsible" and the fact that the first one to touch a feature gets to set the rules for all platforms to comply sounds like your project might benefit from some restructuring.
    – Mark
    Aug 4, 2014 at 12:04
  • As a minor note: I'm pretty sure that WhatsApp doesn't determine the message is received until the user has seen the message within the app (for Android anyway not used other versions)
    – Sayse
    Aug 4, 2014 at 12:09
  • 1
    @Mark small company issues. My partner is leaving for the military duty and I am the only iOS developer left.
    – sercancici
    Aug 4, 2014 at 12:30
  • @Sayse i think WhatsApp means received not seen as there can be two ticks even if the receiver is not online. Look at the last seen when sending a message to offline user. (Me too, using Android version.)
    – sercancici
    Aug 4, 2014 at 12:31
  • @sercancici oh I know these, I know your pain. I am the only one developing software in this company at all, with 1 - 2 others having knowledge in that field but doing other things they know as well. I gather the reqs., design, code, test, code, deploy, maintain, etc..
    – Mark
    Aug 4, 2014 at 13:20

6 Answers 6

4

I would not rely on colors alone for accessibility reasons, nor would I recommend WhatsApp ticks because not self-explanatory.

Apple do a good job in that they write Read below the last message. This method is definitely the easier to understand for everybody but has the "disadvantage" of having to be localized.

Also, two states should suffice: Delivered and Read. The Sent state is useless because once the message has been posted to the server there is no need to confirm it; in the case that there was an error instead, near the message you should have a Retry button.

Clean, accessible, self-explanatory.

1
  • 1
    Using just one indicator for the last message is way more reasonable than using same indicators for all but last ones. To top it off, it takes absolute minimum space.
    – sercancici
    Aug 4, 2014 at 13:03
4

As an example, I will mention about Kik Messenger. Kik Messenger shows all the 3 states of a message

  1. Sent (Sent from your phone & it has been recieved on Kik's server
  2. Delivered (Kik server has successfully sent your message to recipient's phone, i.e Recipient has received your message)
  3. Read (The Recipient has read your message)

Kik Messenger App denotes this 3 status by displaying the first letter of these statuses against each message.

Another example is Whatsapp as you mentioned which only shows 2 status, Sent & Delivered by number of ticks. I don't think they would have shown 3 ticks if they wanted to convey that the message is read. Number of ticks can only be limited to 2 status i believe.

I find both these approach to be great. I don't think that users find 2 ticks for delivery is misleading considering the wide usage of the application. But you can always remove the confusion by either using full text for each status or just the Initials.

1
  • I don't think that using full text is logical as I don't want the indicator to take that much space and using the initials as stated by @jazZRo above, are confusing to non English-speaking users. I think I will go with the WhatsApp way with a little difference.
    – sercancici
    Aug 4, 2014 at 11:01
2

BlackBerry Messenger (BBM) uses a similar indicator to WhatsApp but it is a little clearer as to what is meant:

  • Sent messages get a tick
  • Delivered messages get a 'D' next to the tick
  • Read/seen messages get a 'R' next to the tick in place of the 'D'

Page 6 of their PDF user guide gives examples of the icons

1
  • 3
    Not sure if I would have known what D and R meant without reading the manual. English is not my native language and if the app is translated except for those letters, that would be confusing. Translating the letters doesn't do any good either.
    – jazZRo
    Aug 4, 2014 at 10:38
1

Telling a user that their message has been received by the target device isn't really as meaningful in a human sense as telling them that someone read their message.

Can your chat app tell if a message has been seen by a user? For example, if you know that the application has this screen open on the target device, you can reasonable assume that the message has been seen.

It might be nice to use this information instead of telling the user that their message was received by the device.

7
  • 4
    Notification of delivery is often just as important as notification of being read. Delivery notifications at least indicate to you if their device is switched on and that your message has a chance of being seen, or if you should try some alternative method to contact them. Aug 4, 2014 at 10:04
  • @GrahamWager Good point, although if the device in question is a phone I don't imagine many people have a 2nd option.
    – Franchesca
    Aug 4, 2014 at 10:37
  • @Franchesca generally speaking, SMS is a good 2nd option yet it may not be so as the application is not about messaging instead it is just a feature in the app.
    – sercancici
    Aug 4, 2014 at 10:48
  • I was thinking the 2nd option might be someone else they're likely to be with - for example, if they're at a festival with 3 of their friends and their phone battery dies, you could try one of their friends. Aug 4, 2014 at 10:55
  • 1
    @GrahamWager This is also a good point for many applications of messaging. I just wanted to suggest that "delivery" might not be as meaningful as "seen" to many users. Of course a more technically literate user base will understand and make use of delivery notifications.
    – Franchesca
    Aug 4, 2014 at 12:27
1

How to properly indicate that a chat message is sent-received-seen?

  • light icon, for example a pidgeon: message is on the way to the server
  • dark icon, for example a check: message has arrived at the server
  • whatever happens next, if mails are read, when they are read, is the receivers business

I know a lot of apps do that, but if this read confirmation cannot be disabled it just creates a physical pressure on the receiver because he knows the other person knows that the message has been read. So the only correct way is to not give this information to the sender. If the receiver agrees to show his status, you show a closed and an openend envelope.

0

You might color-code it.
Colors below are just examples
If it hasn't reached the server (after x seconds), paint the frame of the message or its background red(/grey),
on server => yellow
on remote device => green
read => blue
Make sure to add some time cushions for red and yellow, so not every message blinks violently or users get confused why "all my messages are red at first".
Only make aware of the first 2 statuses (total of 4 in my perspective) once they might inidcate trouble.

Pro:

  • easy to implement
  • native and discrete (if done with sublte colors the information can be in plain sight, but will not be perceived until the user wishes to do that)
  • could implement colors of your application's design / corporate design (like facebook-blue, whattsapp-green etc.)

Cons:

  • occupies part of the visual design
  • users might need to at least once look up the meaning of the colors

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.