426724 - APNG Icons

Status: RESOLVED WONTFIX

(Firefox :: Theme, defect)

Description

[Alex Faaborg [:faaborg] (Firefox UX)]

This is a tracking bug for using APNG icons in various places to give the product an extra level of polish.

Some initial ideas for good candidates:

-Keyhole navigation buttons
-Star (fade from unstarred to starred)
-Web feed (fade in and out)
-Open search discovery (fade in and out)
-Stop (fade from enabled to disabled)
-Go (fade in and out)
-Secure, in the status bar (fade in and out)

Requesting blocking just to pick up wanted, probably so that we can pick up wanted-firefox-next

Comment 1

[Dão Gottwald [:dao]]

Attachment: Back/Forward hover animation (Win XP)

Comment 2

[Dão Gottwald [:dao]]

Comment on attachment 315266 [details]
Back/Forward hover animation (Win XP)

This is more of a proof of concept (the most tricky part was to preload the animated images through CSS) than final work for review. However, since we haven't something else at this point, it might be a good idea to gather feedback even on the animation itself.

Comment 3

[Cheng Khoon]

The animation is pretty cool but abit slow for practical usage. May I suggest reducing the frames? the 4-frames animation on tab hover looks good to me.

Comment 4

[MZ (watervole02)]

I think the animation is a little too bright. Maybe tone it down a bit?

Comment 5

[d]

Is this still wanted? How about for 3.6?

Comment 6

[Alex Faaborg [:faaborg] (Firefox UX)]

>Is this still wanted? How about for 3.6?

Yep, cc'ing boriss since this fits into the use of animation (albeit rather simple animation), still definitely something we should consider for Windows.  The behavior isn't that common on OS X or Linux.

Comment 7

[d]

Would this be applied to the default theme only? (Although, of course encouraging the use of animations in other themes)

Comment 8

[Alex Faaborg [:faaborg] (Firefox UX)]

>Would this be applied to the default theme only? (Although, of course
>encouraging the use of animations in other themes)

We can only control the default theme, but ideally we would re-architect our theme system at the same time so we can make these types of changes without impacting other themes (and they can ideally update to APNG icons if they feel like it).

Comment 9

[Dão Gottwald [:dao]]

(In reply to comment #8)
> ideally we would re-architect our
> theme system at the same time so we can make these types of changes without
> impacting other themes (and they can ideally update to APNG icons if they feel
> like it).

That's already the case.

Comment 10

[Alex Faaborg [:faaborg] (Firefox UX)]

I'm a little confused on this, if that is already the case, why have we been previously so careful not to change the order or layout of icons in toolbar.png?

Comment 11

[Dão Gottwald [:dao]]

We've never been very careful about that, as far as I remember. Only recently, Personas had to catch up because it replaces toolbar.png on Mac. But Personas is an extension, not a theme.

Comment 12

[d]

I've switched to the default theme temporarily and I see a fading effect on tabs. How is that done?

Oh, and I finally checked the proposed back/forwards arrows and I must say, it looks great.

Comment 13

[Dão Gottwald [:dao]]

(In reply to comment #12)
> I've switched to the default theme temporarily and I see a fading effect on
> tabs. How is that done?

That's an APNG.

Comment 14

[d]

Oh, that's good. I thought there were no APNG's implemented right now. So, this is now all about creating the images, and get them approved?

Comment 15

[Dão Gottwald [:dao]]

Yep.

Comment 16

[:Gijs (back August 25; he/him)]

As there are no open deps here, a number of the suggested UI points have disappeared/morphed already (no lock icon in the status bar, no feed icon in the url bar), we are now often using transitions rather than apngs to make state changes appear 'smooth', I don't think there's much point keeping this open. Marking wontfix. If there are specific points where we think we should add more animation/transition work, we should file separate bugs for that and prioritize them accordingly.