970213 - replace "Check for Updates" placeholder icon with appropriate icon

Status: VERIFIED FIXED

(Firefox for Android Graveyard :: Web Apps (PWAs), defect, P3)

Description

[Myk Melez [:myk] [@mykmelez]]

The "Check for Updates" item in the about:apps menu has a placeholder icon that we should replace with an appropriate icon that is designed to convey the action being taken.

Comment 1

[Myk Melez [:myk] [@mykmelez]]

WesJ: what's the best way to get some graphic design help with this?

Comment 2

[Wesley Johnston (:wesj)]

Ian can assign someone to work on it. It would probably help him if we could triage this and assign a priority for the SynthApk v1 release.

Comment 3

[Myk Melez [:myk] [@mykmelez]]

I made it a P3, since the placeholder icon is workable, if mediocre.  And there isn't a licensing concern, as it was in the public domain (although I remember where I got it from now).  So it isn't a blocker for shipping, just a nice-to-have (but a small, well-contained project that seems doable in the time remaining, provided there's someone to do it!).

Comment 4

[Ian Barlow (:ibarlow)]

Assigning to Anthony for some visual design love. Anthony, this "check for updates" icon could use some help, when you have a chance :)

http://cl.ly/image/1k0z2J0O3t3d

Comment 5

[Anthony Lam (:antlam) Find me, @antlam on Slack!]

Sure, when is this icon needed and where can I find the current for size/dimension specs?

Comment 6

[Myk Melez [:myk] [@mykmelez]]

(In reply to Anthony Lam from comment #5)
> Sure, when is this icon needed and where can I find the current for
> size/dimension specs?

We don't have a hard due date, but I'd prefer to have it within the next two weeks.  The current icon is:

http://mxr.mozilla.org/mozilla-central/source/mobile/android/themes/core/images/update.png

Comment 7

[Anthony Lam (:antlam) Find me, @antlam on Slack!]

Attachment: Screen Shot 2014-03-25 at 2.04.13 PM.png

Here is a shot of the icon. Let me know what file format or dimensions you want this in.

Just in case, here it is in .PNG designed to be at 32px x 32px, it has a transparent background though so the size is actually closer to 28px x 30ox.

https://people.mozilla.org/~alam/Assets/Icon_android_updateapps.png

Comment 8

[Myk Melez [:myk] [@mykmelez]]

Attachment: Screenshot_2014-03-25-21-32-14.png

(In reply to Anthony Lam from comment #7)
> Here is a shot of the icon.

Thanks, Anthony, that looks great!


> Let me know what file format or dimensions you want this in.
>
> Just in case, here it is in .PNG designed to be at 32px x 32px, it has a
> transparent background though so the size is actually closer to 28px x 30ox.
> 
> https://people.mozilla.org/~alam/Assets/Icon_android_updateapps.png

The aboutBase.css file specifies icons as having both width and height of 1.8em:

http://mxr.mozilla.org/mozilla-central/source/mobile/android/themes/core/aboutBase.css?rev=3e9c2f29f4ca#86

That causes this 32x32 PNG to look a bit large relative to the Marketplace icon above it, as shown in this screenshot, presumably because it's being stretched to the same dimensions, and the Marketplace icon is 50x50 (although there are a few pixels of padding on all sides):

http://mxr.mozilla.org/mozilla-central/source/mobile/android/themes/core/images/marketplace-logo.png

So perhaps a 50x50 version of this icon would work best?

Comment 9

[Anthony Lam (:antlam) Find me, @antlam on Slack!]

50px by 50px it is! .PNG?

Here you go. Again, just under 50 x 50 to keep with the same padding and proportions of the original.

https://people.mozilla.org/~alam/Assets/Icon_android_updateapps50.png

Comment 10

[Myk Melez [:myk] [@mykmelez]]

Attachment: Screenshot_2014-03-25-22-37-35.png

(In reply to Anthony Lam from comment #9)
> 50px by 50px it is! .PNG?

PNG!


> Here you go. Again, just under 50 x 50 to keep with the same padding and
> proportions of the original.
> 
> https://people.mozilla.org/~alam/Assets/Icon_android_updateapps50.png

Hmm, it looks like this image is 38x48; and while it's clearer, it still looks bigger than the Marketplace icon above it, because it's distorted (stretched) horizontally; which, now that I take another look at it, was true for the 32x32 icon as well.

I think the problem is with the dimensions.  Since the style rules specify that icon images are 1.8em square, and this image is taller than it's wide, Gecko is stretching it horizontally to fit the specified dimensions.  In which case the fix is to resize the image so that it's exactly 50x50, without actually modifying the size of the icon itself.

So I tried using ImageMagick to "extend" the image to 50x50, which adds space to the image without modifying any existing pixels:

> convert -gravity center -extent 50x50 -background transparent old.png new.png


Here's the result, which looks identical to the original image, except for the transparent padding (an extra 6px on each side and an extra 1px each on the top and bottom):

https://people.mozilla.org/~myk/update-50x50.png

And this attachment shows what it looks like in situ.


Anthony: is this a faithful representation of the icon?

Comment 11

[Anthony Lam (:antlam) Find me, @antlam on Slack!]

Ah, right. Well, that looks good to me. 

Thanks!

Comment 12

[Myk Melez [:myk] [@mykmelez]]

Attachment: patch v1: replaces icon

(In reply to Anthony Lam from comment #11)
> Ah, right. Well, that looks good to me. 
> 
> Thanks!

Thank *you* for the great icon!

Comment 13

[Myk Melez [:myk] [@mykmelez]]

https://hg.mozilla.org/integration/mozilla-inbound/rev/e97d7180456b

Comment 14

[Carsten Book [:Tomcat]]

https://hg.mozilla.org/mozilla-central/rev/e97d7180456b

Comment 15

[Myk Melez [:myk] [@mykmelez]]

Comment on attachment 8396806 [details] [diff] [review]
patch v1: replaces icon

[Approval Request Comment]
Bug caused by (feature/regressing bug #): 
  Bug 934760.

User impact if declined: 
  Trivial: users will see a different icon next to the Check for Updates
  item on the Tools > Apps page.

  But there's a code hygiene issue, as the current icon is a placeholder
  from a third party that says it's in the public domain, and replacing it
  with an icon we designed ourselves protects us against that party being
  wrong about the licensing status of the placeholder.

Testing completed (on m-c, etc.): 
  The fix landed on Central earlier today.

Risk to taking this patch (and alternatives if risky): 
  Ultra-low-risk, about as riskless as any patch can possibly be!

String or IDL/UUID changes made by this patch:
  None.

Comment 16

[Ryan VanderMeulen [:RyanVM]]

https://hg.mozilla.org/releases/mozilla-aurora/rev/e9425077bd84
https://hg.mozilla.org/releases/mozilla-beta/rev/071d2fbd0caa

Comment 17

[Teodora Vermesan (:TeoVermesan)]

Verified fixed on:
Device:LG Nexus 4 (Android 4.4.2)
Build: Firefox for Android 31.0a1 (2014-04-03)

Comment 18

[Cristina Madaras, QA [:CristinaM]]

Verified as fixed on:
Build: 30.0a2 (2014-04-07);
Device: Asus Transformer (Android 4.2.1) and Samsung SIII (Android 4.3)

Comment 19

[Cristina Madaras, QA [:CristinaM]]

(In reply to cristina.madaras from comment #18)
> Verified as fixed on:
> Build: 30.0a2 (2014-04-07);
> Device: Asus Transformer (Android 4.2.1) and Samsung SIII (Android 4.3)

Verified as fixed in builds:
29.0
Latest Aurora 32.0a2 (2014-06-19)
Latest Nightly 33.0a1 (2014-06-19)
Device: Motorola Razr (Android 4.0.4). Also based on Teodora's comment 7, I will mark this as verified fixed.