Last Comment Bug 820147 - The "+" icon is confusing based on the User Test in South America
: The "+" icon is confusing based on the User Test in South America
Status: VERIFIED FIXED
visual design, interaction, UX-P1
: polish
Product: Firefox OS
Classification: Client Software
Component: Gaia (show other bugs)
: unspecified
: All Other
P1 normal (vote)
: B2G C4 (2jan on)
Assigned To: Kevin Grandon :kgrandon
:
:
Mentors:
Depends on: 820145 823572
Blocks:
  Show dependency treegraph
 
Reported: 2012-12-10 14:16 PST by Patryk Adamczyk [:patryk] UX
Modified: 2013-01-12 15:01 PST (History)
11 users (show)
See Also:
Crash Signature:
(edit)
QA Whiteboard:
Iteration: ---
Points: ---
+


Attachments
screenshot of change (11.75 KB, image/png)
2013-01-03 15:53 PST, Naoki Hirata :nhirata (please use needinfo instead of cc)
no flags Details
Screenshot of final implementation, Jan 6 (429.29 KB, image/jpeg)
2013-01-06 09:26 PST, Josh Carpenter [:jcarpenter]
no flags Details
New Edit Contact Icon (1.49 KB, image/png)
2013-01-06 11:39 PST, Peter La
no flags Details
New Edit Contact Icon (slight tweak to pencil spacing) (3.27 KB, image/png)
2013-01-07 14:00 PST, Peter La
no flags Details
Screenshot for final implementation, Jan 7 (576.55 KB, image/jpeg)
2013-01-07 14:02 PST, Peter La
no flags Details

Description User image Patryk Adamczyk [:patryk] UX 2012-12-10 14:16:00 PST
People don't understand that the "+" icon means compose, they felt that anything with a pencil meant compose. So we need to scrub the UI for "+" icons and perhaps replace them with a pencil icon instead.
Comment 1 User image Julien Wajsberg [:julienw] 2012-12-18 10:47:19 PST
In the SMS app, we have a pencil icon _and_ a "+" icon. The pencil icon means "edit" and the "+" icon means "compose". This is very confusing as you're saying, but more because we have the pencil icon as well...
Comment 2 User image Peter La 2012-12-18 12:50:41 PST
The upcoming fix for bug 820145 should help with this problem.  It should free us to use a pencil for compose.
Comment 3 User image Peter La 2012-12-20 10:00:20 PST
After discussing with Patryk, we decided on the following.

For E-Mail and SMS apps, the "+" icon will become the "Pencil+Document" icon that was formerly our "Edit" icon.

This change will rely on the fix for Bug 820145, which changes the "Edit" icon to the word "Edit".

Assigning to Sam.
Comment 4 User image Peter La 2012-12-20 10:01:38 PST
Further clarification:

Apps like Contacts and Calendar will retain the "+" icon in their headers.  Only E-Mail and SMS will change, as the 'compose' metaphor makes sense for these apps.
Comment 5 User image Josh Carpenter [:jcarpenter] 2012-12-28 00:52:15 PST
(In reply to Peter La from comment #4)
> Further clarification:
> 
> Apps like Contacts and Calendar will retain the "+" icon in their headers. 
> Only E-Mail and SMS will change, as the 'compose' metaphor makes sense for
> these apps.

+1 for this approach.
Comment 6 User image Sam Joch [:samjoch] 2012-12-29 22:25:05 PST
Landed in uxbranch https://github.com/gordonbrander/gaia/commit/9fbec6e1729ea088cdd2ac14ba0e4c71c426d55a

The best will be to finish that one (https://bugzilla.mozilla.org/show_bug.cgi?id=82014) too
Comment 7 User image Sam Joch [:samjoch] 2012-12-29 22:26:55 PST
oops wrongs link: https://bugzilla.mozilla.org/show_bug.cgi?id=820145
Comment 8 User image Chris Lee [:clee] 2013-01-02 10:36:46 PST
(In reply to Josh Carpenter [:jcarpenter] from comment #5)
> (In reply to Peter La from comment #4)
> > Further clarification:
> > 
> > Apps like Contacts and Calendar will retain the "+" icon in their headers. 
> > Only E-Mail and SMS will change, as the 'compose' metaphor makes sense for
> > these apps.
> 
> +1 for this approach.

+1 as well -- this makes sense.
Comment 9 User image Chris Lee [:clee] 2013-01-02 10:37:09 PST
Is there any work to be done in this bug?  Or are we tracking everything in bug 820145?
Comment 10 User image Julien Wajsberg [:julienw] 2013-01-02 13:56:37 PST
Chris: Bug 820145 is about using "edit" instead of the pencil icon. This bug is about using the pencil icon instead of the "+" icon.

The patch that landed and was reverted in Bug 820145 is only about the first part so this bug should stay.
Comment 11 User image Chris Lee [:clee] 2013-01-02 15:29:42 PST
Thanks for clarifying.

Both bugs are important and should be blockers as these are primary use cases we need to support.
Comment 12 User image Joe Cheng [:jcheng] (please needinfo) 2013-01-03 01:46:18 PST
Triage: BB+, in agreement with comment 11
Comment 13 User image Naoki Hirata :nhirata (please use needinfo instead of cc) 2013-01-03 15:53:43 PST
Created attachment 697707 [details]
screenshot of change

uxbranch has 2 pencil icon for the sms app.  I think that's going to cause some confusion.
Comment 14 User image Sam Joch [:samjoch] 2013-01-03 16:02:02 PST
Yes cause this bug depends on https://bugzilla.mozilla.org/show_bug.cgi?id=820145
Comment 15 User image Naoki Hirata :nhirata (please use needinfo instead of cc) 2013-01-04 08:01:57 PST
Ok, I would like that bug to land before qa-verifying this one, please.  :)
Comment 16 User image Peter La 2013-01-04 12:03:48 PST
*** 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 17 User image Josh Carpenter [:jcarpenter] 2013-01-06 09:26:03 PST
Created attachment 698444 [details]
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 18 User image Peter La 2013-01-06 11:39:36 PST
Created attachment 698466 [details]
New Edit Contact Icon

ATTN: Vivien

This is the new Edit Contact icon specially for the Contacts app header.
Comment 19 User image Kevin Grandon :kgrandon 2013-01-07 02:29:19 PST
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 20 User image Vivien Nicolas (:vingtetun) (:21) - (NOT reading bugmails, needinfo? please) 2013-01-07 04:32:56 PST
https://github.com/mozilla-b2g/gaia/commit/cba0de2416821a43dc955b4cc4a423c0be4d1006
Comment 21 User image Peter La 2013-01-07 14:00:02 PST
Created attachment 698853 [details]
New Edit Contact Icon (slight tweak to pencil spacing)

Use this as the final edit contact icon.
Comment 22 User image Peter La 2013-01-07 14:02:38 PST
Created attachment 698855 [details]
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.
Comment 23 User image J Zimbrick 2013-01-12 15:01:57 PST
It appears that all icons intended to be changed were successfully replaced in Unagi build 20130112070202.

Verifying as fixed.

Note You need to log in before you can comment on or make changes to this bug.