798575 - "+" and "pencil" button placement is inconsistent in main SMS and Email screens

Status: RESOLVED FIXED

(Firefox OS Graveyard :: Gaia::SMS, defect, P2)

Description

[Mary Trombley]

Attachment: switched + and pencil buttons

STR: Open main email screen and main SMS screen

Expected: Buttons should be placed consistently across apps

Actual: "+" and "pencil" button placement is inconsistent in main SMS and email screens. Their positions are switched. (See attachment)

Build: 2012-09-18 10:21:32

Comment 1

[Andrew Sutherland [:asuth] (he/him)]

This screenshot is all white for me, but we moved the pencil icon down to the bottom of the e-mail app screen because people seemed to think it was the compose button.

I'm not sure if this moots the issue or just changes the complaint, but Casey is the person for any such debates for the e-mail app at least.  It's worth noting that e-mail has a special search mode where having the pencil on the bottom is helpful for consistency since the position at the top of the bar is not free in that scenario.

Comment 2

[Casey Yee]

Besides what Andrew has already stated.  We also need to maximize the available header space for longer folder names.

Though Mary is correct in that there is a need to be consistency in button placement where possible.  This is an issue that we will be addressing with the various app UX owners.

Comment 5

[Chris Lee [:clee]]

This is a blocker IMO given users do not know how to compose an SMS without this fix.  

It's clear in our user research that users were very confused by the pencil icon.  

As a separate note, does the '+' add any functional value here once we change the behavior of the pencil icon?

Comment 6

[Chris Lee [:clee]]

Moving priority to at least a P2 (maybe should be a P1).

Comment 7

[Joe Cheng [:jcheng] (please needinfo)]

Triage: BB+ for consistency and agree with comment 5

Comment 8

[Andrew Sutherland [:asuth] (he/him)]

What's the action we're actually taking here?  Is the SMS app going to change to be consistent with the e-mail app in terms of icon usage, or vice versa?

Comment 9

[Kevin Grandon :kgrandon]

I don't think anything needs to happen for this bug.

820145 - Covers changing the pencil icon to text. (Pull request pending review)
820147 - Covers changing the '+' icon to the pencil + paper to mean 'compose'.

Once the above two bugs are fixed, I think this one will be as well.

I would say that this should either be a meta or duplicate - probably don't need to block here.

Steve feel free to assign to me if you'd like.

Comment 10

[Steve Chung [:steveck]]

Hi Andrew,
Based on comment #5, I'll replace the edit button image in SMS with the icon used in email.

Hi Kevin,
I saw your patch and you replaced the icon with text. We already have a nicer icon in email. Since this issue is raised for style inconsistency, I'll sync the icon in SMS to email first. Thanks for your reply.

Comment 11

[Steve Chung [:steveck]]

Attachment: Patch for replacing the edit icon

Hi Borja, I overwrite the edit icon style and sync the icon to email app. I also removed the unused icon images in this patch.

Comment 12

[Peter La]

*** NOTE ***

UX is currently discussing this, along with Bug 820147 and Bug 820145, and will be posting a revised solution.  We need to rework the solution to take into account the effect on Contacts and Call Log, which also have edit icons.

PLEASE HOLD OFF ON ANY WORK until Josh has posted a revised solution with wireframe illustration of all screens impacted by these issues.  To summarize, the group of related issues are:

https://bugzilla.mozilla.org/show_bug.cgi?id=820147
https://bugzilla.mozilla.org/show_bug.cgi?id=820145
https://bugzilla.mozilla.org/show_bug.cgi?id=798575

Comment 13

[Josh Carpenter [:jcarpenter]]

Attachment: Screenshot of final implementation, Jan 6

Attached is a screen shot depicting the final implementation for this cluster of related issues. Please let me know if there are any questions.

Comment 14

[Peter La]

Attachment: New Edit Contact Icon

ATTN: Vivien

This is the new Edit Contact icon specially for the Contacts app header.

Comment 15

[Kevin Grandon :kgrandon]

Lots of bugs to track the icon issue - if you don't mind I'll consolidate them under the same owner as the fix should be pretty simple. WIP: https://github.com/KevinGrandon/gaia/compare/bug_820145_new_icons

Comment 16

[Steve Chung [:steveck]]

Er... I'm fine with that since you already changed the style in building-block. But please also modify the icon in email. Thanks.

Comment 17

[Vivien Nicolas (:vingtetun) (:21) - (NOT reading bugmails, needinfo? please)]

https://github.com/mozilla-b2g/gaia/commit/cba0de2416821a43dc955b4cc4a423c0be4d1006

Comment 18

[Peter La]

Attachment: New Edit Contact Icon (slight tweak to pencil spacing)

Use this as the final edit contact icon.

Comment 19

[Peter La]

Attachment: Screenshot for final implementation, Jan 7

Updated to include Gallery and Settings -> Display.  A scrub of the UI shows no more instances of offending 'Edit' icons.