Adding subtle animations for the task manager icons in the taskbar

Brainstorm
, , ,
1

Hi! First-time poster here. I’d like to start by thanking everyone involved in Plasma’s development; it’s one of the most polished desktop environments available today.

That said, I think there’s an opportunity for a small but noticeable UX improvement in the Task Manager: press feedback on taskbar icons.

Currently, clicking a taskbar icon provides little immediate visual feedback. The bouncing startup cursor partially compensates for this, but it doesn’t appear while a mouse button is held down and is less useful for long taps or touch interaction.

For comparison:

  • Ubuntu GNOME shows a pulse animation when launcher icons are activated.

default

on_hover

on_press

  • Windows 10 uses subtle visual state changes between normal, hover, and pressed states (see above, fourth icon, from top to bottom: default state, hovered state and pressed state.)

  • Windows 11 goes further with a brief scale animation on press/release, plus restore/minimize animations (a cute bounce up and a bounce down animation on restore and minimize.)

By comparison, Plasma’s taskbar feels somewhat static. More importantly, it’s inconsistent with the System Tray, whose icons already use a subtle scale-down animation to acknowledge presses.

As a proof of concept, I adapted the existing System Tray behavior for Task Manager icons. The result is a small scale-down animation on press and scale-up animation on release:

TapHandler {
    id: tapFeedbackHandler
    acceptedButtons: Qt.LeftButton | Qt.MiddleButton | Qt.RightButton
}

...

Kirigami.Icon {
    id: icon
    anchors.fill: parent

    active: task.highlighted
    enabled: true
    
    source: task.model.decoration

    scale: tapFeedbackHandler.pressed ? 0.8 : 1
    transformOrigin: Item.Center

    Behavior on scale {
        ScaleAnimator {
            duration: Kirigami.Units.longDuration
            easing.type: tapFeedbackHandler.pressed ? Easing.OutCubic : Easing.InCubic
        }
    }
}

This feels good, but in practice, I found that restarting the animation on each press/release feels more responsive during rapid repeated clicks:

TapHandler {
    id: tapFeedbackHandler
    acceptedButtons: Qt.LeftButton | Qt.MiddleButton | Qt.RightButton

    onPressedChanged: {
        if (tapFeedbackHandler.pressed) {
            pressDownAnim.start();
        } else {
            pressReleaseAnim.start();
        }
    }
}

...

Kirigami.Icon {
    id: icon

    anchors.fill: parent

    active: task.highlighted
    enabled: true

    source: task.model.decoration
            
    transformOrigin: Item.Center
    scale: 1
            
    PropertyAnimation on scale {
        id: pressDownAnim
        from: 1
        to: 0.80
        easing.type: Easing.OutCubic
        duration: Kirigami.Units.shortDuration
    }
            
    PropertyAnimation on scale {
        id: pressReleaseAnim
        from: 0.80
        to: 1
        easing.type: Easing.InCubic
        duration: Kirigami.Units.shortDuration
    }
}

(I think the shortDuration unlike the longDuration used by systray makes a more snappier feel, but that’s ultimately my personal taste).

Currently, both implementations only animate the application icon, similar to Windows 11. There could be an argument for also animating the window label for additional feedback.

I’m curious what others think. Would adding subtle press-feedback animations to Task Manager icons be a worthwhile polish improvement for Plasma?

Thanks for your time, and apologies if this is a frequently discussed request. I’m not a professional developer, so I’m not fully confident contributing code directly yet, but I thought I’d share this idea along with a small prototype in case it’s useful.

3 Likes
2

I get a rotating animation - maybe it’s a plasma theme option (I’m using Oxygen at the moment).

PurPurDay also does this, but Breeze doesn’t.

So yes, a more obvious animation would be nice… though I generally see a window (let’s try GIMP… ) within 1 second.

3

I think the spinning icon is there for Breeze too, although in my opinion there should be an additional feedback for presses, separate from loading indicators. That said, I didn’t know that themes had the ability to add or customize animations.

4

Ah, interesting - actual ‘presses’ don’t register. I do miss the old 3D - skeumorphic designs - where some kind of shadow or light/dark outline would make it clear that the thing had been PRESSED or released…

You’re right, Breeze does have a rotating ring, but with my current colouring it’s far too subtle and thin; I didn’t see it.

Expose dark has a much bolder, outstanding ring - but the problem is that it only gets noticed on heavy loading (Gimp maybe 0.6 seconds) so it could definitely do with a much bolder effect - until I tried it with Gimp (usually I use a launcher for that) I never even saw it before.

What are you launching by clicking that takes long enough for this to be worth more effort?

5

Admittedly, this isn’t about launch times so much as adding a bit more polish rather than fixing something that’s broken. I also miss the old skeuomorphic designs, and I think modern UI trends often favor minimalism to the point where useful visual cues are lost. While Plasma generally strikes a reasonable balance, flat design benefits from functional animations that restore some of that feedback: subtle scale animations to acknowledge clicks and taps, loading indicators to show that work is being done, and similar micro-interactions.

Animating icons when they are pressed seems like a relatively simple change with a disproportionate benefit to the user experience. Beyond making clicks feel more responsive, it would also provide visual feedback for long presses and drag-start events, helping users better understand that their input has been registered.

1 Like