Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Every Frame Perfect

tonsky.me

Post reply on HN
Print view View original

51–60 of 293 posts

Re: Every Frame Perfect

#51

Post by appplication »

montroser wrote: post #48
hk__2 wrote: post #37

> The rule of thumb is: If I take a screenshot of your app at any moment, it must make sense After reading this blog post, I think the rule of thumb should be "If I take a screenshot of your app at any moment (except during animations), it must make sense". I don’t think making sense during an animation should really be a goal, as long as it makes sense before and after.

Well, this is the exact opposite of his point. Of course it should make sense when not animating! That is given. The entire crux of his point is that it should also make during an animation . In an ideal world, it is hard to argue with. Yes, sure it should make sense. But also, please don't spend precious cycles on this unless all the other bugs are fixed, and this animation consistency is truly the most important re…

I think you nailed it. Animation nuance is fine to burn time on if you’ve run out of things to do.

Re: Every Frame Perfect

#52

Post by alluro2 »

hk__2 wrote: post #37

> The rule of thumb is: If I take a screenshot of your app at any moment, it must make sense After reading this blog post, I think the rule of thumb should be "If I take a screenshot of your app at any moment (except during animations), it must make sense". I don’t think making sense during an animation should really be a goal, as long as it makes sense before and after.

But the author tried to show exactly that, if screenshots during animation don't look sensible, it points to animation as a whole not making sense - it being either messy, overlapping, or confusing - and, in general, eroding the user's trust.

Re: Every Frame Perfect

#53

Post by ryukoposting »

satvikpendem wrote: post #20

An app with no animations at all is going to feel terrible. You can test this out yourself, if you have an Android you can set animation speed to 0x in the developer settings. It is jarring to see instant changes and it actually takes your brain a second to process what happened, and that process is probably slower than having the animation in the first place. I have mine at 0.5x and that feels sufficient, still fast…

I have mine at 0.5x.

The problem with 0x is that it seems to only affect like 90% of the UI. Certain things still animate, and the cadence feels awful as a result.

At 0.5x the stuff that's mysteriously unaffected by the animation speed setting isn't as jarring.

I would use 0x if it worked properly.

Re: Every Frame Perfect

#54

Post by [deleted] »

Kiro wrote: post #36
ikesau wrote: post #4

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

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

[deleted]

Re: Every Frame Perfect

#55

Post by fasterik »

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.

Re: Every Frame Perfect

#56

Post by voidnap »

Kiro wrote: post #36
ikesau wrote: post #4

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

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

No they are not used everywhere. Some games with good UI use animations everywhere that an animation is appropriate. But plenty of good UI exist without animations. The point above is that no animation is better than an inappropriate animation.

Re: Every Frame Perfect

#57

Post by Krssst »

Kiro wrote: post #36
ikesau wrote: post #4

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

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

Games are for fun. Wasting time in a game is fine, that's what it is for. (edit: not saying that pejoratively)

Other applications are to do things. They should do the thing and get out of the way as fast as possible. Animation-induced delays are fundamentally contradictory with that; they waste the user's time instead of doing the thing.

Re: Every Frame Perfect

#58

Post by voidnap »

tsunamifury wrote: post #5
ikesau wrote: post #4

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

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

This isn't true generally. I am personally far more comfortable with disabling smooth scroll. It has more to do with your mind's expectations. Which can vary between people. Some people expect smooth and others don't. Motion itself isn't necessary.

The only time I have to "rescan" is if I input a scroll and anticipate a scroll and it doesn't scroll. It has nothing to do with motion. In fact, in that case, I "rescan" even though the page hasn't changed, but because it doesn't match my expectation that it would change.

Re: Every Frame Perfect

#59

Post by embedding-shape »

Krssst wrote: post #57
Kiro wrote: 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 for fun. Wasting time in a game is fine, that's what it is for. (edit: not saying that pejoratively) Other applications are to do things. They should do the thing and get out of the way as fast as possible. Animation-induced delays are fundamentally contradictory with that; they waste the user's time instead of doing the thing.

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're used sparingly in the right situations, without actually getting in the way.

Probably the most basic animation most of us PC users see every day is the very basic animation of a text cursor blinking on/off in text fields, like the one I write it right now. It's super basic, but communicates that the computer is waiting for you, it's alive and you can enter things. If it was static, you get the impression something is stuck instead, or couldn't tell exactly where the cursor is at a glance. But it blinks, and that tells us stuff.

Re: Every Frame Perfect

#60

Post by flyingshelf »

arjie wrote: post #32

Negative examples are cool. Time consuming to put together. I did appreciate that. What are some positive examples?

Positive examples are all other animations that do work well, or are just animated in After Effects, for which there are plenty of examples online already, like on Twitter.
Post reply on HN