Improve message coloring

[generalmanager]

The colored messages are supposed to convey to the user the difference between push messages and SMS.

But the green color has confused myself, @sagischwarz, @phenx-de and literally everybody I have told to install the app.

@phenx-de and myself have had a rather extensive discussion about the whole shebang in #908.

What we came up with:

• Use orange instead of green
  • Green is widely used to indicate security aka encryption (green traffic light -> you're safe / good to go) and people are used very to it.
  • Green is already used to indicate encryption / TS users in the contact list
  • It also collides with several ideas in #741 and #910 to indicate trust
  • Orange is the only color left in the Android color scheme, apart from purple: https://developer.android.com/design/style/color.html
  • It doesn't have such a direct association as green and red have
• Use toned down colors to indicate the most likely transport for messages that aren't sent yet (#796)
  • Provides information about the most likely transport
  • Indicates that the message hasn't been send yet
• We should use color strips on a light grey message body. Either on the speakers' side or on top of the messages
  • A whole window of completely colored messages looks very playful/cartoonish
  • It improves the contrast of the gray message-delivered text and icons below the message, making it easier to read
  • Scale down the importance of the transport information to a reasonable level
• Color both the messages of sender and receiver
  • While roaming and in some countries people have to pay (a lot) for incoming texts, so knowing if it's an SMS or not is important.
  • The current implementation is inconsistent from a UX perspective.

This is what @phenx-de came up with:

Blue message sides for data and orange message sides for SMS: ____

Those are two of my own mockup sets, one with white and one with grey backgrounds. The first one doesn't have the nice new send icons because I couldn't be bothered to put them in after I made the mockups.

Colorset 1: Blue message headers for data, grey background:

Colorset 1: Orange message headers for SMS, grey background:

Colorset 2: Blue message headers for data, white background:

Colorset 2: Orange message headers for SMS, white background, encryption:

Colorset 2: Orange message headers for SMS, white background, no encryption:

Please tell us what you think ;-)

I did a quick count for several different preferences.

If I misunderstood anybody, just tell me and I'll change your vote. If you have an opinion to one of those topics and aren't listed, just answer in the thread.

The first two are about the shape of the messages only, the colors are to be discussed apart from the way we use them.

• New style messages with colored bands (colors to be discussed) on top or on the side: @lindworm, @phenx-de, @noschinl, @Anaron, @monreal, @tinloaf @maulwuff
• Old style messages but with toned down colors: @virtualritz, @0xACE, @L3st3r
• Message color should indicate encryption @virtualritz, @lindworm, @mcginty
• Message color should indicate transport method @Anaron, @Cimbali, @0xACE, @L3st3r, @backspace
• Colors should stay the same (blue and green) @Anaron, @monreal, @sagischwarz, @0xACE, @L3st3r
• Colors should change @lindworm, @phenx-de, @maulwuff

Everybody seems to like the toned down colors for sending, so at least we have one thing in common ;-)

[Anaron]

Green has been commonly associated with SMS for years now. We can thank Apple for that because that's what they used for SMS. It wasn't until the release of iMesssage that they added blue for data-based messages. Although it may make sense for you and I to see green as secure, it wouldn't make sense for the average user.

I think the TextSecure developers should stick to green for SMS but switch the blue colour for secure data-based messages to orange. Blue only indicates that it's data-based so another colour to indicate security is nice. Red and purple are not suitable so that leaves orange.

EDIT: LIke so:

[generalmanager]

@Anaron Well the fist thing several friends and even my mom associated the green color with was that the message is encrypted. Some specifically asked why the old messages (before we both switched to V2) were not encrypted, while the new ones weren't.

We should get as many opinions about this as possible, but I personally think the first association with green is security and it would be bad for the user experience if it symbolizes something different. We should also consider that it's not that bad if a user doesn't immediately recognize the difference between SMS and data but it's a lot worse if they can't differentiate between secure and insecure communication.

About the third color for encryption: First that would mean you would have an own color for encrypted data but none for encrypted SMS - that's not good. We've been discussing different options to signal trust and encryption in quiet some detail in #910, #741 and #766.

The one thing we are basically on the same page about is that we should not overuse colors, especially not to convey two different meanings at the same time (data+encryption).

[Anaron]

@lindworm Would your friends and mother have made the same association with an iPhone running iOS 7? Apple set the "green for SMS" standard once the iPhone became popular. And that's a device marketed towards the average non-tech savvy consumer (like your mother). In the image below, the left is iMessage (blue chat bubbles) and the right is regular SMS.

I agree that green should be used for encryption because it makes sense but the issue is that it wouldn't make sense with the average consumer. Apple kinda messed things up by popularizing the colour green for SMS. For now, we're left with orange. And it makes sense when green is the colour most people think of when it comes to SMS. If anything, options for different colour schemes should be implemented.

Also, I thought data=encrypted so there's no point in differentiating the two. There's no way they can encrypt outgoing SMS. The only encryption for that is for locally-stored SMS and that's to keep it safe from someone that manages to copy it from your phone so it can be viewed externally.

[generalmanager]

There's no way they can encrypt outgoing SMS.

This is wrong - TextSecure has been sending encrypted SMS for years now. The one thing it couldn't do was data. Afaik there is no unencrypted data, but there is definitely encrypted SMS.

[Anaron]

@lindworm Are you sure? I'm finding it hard to believe that they can encrypt regular SMS to non-TextSecure users. How can other users decrypt such messages? It doesn't make any sense. I know that messages between TextSecure users are encrypted via SMS (old way) and data (new way). Perhaps you misunderstood what I was trying to say. I should have been a little more specific earlier.

[generalmanager]

@Anaron No, the SMS to non TextSecure users are of course not encrypted, but the SMS between TextSecure users are.

I'm not sure how you would want to signal the difference between secure and insecure SMS though. ;-)

[Anaron]

@lindworm Okay. What about green for unencrypted SMS, orange for encrypted SMS, and blue for encrypted push messages? Green obviously wouldn't have the padlock icon and orange/blue would. It's great because blue is already associated with data thanks to Apple's iMessage service. And orange wouldn't clash with the other colours like purple and red.

[generalmanager]

I don't think we should use colors to indicate the message encryption at all. It's simply too confusing. We have the send icon and the top bar lock icon to do that. Please read the discussion in #766 too.

What do you think about the partial coloring instead of the full message body?

[noschinl]

I like the partial coloring; it definitely improves readability. A colored line at the top as in @lindworm's suggestion looks cleaner to me as the one on the right in @phenx-de's mockup (mostly because the latter over-emphasizes the speech-bubble in my opinion).

As for the coloring, I think it is important to note that we are discussing an Android app, not one for iOS. Green has this 'everything is alright' connotation, so using it for SMS seems counter-intuitive.

[eikowagenknecht]

@lindworm Thank you very much for putting our discussion from the other issue to this one in so much detail. I have nothing to add to your first post :+1:

@noschinl I'm glad that you mention the iOS vs. Android difference here. The two systems use distinct visual styles, so I see no need to copy what iMessage does. It seems that the meaning "green = SMS" is not common sense yet for most of the users, especially those from the Android world, as indicated by @lindworm and also consistent with my experience from non-tech-savvy friends.

The single most confusing point for most of them was: "Why are some messages encrypted (meaning green) and some are not (meaning blue)". And also: "Why is there still a lock symbol on non-encrypted messages (meaning blue again)". So they totally got confused.

I can understand the argument that this has been the default coloring in TextSecure for some years now (has it? I'm a fairly new user), but since the rollout to the masses only started recently with the release of version 2, I don't think it's too late to change colors to something more sensible.

[virtualritz]

@phenx-de I had the same misconception about encryption vs non-encryption (green/blue) when I used TS for the 1st time now. And I do 'speak' two dozen computer languages, write software for a living and studied HCI/UX at uni. :) So this needs addressing, imho.

My suggestion would be to have one message bubble color meaning encrypted and one color meaning unencrypted.

This makes the lock icon at the bottom of each message obsolete. Instead, it can be replaced with an icon indicating transport channel. That means we need an icon to represent SMS and one to represent push.

I like @lindworm 's suggestion of using a different shade while the message is traveling. In the light theme this should be a lighter shade of the color, in the dark team a darker.

[virtualritz]

I would still keep the message bubbles of the sender a uniform color (instead of using the bar). It can just be a light shade of the color we end up choosing. I agree that the current colors, green and blue, are too saturated and prominent, also impacting text contrast on the sender's messages negatively. A lighter shade of the color (or darker in the dark theme) can alleviate this.

On that note: in the dark theme, the text is always white on dark gray or blue/green bg message bubbles. That is good. In the light theme, however, the text of the recipient's messages is black on gray but the text of the sender's messages is white on color! This is bad. It requires the visual system of the user to switch every other message, when using the default, light theme. When you use printed docs (black text on white paper) alongside a screen, it is suggested that the screen uses a matching text/bg coloring, precisely for that reason. It is straining for the eyes when you have to invert every time you look at the book or the screen.

For the same reason, in the light theme, the messages should use a light shade of the color, so black text can be used, too, for the sender's messages.

[generalmanager]

@phenx-de You're welcome!

I can understand the argument that this has been the default coloring in TextSecure for some years now (has it? I'm a fairly new user)

Nope, it was basically black on white:

[Anaron]

@lindworm I don't think so. It's only 3 colours, 2 of which are easily recognizable as regular SMS (green) and data (blue). Both the send icon and padlock icon can complement the colours. To totally avoid confusion, it can say something like "Now via SMS" under the message. The same thing is done in Hangouts. With that said, I'm not the average user and this app should be designed for the average user. The less confusing it is, the better. I like @virtualritz's one colour for encrypted and non-encrypted messages idea.

What do you think about the partial coloring instead of the full message body?

I think it's great. I really like the horizontal partial colouring. I think it looks much better than the vertical one. However, I imagine it would look worse with the dark theme. For that reason, I think it's better that we stick with a solid colour for the chat bubble rather than a partial one. The lighter shade indicating that the message is still being sent is a very good idea.

@noschinl

As for the coloring, I think it is important to note that we are discussing an Android app, not one for iOS. Green has this 'everything is alright' connotation, so using it for SMS seems counter-intuitive.

Actually, we're discussing what's currently an Android app. Open Whisper Systems have plans to release an iOS version of TextSecure called "Whisper". They're also going to rename TextSecure on Android with the same name. You can read about it on their blog here. It's important to keep that in mind when discussing changes to the UI. The more consistent the apps are across platforms, the better it is for brand image.

@virtualritz I think you're onto something with the colours. It's better to have black text in a coloured chat bubble just like Kik Messenger. It offers consistency and it's aesthetically-pleasing.

[monreal]

I really really like style of message bubbles from "Colorset 2" above (thin color stripe at top, white bubble). In "Colorset 1" there is not enough contrast between the bubble background and text colors IMHO.

However I do not like the use of orange. Like it or not, Ale seems to have set a standard here. Surely not for the Android platform but keep in mind that TS will be available for iOS really soon and I would fully expect it to be consistent a) with the Android client and b) with the Ale app.

[sagischwarz]

Just a very personal view on one of the colors in the discussion: For me, orange (and yellow) are warning colors, like: "Look, something could go wrong, it has not yet reached 'red', but you have to have a look at it!". I wonder if it is like this for others.

[generalmanager]

@virtualritz

My suggestion would be to have one message bubble color meaning encrypted and one color meaning unencrypted.

I thought about that and really liked the idea at first (you know how much I like the state of encryption to be clear ;-). I agree that it's usually more important to to communicate to the user if his conversations are private than if he has to pay a few cents for each message. But the state of encryption is generally not going to change during the conversation, while the transport does change dynamically and may do so several times a day.

If we do it, I'd propose to use red and green for encrypted and unencrypted messages respectively, for the reasons we already discussed.

In an encrypted conversation the green color will probably positively reinforce the user, to use encryption whenever possible. The question is, if the red will do the opposite for people chatting unencrypted. In the short term this kind of nagging will certainly make users try to get it to green by convincing friends and family to switch to TS. But most users will have only a few TS contacts. If they use TS as their main SMS app, like I do, they will have many more unencrypted conversation full of glaring red "stop signs". That may discourage people more than a little red lock on the send icon ;-).

But I guess we can't solve all problems at once. For now, I think the color should indicate transport, because it's the property which changes more frequently.

I like @lindworm 's suggestion of using a different shade while the message is traveling. In the light theme this should be a lighter shade of the color, in the dark team a darker.

I agree, but for now I'm mainly working on the light theme. When we have a working color set and iconography there, it should'nt be too hard to invert the interface.

I would still keep the message bubbles of the sender a uniform color (instead of using the bar)

I guess that's personal preference. I tried it, but didn't like it too much. It still seemed too playful and toy-like to me. We may consider choosing one for the default and making a seperate theme for the other option.

In the light theme however, the text of the reciepient's messages is black on gray but the text of the sender's messages is white on color. This is bad.

Absolutely. That's why I like the nearly white messages in the mockups above so much. It's really tiring with the current theme.

@Anaron Why do you think it would look worse on the dark theme? I think it looks even better:

That's because I don't have to change the colors of the bars. The sent messages always have a strong color, that doesn't get in the way because it's just a small strip.

I personally dislike the current dark theme, mainly because it uses dark blue bubbles on black.

If we use fully colored but toned down bubbles it will always look bad in the dark theme because it's hard to distinguish dark blue from black. Really dark red would probably look even worse.

The dark theme was actually not much work. I basically just swapped the colors used for text and background, while the color strips and grey notification icons and text stay the same.

@sagischwarz: when used in together with green and red, I feel the same about orange. But when it's used with blue, as phenx-de and I suggested, it doesn't come off as a warning to me.

[Cimbali]

My personal take on this is to have the colour represent the channel, and the padlocks the encryption.

That being said, I agree with @sagischwarz on orange being a bad choice. A little bit of warning connotation, but especially it's blue's complementary colour and that just doesn't mix well. I mean, even if the colours are only applied to a part of the message, having blue and orange messages next to each other - which could happen - is just plain ugly. Take a look at @Anaron 's screenshot if you're not convinced.

[Anaron]

@lindworm My goodness, you're right. What I imagined was much different than that screenshot.

[generalmanager]

@Cimbali

I don't think it's that bad. @Anaron's screenshot is veeeery colorful ;)

@lindworm My goodness, you're right. What I imagined was much different than that screenshot.

Thanks!

[eikowagenknecht]

@lindworm: I very much like the dark theme as shown in your new image as well. Looks very clean and crisp to me.

Allthough I am still not quite happy with green as the color for SMS, but there seem to be some valid points for green, so I'd like to collect them here.

Reasons to use green instead of yellow/orange:

• Apple uses it, like it or not. TextSecure will be available on iOS in the near future and since it will be run next to iMessage it makes sense to use the same coloring scheme. For consistency across platforms the Android version should use the same colors as the iOS version.
• Orange and blue don't look good next to each other (see screenshot from @Anaron). It might be less disturbing with the bars at top of the bubble, but still green and blue fit together better.
• Orange is seen as "warning" by some people as well. So that just might give the confusion another new turn: People now might consider the messages unencrypted even when they really are encrypted. That's slightly better (no leaking of private information when the user considers it to be safe), but still not perfect.

While the main reason to use yellow/orange would be:

• Avoid confusion, so that people don't think messages are encrypted when they in fact are not.

Regardless of the final decision, there really is a need to explain the colors to new users to avoid confusion one way or the other, for a discussion how this could be accomplished, see #908.

[generalmanager]

@phenx-de

Apple uses it, like it or not. TextSecure will be available on iOS in the near future and since it will be run next to iMessage it makes sense to use the same coloring scheme. For consistency across platforms the Android version should use the same colors as the iOS version.

Point taken, I'm not a fan but I agree that it should be consistent across platforms. But I still think it's better to "surprise" Apple users with a new SMS color, than to have lots of people think green means it's encrypted (when in fact it may not be). These people will then be shocked/unpleaseantly surprised, that they can't seem to communicate encrypted at home (where there is wifi).

Orange and blue don't look good next to each other (see screenshot from @Anaron).

Did you see the two examples with orange and blue messages in one screen I just posted? I don't mind them at all.

Orange is seen as "warning" by some people as well.

That usually happens in the context of green and read, which then makes up a traffic light.

[Cimbali]

If we go for the top (or side) colour strip we can literally use any colour. Why not a darkish blue for push and some light blue or even turquoise (yeah, compromising between blue and green here) for the text messages ? That way you'd have a light/dark contrast as well.

That would give something like this : http://46.19.37.204/playwithcolours.html#push=#009AD9&text=#5ee5c6 (if there is an authentication request just cancel it you'll be fine) Code is here : http://jsfiddle.net/5pHb5/2/

I just think we should experiment a bit before selecting any colour :) (e.g. to illustrate my point from earlier, this still looks bad : http://46.19.37.204/playwithcolours.html#push=#009AD9&text=#f34800)

[0xACE]

Don't change the message boxes. One could easily argue that orange messages are broken...

Do not use colours to indicate encryption. The padlock does it. If you believe the padlock is too small, experiment with having it as a big faded background of the message (something tells me this isn't a good solution, clutter). Or even just increase the contrast of the message sub-text.

Having that small bar instead of a full coloured box will make it more difficult to find your message, say that the screen is cluttered with long texts, the full coloured message box will be much less confusing than the coloured bars. Do not apply these bars, it would make it more difficult to identify who's who. The bars makes it more difficult for the user to find their messages, do not implement this. You need a clear indication of who's message it is. Good luck finding that small bar in sunlight.

Arguing what colour means what will probably be difficult, all cultures may not consider the colours to mean the same...

I agree that the app doesn't make it clear what the colours mean, but neither does any of your suggestions of just changing it to another colour. Icons or text is the more appropriate way to make sure users understand.

Leave the full coloured green and blue message boxes as they are. The encryption is indicated by the padlock. Messages without padlocks are implicitly unencrypted. Implicit vs Clutter is another discussion... Maybe give a greater contrast to the sub-text of the text messages is a better idea.

OT: in group chats are participants given different coloured message boxes?

Red can mean error,danger, superb job, extra important Orange can mean deceit, distrust, almost Green can mean good, success, money Blue can mean health, softness, understanding Purple can mean royalty, nobility

My point is colours are confusing, keep the blue and green as they are.

Regarding the colour consistency with the other mentioned issues. You're going to further complicate the setup. The app was intended to make encryption easy. A novice user seeing orange encrypted message while others have green ones will make the user believe it can't trust this program without some magical procedures. Don't make it more complicated, you will cause distrust with novice users and eventually scare them off...

[virtualritz]

To consider: WhatsApp, too, uses slightly green colored sender message bubbles.

But: FB messenger uses blue, Kakao Talk (de facto standard in South Korea, has >100 million users, mainly in South East Asia) uses yellow! Both FB messenger and KakaoTalk do so for obvious branding reasons.

And a big chunk of the users of these apps are indeed on iOS.

I guess the bottom line is that it is not so important to copy iMessage when it comes to message coloring. What we can take from this is that all these apps use one consistent color, throughout the app, for message bubbles of the sender and a different one for the bubbles of the receiver. However, all these apps also do not have an emphasis on encryption. That is, the use case of clearly communicating the encryption status of a message does not apply to them.

So what we need, if we like the to make the transition for users of other messaging apps easy, is a single default color for the sender's message bubbles. For the common case. Then we have the specific case, which is unencrypted SMS.

Here are the cases with resp. suggestions:

• Encrypted (push) (default color)
• Encrypted (SMS) (default color, SMS transport indicator icon)
• Unencrypted (SMS) (other color, SMS transport indicator icon)

Again, I think key is consistency, not copying what app X or Y uses for a color but how the majority of widely adopted messaging apps use color in message bubbles.

From that pov it does not matter what color we use for the sender's bubbles. All that does matter is that the use of color is consistent and doesn't cause confusion. Currently it does cause confusion as many new users think that blue translates to unencrypted. This needs a solution.

P.S.: This is OT, but ... When you think about modern messaging apps, we need to think about customization/theming. Because people spend so much time in these apps, they like to customize them. I predict that people will ask for this being added to TS/Whisper, in the very near future and I also predict that this will be key to the success to TS/Whisper particularly in the Asian countries, specifically South Korea and Japan. This means being able to possibly customize:

• background wallpaper/color
• sender message bubble wallpaper/color
• receiver(s) message bubble wallpaper/color
• text color(s)
• message icons/emoticons/emoji

KakaoTalk is a prime example of this. I just though to mention this makes sense as it gives a good context on the importance of message bubble coloring in app like TS/Whisper. ;)

[generalmanager]

@virtualritz I fully support everything you just wrote. If we really do use only two colors, I think green for encrypted and red for unencrypted are the most intuitive choices. And we can just take the SMS icon from the Android Icon Pack to use in the message bubbles.

I also just uploaded some examples for signaling trust with badges and the "horizontal colored strip" skin in #910.

[0xACE]

@lindworm: virtualritz said that there should only be one colours rather than two. Don't have the colour indicating encryption, it's only going to confuse users.

Only thing I have to add regarding virtualritz post: be careful with what icons you add, don't clutter the screen if it's not necessary. A text/SMS app that has an icon indicating that it was sent as SMS may not be the best idea, however it's probably less confusing than colours.

It's worth mentioning:

User A Scenario (Exclusively uses SMS)

• The SMS icon is unnecessary as all texts are sent by SMS.

User B Scenario (Exclusively uses Data network)

• The dataplan icon is unnecessary as all texts are sent by data.

User C Scenario (Mixes between SMS/Data network)

• Now has icons on all Text messages. Doesn't each rendered icon require more resources?

virtualritz's plan only had icons for SMS, interpret the scenarios as you like. If you decide to add a icon the problem will be how do you determine which icon to show? Do you show the SMS icon because it may cost? Which is not universally true. Atm TextSecure isn't used by the majority, you will possibly have this icon on most messages.

[generalmanager]

@0xACE @virtualritz wrote that he wants to use one color for all encrypted traffic (the default color) and one color indicating unencrypted transport (second color).

[0xACE]

@lindworm you are right, I misread it.

I still believe encryption shouldn't be indicated by a colour. Giving it the colour green would indicate that the message wasn't compromised, which it may have very well been, the same goes for the padlock, however green could be interpreted as "All good".

[generalmanager]

@0xACE How should the message have been compromised? Via MITM if you didn't verify your contact's key? We are working on a solution to indicate the trust level in #910. We will probably use some badges to do that, the exact colors and symbols are not yet fixed Join us if you like.

[0xACE]

How should the message have been compromised?

Say if the phone has been comprimised...

Maybe you missed it as I was editing my older post.

Regarding the colour consistency with the other mentioned issues. You're going to further complicate the setup. The app was intended to make encryption easy. A novice user seeing orange encrypted message while others have green ones will make the user believe it can't trust this program without some "magical procedures". Don't make it more complicated, you will cause distrust with novice users and eventually scare them off...

I agree that the additional levels of trust would be a good idea, however the plans as I've seen them will scare off novice users. More steps isn't considered to be attractive to novice users. The quoted argument may not have been properly thought through as I just wrote it in the spur of the moment.

I even changed the comments on the small bars you guys are pushing for, it feels like you missed it:

Having that small bar instead of a full coloured box will make it more difficult to find your message, say that the screen is cluttered with long texts, the full coloured message box will be much less confusing than the coloured bars. Do not apply these bars, it would make it more difficult to identify who's who. The bars makes it more difficult for the user to find their messages, do not implement this. You need a clear indication of who's message it is. Good luck finding that small bar in sunlight.

The complete message may be better to read than these small quotes.

Yeah I'm trying to delve into this project, atm I'm trying to figure out how to compile and successfully run the app. It seems to be crashing by some "FATAL EXCEPTION Async 3" or w/e. I have very limited resources to test the app, can't run the emulator, infact my PC wont run the android IDEs, sad how resource hungry they are. I've setup some tools along with VIM to run this project though.

I'm limited in time too, however I slowly get involved in the conversations I stumble upon. Only reason I haven't contributed with merge requests is because I can't get it running (it compiles but crashes when I try to open a conversation... Btw does it also takes several minutes for you to build this app?).

(@moxie0 @rhodey , sorry for including you, hoping you could answer this one:) Is there some dev irc channel, mailing list or something for devs to communicate or should I post a issue regarding help to compile/run TextSecure?

I'm sorry for being negative to most suggestions, I'm just hoping better results.

[L3st3r]

There is a mailing list for developers. You can subscribe to it here: https://lists.riseup.net/www/info/whispersystems

About the colours: I would stay with fully coloured bubbles just because it looks best in my opinion and the coloured bars just distract the eyes from the text. And additionally the bars need extra space in the bubbles. When we make the colours a bit transparent (maybe 80% as said in another issue) I don't see why that should be a problem or look unprofessional.

And I think we should not change the colours anymore at all, neither their meaning (encrypted/unencrypted) nor the choice of colours (green vs orange). It would confuse the hell out of the current TS users. Instead we should just explain what the colours mean (#908), than they shouldn't be confused anymore.

[Anaron]

Yeah, it's probably best to leave the colours alone and work on explanations for them so average users aren't confused.

[generalmanager]

I just did a quick count for the different points we are discussing and added it to the first post. If I misunderstood anybody, just tell me and I'll change your vote. If you have an opinion to one of those topics and aren't listed, just answer in the thread.

Currently it looks like colors and meaning of the colors would stay the same while more people like the light messages with colored stripes than the old colors.

[tinloaf]

Oh, if we're having a vote... ;-)

I like the "New style messages with colored bands (colors to be discussed) on top or on the side" - especially when they are on the side. Too much color is a bit too much for my eye.

[0xACE]

@lindworm the coloured stripes is definitely a downgrade. If the screen is partly obscured the stripes will likely be covered, try to read the message in horizontal mode, it's likely that the stripe isn't visible. As I mentioned earlier, it will be much more difficult to identify the stripes in difficult lightning situations. The whole stripes only comes with downsides compared to full coloured boxes. The only argue you can hold vs full colours boxes is difficulty to read text, but that is fixed by better choice of text colours.

Do not delve deeper into the stripes, you're making the information harder to reach. Really, just try to see small details in bright sunlight. The stripes are obscuring information that is otherwise properly relayed to the user as it is, it doesn't need change.

[eikowagenknecht]

@0xACE Why is the transport the message was sent with of such an importance to you? The worst that could happen (at least that I can think of) if a user misses this information is that he doesn't see that he was charged some money for the message. If that happens once in a while in extreme lightning situations or in horizontal mode... then what? That doesn't seem so important for me to justify the currently overwhelming representation with full-colored message bubbles.

[generalmanager]

@tinloaf There you go! Any thoughts about the other meaning of the color (transport/encryption) do you like the current colors or do you want a change?

@0xACE I don't think the stripes will be an issue with any of that the position and shape of the bubble makes clear who sent it. And the stripes are way more colorful than the unicolored bubbles could ever be, if we want them to have good contrast with the icons and dates.

I actually think that it'd be easier to identify a small but colorful item than a big but desaturated one.

[generalmanager]

One more thing: What do you guys think about making the incoming messages also convey the transport/encryption via colors?

• It would be very helpful when you have to pay for incoming messages, mainly while roaming. In many countries, there is plenty of cross-border communting going on and because people are living everywhere, many get logged into the wrong network, even several kilometers / miles away from the border. If you then receive an SMS the costs are outrageous and you even have to pay half of it. The same applies when you are traveling.

To make it obvious: that's the border between Belgium and the Netherlands: http://4.bp.blogspot.com/-EowOOHSiOsU/TxMtob-cGBI/AAAAAAAADm8/RfuUGdudukM/s1600/baarle-house-detail1.jpg And this is between Germany and the Netherlands: http://media-cache-ak0.pinimg.com/736x/3f/98/d1/3f98d1f459fe0abe05e7bd1931c77873.jpg

• The current layout is not consistent. One of the first rules of UI design is, not to make one rule/symbol apply here but not there. Consistency is king.

[irv]

i do like the look, but to my eyes at least there's not enough contrast there between the "sending" and "sent" states

[generalmanager]

@irv about which picture exactly are we talking? We have a lot which might fit your description ;)

[SanderGit]

When redesigning the colors please pay attention at how 'color blind' people experience it. I believe the colored bands will take care of this just right, provided the difference between the colors is clear enough. I trust @virtualritz will have knowledge on this (UX basics?) See also: http://accessibility.psu.edu/colorblindnessdetails

[backspace]

I agree with those saying that the colour shouldn’t be used to indicate whether it’s been securely communicated.

[irv]

@lindworm either the full colour of the stripe version in blue or orange

[PulsarFX]

I'd like to use less color to indicate what is what. I like the vertical indicator very much ;) I don't agree that the coloring is needed to easier find the messages. Switch to dark theme to find out. Left and right alignment makes it easy to identify sender and receiver. We should also not stick to any pseudo standard like green is for sms because apple told its user so...

My suggestion is, to use text to indicate the transport. The line under each text message has enough space next to the padlock to append "SMS" or "PUSH". If it's been sent unencrypted, show an open padlock, don't just hide it, because it would be inconsequent. With text anybody knows at a glimpse how the message was sent - if he or she actually cares.

[generalmanager]

@maulwuff I actually do use the text to indicate transport in the latest design. You can see it above in the dark blue theme.

[mcginty]

I'm becoming more convinced from this conversation that we should look into a way to provide information about the security of the conversation via color instead of iconography, and it seems like most people are in agreement on that part.

@phenx-de is right in that my original choice for green/blue was to be compatible with those who understand the iMessage paradigm. TextSecure iOS was also using their design as a standard, so it all fit together. However, this has definitely ended up adding more confusion than utility and nothing should be considered holy in any of these design choices. If we can find a way to change the colors of the bubbles to indicate secure/insecure without confusing those who are already on TextSecure, I don't see any problems going that route!

On a general aesthetic note, personally I'm much more focused on clean design and establishing trust with the user via consistent messaging than a particularly professional look. @lindworm's dark theme design with the highlight bar at the top is pretty gorgeous IMO - bounds ahead of that crappy one I threw together. I don't know why, but for the light theme those highlight bars don't feel like they fit the rest of the design. Definitely welcome disagreement if I'm the only one though. Maybe they just look a bit too much like a Microsoft Office product or something. I very mcuh agree with @virtualritz that we might look into slightly less burn-your-eyes-out solid colors and not having different text colors for incoming/outgoing to increase legibility. My color choices, as exciting as they may appear, are probably a bit much ;).

[generalmanager]

@mcginty

If we can find a way to change the colors of the bubbles to indicate secure/insecure without confusing those who are already on TextSecure, I don't see any problems going that route!

I'll make something up!

Could you also take a look at #910? We're trying to come up with the best solution to convey the verification status of contacts.

@lindworm's dark theme design with the highlight bar at the top is pretty gorgeous IMO

thanks!

I don't know why, but for the light theme those highlight bars don't feel like they fit the rest of the design.

I like them in both designs, but I think they are especially nice in the dark theme - with uniformly colored bubbles the problem with dark themes is, that the lighter colors don't translate well. On black, all colors that are only a few shades away are nearly black. Thanks additive color mixing :(

[PulsarFX]

@lindworm you mean next to the input box? I mean like that:

Each message may be sent using another channel, so having an indicator next to the input box is not enough.

[generalmanager]

@maulwuff I see.

Ok I'll try the symbol as well as the text!