Live data from Hacker News

Every Frame Perfect

tonsky.me

71–80 of 293 posts

Re: Every Frame Perfect

#71
post #43
post #36

Earlier quoted context omitted.

Play any game with good UI and you will see animations used everywhere. Instant transitions are only good in theory.

You will also see plenty of cases where a screenshot captures incoherent frames. Squash and stretch is a whole art style that relies on unrealistic frames.

You're thinking of smear frames. Squash and stretch are animation techniques that are perfectly coherent. Smear frames as well contribute to an overall coherent animation. They're a counterpoint to the general idea put forward in this article, but it's also rarely ever relevant to this type of animation.

Re: Every Frame Perfect

#72
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.

Re: Every Frame Perfect

#73
post #65

Earlier quoted context omitted.

I think the default "product manager wants to build flashy animation" fundamentally contradicts that, but I also don't think it's fair to apply that criticism across all animations. Good and useful animations communicate something, they're not there just to be there or to make it "pretty", which is most designers use them. But they can actually communicate intent, action, immediacy and other important things, if they…

The cursor animation is actually a great one because it does not add any latency. By comparison, when animations are not disabled on my Pixel 6 it takes almost one second to switch application instead of maybe 100ms (double tapping the app swap button to get to the previous app running).

God yeah smartphones are the worst, Apple (& co) particularly. My iPhone 12 Mini could feel so much faster if I could just disable all the annoying animations that just make everything feel slower instead of being helpful. Setting animation speed to 0x is probably the feature from Android I miss the most.

Re: Every Frame Perfect

#74
post #44
post #36

Earlier quoted context omitted.

Play any game with good UI and you will see animations used everywhere. Instant transitions are only good in theory.

Games are entertainment products, not tools. It's acceptable for a game UI to draw attention to itself for artistic effect, but I don't want to have to put up with this when I'm trying to get work done. Instant state transitions become imperceptible as you learn how they work. An instant UI effectively functions as part of your body, just like hand tools do. Animations make this impossible. Compare an ordinary pencil…

Animations are highly effective tools for conveying state information.

Consider a toolbar with a mix of enabled and disabled buttons. Hover effects (which I would consider animations) convey that something is clickable, and on-click effects confirm an action. These effects convey meaningful information to both beginner users and power users of any software, and are in no way inconvenient to either group.

I generally agree animations tend to get in the way when you want to get shit done, but the idea that animations are only applicable as artistic effects rings untrue to me.

Re: Every Frame Perfect

#75
post #36

Earlier quoted context omitted.

Play any game with good UI and you will see animations used everywhere. Instant transitions are only good in theory.

Maybe you dislike them, but that does not make for a fact. Instant transitions are something I strongly prefer and use in practice. There's no question, I don't want my operating system slowing itself down to a factor (literally) of 1000x, pointlessly fading and jiggling and sliding and bouncing and wiggling. And, as this article points out, animations in operating systems often make a visually illegible mess in the…

Indeed: one of the first things I do on a new android phone is activate developer mode specifically so that I can set the animation timescale to 0×.

Re: Every Frame Perfect

#76
Great article, the worst offender is compact tab mode in the current Safari. The animations they implemented make that unusable, sometimes it’ll move tabs away from where the tab was when clicking, the animation always look clunky and the entire experience feels utterly untested. Doesn’t just look poor, but violates quite a lot of HIG rules Apple recommends for third party devs. Maybe something to focus on in a part two of this article.

Re: Every Frame Perfect

#77

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 ap…

I like this comment. The idea that animations should be able to be picked apart frame by frame and always be coherent doesn't make much sense, because the user will never actually do that.

I do like the point the article makes about using ui fidelity as a proxy for software quality, and agree that they pointed out some bad animations. But, I think you hit the nail on the head .. frame by frame coherence isn't the best yardstick for measuring animation "goodness".

Re: Every Frame Perfect

#78
post #11

Earlier quoted context omitted.

Motion is critical for reorientation after transition. Often with out it your brain has to rescan the entire page on each refresh.

Outside of dedicated notification areas, a GUI should only change state in response to user action. Because the user requested the state change, they naturally know how it changed. This means any animation is a redundant waste of time. The notification area doesn't need animations either, because a GUI is only appropriate for displaying non-urgent notifications. If something really needs urgent attention, you need al…

This is the standard confusion HNers have with real life.

I think it should work this way vs “how it be”

Re: Every Frame Perfect

#79
Animation should convey meaning, not achieve pixel-perfect morphs between states.

When iOS first launched, some of the brilliance was in how UI elements transformed into one another—a title in the title bar becoming a "back" button on the left, for instance. There were no intricate morphs, just a simple cross-dissolve between two elements shown briefly at the same time. It read as meaningful without being literal.

The Crop/Adjust example doesn't hold up here, because the two modes don't share a focus. The crop animation is deliberately different: it emphasizes the cropping controls at the edges of the image that you might otherwise miss, prepping you visually for the task and tying the controls into the image workspace. Adjust mode has no direct controls on the image itself, so the transition out should differ. The mismatch is the point, not a flaw.

For most UI, you don't need pixel-perfect morphs between small elements. The real job of animation and behavior is to convey meaning and context. Make your transitions pixel-perfect and most people would never notice the difference.

Re: Every Frame Perfect

#80

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 ap…

I think you are taking it a step too far. First of all, unlike film, we are not recording reality in any way, every pixel that appears on screen is there because we put it there. I'd argue a closer parallel is a cartoon. And something like cartoon inbetweening is not an example of imperfect frames. These are in fact, perfect and even carefully crafted frames.

It's one thing if the frame halfway through an animation looks a bit "funny", but is still completely logically correct. It is another if the intermediate state of the animation legitimately doesn't make any sense and is just the result of not really caring about what actually goes on during the animation. In that case I'd almost rather just not have the animation at all, or just have a simpler one.

Post reply on HN