Every Frame Perfect

I agree that some of the examples the author provided are instances of bad animation. But I don't agree with the premise of the article.

Computer graphics is all about exploiting features of the human visual system. We perceive things differently when they're moving vs. when they're standing still. It's very possible that a "wrong" frame in isolation is the best looking one in a real-time context. We can also pick apart screenshots but these don't capture everything about how the user perceives a display in real-world lighting conditions.

I would draw an analogy to film. A fast tracking shot might look bad on individual frames because of motion blur. A wide-angle shot might make some objects look "wrong" because of optical distortion. But these are still the right choice if they have the intended artistic effect in the theater.

I still have Sonoma on some of my devices. All I can say is: wow, steady regress.

The save dialog, albeit a little shakey, is nowhere as chaotic as in your example. The buttons in Notes move between panes in a perfect seamless manner. Albeit the animation occasionally glitches out when you repeatedly focus and deselect the Safari bar, the cursor is perfectly timed with the text, only fading in after the text is done moving to the left. The Preview bug must be something recent too, I can't reproduce this.

https://streamable.com/kx7op6

I miss it when companies like Apple, Sony, and IBM paid attention to the smallest details. Apple in particular earned its current valuation with the iPhone, an all-touch device that did nothing extraordinary compared to Windows Mobile and Symbian PDAs of the time (and was in fact functionally lagging behind compared, failing to even match the then-contemporary feature phones in some areas) BUT one that you didn't actually want to smash against a wall after a few minutes of use. Now these animations are bringing back exactly the Windows Mobile and Symbian vibes.

Remember how happy Steve used to be with OS X animations? He would replay them on stage multiple times, in slow motion. These though, these would have the people behind them face the fate of the iPhone 4 antenna man.

I have a lot of thoughts about this:

I think this is a weakly presented argument. The article doesn’t actually present stronger alternatives or even why anything shown is negative to the user. It might be negative but otherwise this is the same vacant critique that is levied by pointing at smear frame or transitional points in media to critique it.

The user also has an untenable maxim. Every frame must make sense? I would posit this is impossible, or I’d ask the author how they’d handle window resizing while keeping every frame perfect.

I also think the author themself finds it easier to point out flawed frames (again without actually explaining why they’re issues) than doing as they say. Tap the header links on their blog and see the animations play after the click is complete. Or go see their own UI projects and see how text and objects don’t stay within their containers. Surely someone saying that this is a tenet that should be followed could demonstrate it themselves.

I think this is just a very hollow critique on their end.

A more competently written article would have focused on why anything shown is bad for the end user, and how they might handle it instead. A good critique should actually include some substance and point to more than just the what, but the why and how.

I'm sure a UI that had none of these imperfect frames would feel better, but now I really want someone to edit each of these clips to show what it would actually look like.

At the same time, why does everything need motion? My understanding is that motion should be used if an action subtly changes the UI in a region that's different from where the action was triggered (e.g. toasts)

I think many of these transitions are unnecessary and would feel just as good if they snapped immediately with instantaneous reflow.

I couldn't understand author's point, because they haven't provided the right way to do each thing, their opinion.

It's easy to criticize.

I've seen a few comments along the lines of wishing that the author had included examples of solutions. I wrote a very similar post recently that details both the issues with the animations, very similar to this article, as well as how I improved them.

For anyone curious, https://www.thisischris.dev/projects/project-6/

I'd rather have an imperfect frame now than a perfect frame later. Latency should be the top priority for any UI, because when latency is low enough it feels like a part of your own body, which minimizes cognitive load. Animation is especially bad for this, because animations add hundreds of milliseconds of latency.

Would be nice if there were some _positive_ examples to go along with all of the negative ones. All I’m really getting from this is that I should avoid animations, which I don’t think is what the author is actually trying to say.