1206160 - Some of treeherder's transitions could be animated

Status: RESOLVED FIXED

(Tree Management :: Treeherder, defect)

Description

[William Lachance (:wlach)]

For a smoother UX, we might want to consider animating some UI operations:

* Selecting a job
* Expanding a job group

Comment 1

[William Lachance (:wlach)]

Attachment: PR

Here's some basic transitions. A basic screen recording of them in action is here:

http://people.mozilla.org/~wlachance/treeherder-animations.mov

Comment 2

[Jonathan French (:jfrench)]

Comment on attachment 8663082 [details] [review]
PR

r+ on the changes; I've provided testing feedback in the PR, I think the safe one to land is the group expand/collapse transition, which looks lovely on my machine at 0.5s or so.

Comment 3

[Jonathan French (:jfrench)]

:wlach hm, well I just tried global the global expand/collapse in the navbar, and 0.5s does have a delaying effect on the job chunks. I was comparing your branch (at 0.5s) with stage, side by side.

Comment 4

[William Lachance (:wlach)]

Comment on attachment 8663082 [details] [review]
PR

Yeah, I'm not sure about the job selection. *I* think it looks nice, but opinions may vary. :)

Sheriffs: I added some animations to treeherder, please let me know if they're helpful (or at least pleasant) or just annoying:

http://wlach.github.io/treeherder/ui/#/jobs?repo=mozilla-inbound

Things to try:

* Selecting jobs (both via keyboard and clicking on them)
* Expanding/collapsing specific job groups
* Expanding/collapsing everything

If someone else has already given feedback that reflects your thinking, feel free to just say that.

Comment 5

[Wes Kocher (:KWierso) (Not reading bugmail; email directly if needed)]

I like it. Could really delay things with the mass toggle if lots of pushes are loaded.

Comment 6

[Jonathan French (:jfrench)]

I just checked the gh-pages with the transitions in comment 4, and on 

OSX 10.10.5 MacBook Pro
2.6Ghz Core i7 16Gb 
Nightly w/e10s disabled

my CPU loads are (after a default load of mozilla-inbound):

Idle
o stage - 3% (it roughly settles down to that)
o gh-pages - 3%

Rapid left/right navigation
o stage - 25-35%%
o gh-pages - 103%

Interestingly after a subsequent idle period, reloading gh-pages will result in the CPU still at ~100% from which it doesn't seem to decline. If I minimize Nightly it will drop, but not while its visible on the desktop.

I see similar loads running the branch locally. I'm not sure if anyone else can reproduce those deltas, but for what it's worth.

Comment 7

[Nigel Babu [:nigelb]]

Comment on attachment 8663082 [details] [review]
PR

I like it! It doesn't seem to too distracting. I think TBPL also had a similar feature?

Comment 8

[Treeherder GitHub Bugbot]

Commits pushed to master at https://github.com/mozilla/treeherder

https://github.com/mozilla/treeherder/commit/c2203439f41fdeeb16636a5dc2d9a0440b5e6499
Bug 1206160 - Add some fast transitions for basic treeherder actions

* Selecting a job (scale up from standard size)
* Expanding a job group (fade in)

https://github.com/mozilla/treeherder/commit/a073fbc9af33b80bbfba0b26a2d46c26ae470cdb
Merge pull request #980 from wlach/1206160

 	Bug 1206160 - Add some fast transitions for basic treeherder actions

Comment 9

[William Lachance (:wlach)]

Ok given the positive feedback I have merged this PR. We can always adjust or revert if people aren't crazy about it.

Comment 10

[Wes Kocher (:KWierso) (Not reading bugmail; email directly if needed)]

I like it. There are some cases I've noticed where one of the neighboring jobs briefly appears while the transition is being applied during classification behind the box surrounding the currently selected job.

Comment 11

[Wes Kocher (:KWierso) (Not reading bugmail; email directly if needed)]

(In reply to Wes Kocher (:KWierso) from comment #10)
> I like it. There are some cases I've noticed where one of the neighboring
> jobs briefly appears while the transition is being applied during
> classification behind the box surrounding the currently selected job.

Only seems to happen when the two neighboring jobs are within the same job group, and might only be when one or both of those jobs' symbols are 2+ characters long.

Comment 12

[Carsten Book [:Tomcat]]

Comment on attachment 8663082 [details] [review]
PR

i like it too :)