1079905 - [UX] Consider alternate designs for Loop's green call buttons

Status: RESOLVED FIXED

(Firefox :: General, defect)

Description

[Darrin Henein [:darrin]]

Attachment: greenbuttons.jpg

The green buttons with the video/audio icons may not be distinct enough, we should evaluate some alternatives (including color-only changes).

Comment 1

[Darrin Henein [:darrin]]

Attachment: loop-button-options.png

Philipp, not sure if you have any comments here or if we should get legal involved? Do you think changing the color is best? I personally find option A most appealing, the only drawback is that the green/action buttons get lost with all the other blue buttons we have.

Comment 2

[Darrin Henein [:darrin]]

Would love to also get shorlander and mmaslaney's thoughts here. For legal concerns, we are trying to avoid the rounded green camera buttons.

Comment 3

[Michael Maslaney [:mmaslaney] ([e-mail])]

Couple options to consider

Version 1: Normal style button + green icon

Version 2: Default style button

Version 3: Teal

Version 4: Teal Gradient 

http://people.mozilla.org/~mmaslaney/hello/Hello-button-variations.png

Comment 4

[(Currently slow to respond) Philipp Sackl [:phlsa] (Firefox UX) please use needinfo]

I think the blue version works best. We'll also use it in the permissions UI for device sharing, so it's consistent with that.
Teal also looks very nice, but I'm afraid it wouldn't solve the possible legal issues.

By the way: another way to work around this besides the color would be changing the icon itself significantly. I took a stab at this once, but didn't really get to a good solution.

Comment 5

[Stephen Horlander [:shorlander]]

Something I haven't seen considered is green on green or teal on teal — http://cl.ly/image/351M2k0o370o

I like the teal but I prefer the green in this case because it is farther away from the blue we are using in other places.

Alternative Icon ideas — http://cl.ly/image/2h3s093H263i

Comment 6

[Darrin Henein [:darrin]]

Ok, I'm leaning towards the teal background with white text/icon. Same icon as we currently have. Michael/Stephen, can you confirm for me that this teal is something you're willing to live with as part of our ongoing palette? Is there an existing palette you're drawing this from?

Comment 7

[Michael Maslaney [:mmaslaney] ([e-mail])]

I OK with using Teal or blue using the same icon. The Teal was taken from a color palette Sean Martell worked up for Project Chameleon.


Stephen, I love the idea of using green, but I think we face a bit of a challenge trying to define an alternative video icon.

Comment 8

[Darrin Henein [:darrin]]

Ok, so going with replacing all green buttons in the Hello UI with Summit Teal vibrant (#5BC0A4) and white foreground (text + icons). Also shifting the pill button in the contacts UI to a shorter, rounded rect, in line with our other Hello buttons (see bug 1075203). Thanks everyone!