1282428 - Ability to edit an animation's duration in the animation panel

Status: NEW

(DevTools :: Inspector: Animations, enhancement, P2)

Comment 1

[Brian Birtles (:birtles, Feb 26~ parental leave)]

I had a little think about this at one point and dragging a handle at the end of the animation seems like the most intuitive way to change the duration. The trouble, however, is that you might also want to use that change the number of iterations of an animation.

One idea was that you change duration by dragging a handle at the end of each iteration[1] but you change the number of iterations by dragging something else like a label at the bottom of the animation describing the number of repeats[2].

Another idea might be to use a modifier key to distinguish between the two (would only apply when grabbing the handle at the end of the last iteration, however).

[1] http://slides.com/birtles/devtools-london/#/2/9
[2] http://slides.com/birtles/devtools-london/#/2/10

Comment 2

[Patrick Brosset <:pbro>]

Inspector bug triage (filter on CLIMBING SHOES).

Comment 3

[Sebastian Zartner [:sebo]]

(In reply to Brian Birtles (:birtles) from comment #1)
> I had a little think about this at one point and dragging a handle at the
> end of the animation seems like the most intuitive way to change the
> duration.

That's what the Chrome DevTools Animations panel does[1] and what I'd suggest to do.

> The trouble, however, is that you might also want to use that
> change the number of iterations of an animation.

That doesn't seem to be what people would expect when dragging the handle at the end of the animation.

> you change the number of iterations by dragging
> something else like a label at the bottom of the animation describing the
> number of repeats[2].

Or simply use a numeric field for the repetitions.

> Another idea might be to use a modifier key to distinguish between the two
> (would only apply when grabbing the handle at the end of the last iteration,
> however).

Duplication is normally done by holding down Ctrl while dragging an object. Applied to the animations this could mean to press Ctrl and drag the entire animation.

Anyway, I don't see a conflict in the UI for changing the duration and the repetitions.

Sebastian

[1] https://developers.google.com/web/tools/chrome-devtools/inspect-styles/animations

Comment 4

[Brian Birtles (:birtles, Feb 26~ parental leave)]

One thing to bear in mind is that the number of repetitions is not integral. It's quite ok to have 2.556 iterations, for example. So dragging feels like a natural way to change that but you'd probably want it to snap to integral values. (And I always find numeric fields awkward in, e.g. Illustrator, since you have to switch from mouse to keyboard, and on a Japanese system you often find you need to de-activate the IME etc.). So I guess I lean towards modifier key + dragging for changing durations.

I imagine for altering the duration you might want some small amount of snapping too, e.g. to integral values / to match the end/start times of other animations etc. However, if we add snapping I think you also need zoom so that you can still choose values near the snap points.