898256 - Use new 1.5x assets from UX for shared style

Status: VERIFIED FIXED

(Firefox OS Graveyard :: Gaia, defect)

Description

[Yuren [:yurenju] (AFK ~ Oct. 12) (volunteer mode)]

Attachment: Shared_Assets.zip

UX provided new 1.5x assert for hd project. we need to update those images into GAIA_DIR/shared

Comment 1

[Wayne Chang [:wchang]]

HD+ asset bug

Comment 2

[Yuren [:yurenju] (AFK ~ Oct. 12) (volunteer mode)]

WIP here:
https://github.com/yurenju/gaia/commit/1f61c4e05d88f24cf61ec17f7a7c9bb640b5c414

Comment 3

[Yuren [:yurenju] (AFK ~ Oct. 12) (volunteer mode)]

Attachment: github PR: https://github.com/mozilla-b2g/gaia/pull/11218

Hi Ismael, could you help to review this? thanks!

There are only new assets from UX in this pull request without code change.

Comment 4

[Ismael Gonzalez [:basiclines]]

Comment on attachment 782451 [details] [review]
github PR: https://github.com/mozilla-b2g/gaia/pull/11218

I've added some comments in GH, 1&2 are the important ones. Take a look on to them and fix it plx.
Anyway i'll give you thr r+.

Thx!

Comment 5

[Yuren [:yurenju] (AFK ~ Oct. 12) (volunteer mode)]

Thank you Ismael!

Hi Amy, as Ismael said on github, There are some question need you provide additional images:

1. we have different color between 1.0x image and 1.5 image for shared/style/switches/images/radio/[e-mail], please see this: https://github.com/mozilla-b2g/gaia/pull/11218/files#diff-25

2. looks we tweaked some icon design (like icon in below link), could you also update the icon for 1.0x? https://github.com/mozilla-b2g/gaia/pull/11218/files#diff-30

3. 1.5x images size should be [origin image size x 1.5], but we found some files doesn't match this rule, could you check it? below list is images I found:

https://gist.github.com/yurenju/6109731:

> ./resources/branding/official/initlogo.png                  	320x480
> origin image x 1.5 =                                        	480x720
> ./resources/branding/official/[e-mail]             	405x720
> 
> ./resources/branding/official/powered.png                   	320x480
> origin image x 1.5 =                                        	480x720
> ./resources/branding/official/[e-mail]              	405x720
> 
> ./resources/branding/official/about_logo.png                	165x165
> origin image x 1.5 =                                        	247x247
> ./resources/branding/official/[e-mail]           	248x267
> 
> ./resources/branding/unofficial/initlogo.png                	320x480
> origin image x 1.5 =                                        	480x720
> ./resources/branding/unofficial/[e-mail]           	405x720
> 
> ./resources/branding/unofficial/powered.png                 	320x480
> origin image x 1.5 =                                        	480x720
> ./resources/branding/unofficial/[e-mail]            	405x720
> 
> ./style/input_areas/images/icons/clear.png                  	17x16
> origin image x 1.5 =                                        	25x24
> ./style/input_areas/images/icons/[e-mail]             	26x26
> 
> ./style_unstable/scrolling/images/icons/search.png          	10x10
> origin image x 1.5 =                                        	15x15
> ./style_unstable/scrolling/images/icons/[e-mail]     	30x30

Ismael please correct me if I'm wrong.

Comment 6

[Amy Lee [:amylee] UX]

Attachment: [e-mail]

Hi

Attached are the correct resized graphics and I have fixed the colouring on "default@1.5".

I noticed that there are 2 different colours being used for the clear.png buttons in these 2 sections. Can you attach a screenshot of where these 2 icons are being used? I think they should be the same colour. Also the style of the X was outdated so I have updated it.

shared/style/input_areas/images/icons/clear.png
shared/style/headers/images/icons/clear.png

Let me know if you need anything else

Comment 7

[Amy Lee [:amylee] UX]

Also in response:

2. looks we tweaked some icon design (like icon in below link), could you also update the icon for 1.0x? https://github.com/mozilla-b2g/gaia/pull/11218/files#diff-30

Please contact Eric Pang for any @1 graphics or updates to @1 scale. Thanks!

Comment 8

[Yuren [:yurenju] (AFK ~ Oct. 12) (volunteer mode)]

Hi Eric,

we found UX have tweaked handler of seekbars icon for 1.5x size, please see this link:
https://github.com/mozilla-b2g/gaia/pull/11218/files#diff-35

it would be great if you can provide the updated icon for 1x size to make this icon looks the same on devices with different DPI, thank you :-)

Comment 9

[Yuren [:yurenju] (AFK ~ Oct. 12) (volunteer mode)]

Hi Amy,

1. I checked the resolution of images again, here is the result:

https://gist.github.com/yurenju/6119971
> ./resources/branding/official/initlogo.png                  	320x480
> origin image x 1.5 =                                        	480x720
> ./resources/branding/official/[e-mail]             	480x800
> 
> ./resources/branding/official/powered.png                   	320x480
> origin image x 1.5 =                                        	480x720
> ./resources/branding/official/[e-mail]              	480x800
> 
> ./resources/branding/unofficial/initlogo.png                	320x480
> origin image x 1.5 =                                        	480x720
> ./resources/branding/unofficial/[e-mail]           	480x800
> 
> ./resources/branding/unofficial/powered.png                 	320x480
> origin image x 1.5 =                                        	480x720
> ./resources/branding/unofficial/[e-mail]            	480x800
> 
> ./style/input_areas/images/icons/clear.png                  	17x16
> origin image x 1.5 =                                        	25x24
> ./style/input_areas/images/icons/[e-mail]             	26x26

Should we need to use exactly pixels for 1.5x or is it okay for you?

2. looks you have tweaked initlogo & powered: 
https://github.com/mozilla-b2g/gaia/pull/11218/files#diff-1
https://github.com/mozilla-b2g/gaia/pull/11218/files#diff-2

do we also need to tweak 1x images for consistent?

also needinfo? Ismael to get more feedback.

Comment 10

[Eric Pang [:epang] UX]

Attachment: handler of seekbars

Hi Yuren,

I've attached the handler for the seekbar @1x.  I believe it might be the same, could it be that the icon is just stretched in the git hub preview, making the colors look washed out (since the image is pretty small?  Let me know if I've misunderstood the issue. :)

Comment 11

[Amy Lee [:amylee] UX]

Attachment: screens.zip

Hi, 

I have attached @1 scale screens so they match the @1.5 versions. The dimensions of the original @1 scale graphics seemed incorrect as well. Can you please use these to replace initlogo & powered @1 scale. I think the 26x26 clear.png graphic should be okay as long as it looks right on the screen. Thanks

Comment 12

[Ismael Gonzalez [:basiclines]]

Everything looks fine now. Huge thx guys!

Comment 13

[Yuren [:yurenju] (AFK ~ Oct. 12) (volunteer mode)]

Merged:

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

Comment 15

[GaryChen [:GaryChen][:PYChen][:gchen][:陳柏宇]]

Merged into v1.1.0hd:
https://github.com/mozilla-b2g/gaia/pull/11695

Comment 16

[Eric Pang [:epang] UX]

(In reply to GaryChen [:GaryChen] from comment #15)
> Merged into v1.1.0hd:
> https://github.com/mozilla-b2g/gaia/pull/11695

Thanks Gary, can you also update the status-b2g-v1.1hd:affected flag to fixed?

Comment 17

[GaryChen [:GaryChen][:PYChen][:gchen][:陳柏宇]]

Thanks Ryan.

Comment 19

[Al Tsai [:atsai]]

[2013/10/21 Helix Testing]
Gaia:     c829a2042594b6c3a4899ee27979799a0f301534
Gecko:    http://hg.mozilla.org/releases/mozilla-b2g18_v1_1_0_hd/rev/f7c657f6d019
BuildID   20131015042201
Version   18.0