I don't know if I agree with this, especially in the context of animation: https://www.bloopanimation.com/the-art-of-smear-frames/
Every Frame Perfect
281–290 of 293 posts
Re: Every Frame Perfect
#282Earlier quoted context omitted.
> On screenshots that looks really weird, while in reality this is quite ok. That wasn't the criterion, which was "the best" > very possible that a "wrong" frame in isolation is the best looking one in a real-time context. So show your Kwin animation example and explain how it's the best due to "human vision" compared to a transition without the weird stretches. > I'd prefer blur/mosaic/white window during the animat…
>That wasn't the criterion, which was "the best" Yes. Making perfect transition animations for the software is a very hard task, which is totally useless in my opinion — transitions shouldn't be made for screenshots, it should be made for humans to understand what have changed, how did click influence the UI. >So show your Kwin animation example https://litter.catbox.moe/s6ahsjybdcfkvdi5.mp4 >explain how it's the bes…
> should be made for humans to understand what have changed, how did click influence the UI.
But that's exactly where you fail with bad transition - they make the understanding harder! For example, in your video the file name text/icon is moving from the center to the left, but transition animation is showing it stretching horizontally instead, and nothing re the actual move! This is bad and serves no purpose, just creates visual noise and as though the icon is "floating" for a split second.
> If the animation does not attempt to present the contents during the animation
But your video does present content during the animation! It's just that this content doesn't illustrate the object moving, but an unrelated transformation.
So I just don't understand what you compare here and what you think is better.
> the brain would look for any animation deficiencies, nitpicks.
You still have not given a single example of the alternative where you've exploited the brain to not notice. By the way, white flash is a noticeable deficiency
Re: Every Frame Perfect
#283[dead]
Re: Every Frame Perfect
#284I'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.
I find a much more enjoyable interface after disabling animations on every device I use---as well as shadows, glow, blur, translucency, hover effects, and rounded corners. Eye candy is an annoyance and wastes developer time, in practice, even when done "correctly".
Kinetic scrolling on touchscreens can stay, but only because my finger doesn't have a no-friction scroll wheel.
Re: Every Frame Perfect
#285Earlier quoted context omitted.
Hand tools have mass and momentum, they are most definitely "animated". You need force to accelerate them up to speed, they don't change state "in binary", or in a blink. Good UI is when you don't even consciously notice the animation, but it has subconsciously given you more information (e.g. desktop changes with very brief animation tells you from where did you transition to where. I personally find i3/sway to be a…
A mouse, even a lightweight gaming mouse, is substantially heavier than a pencil. Even if you somehow made a mouse with zero mass, your hand still has mass. The momentum is unavoidable. You don't need to add an inferior simulation of additional momentum to the momentum that already exists.
No one said that one should add "hindrance" to the movement itself. But just because your hand slowly decelerated at the end, causing the mouse as well to stop slowly, maybe the endpoint of the movement should reflect the vector of movement as well? E.g. scrolling to the bottom of the page causing a small bounce back instead of doing nothing is an absolutely information-providing animation you don't even think of as an animation. That's how you know it's good.
But then be against bad animations, not all.
Re: Every Frame Perfect
#286Earlier quoted context omitted.
For UI purposes, sub-150ms animations can be very effective as "pro" interface behaviours. That's close to our best reaction time [1]. Good UI personality doesn't have to get in the way of pro-level efficiency. One of the ways to achieve this is to not actually transition between states, but simply animate the "end bounce" of an introduced element, as if it was eased into position. So not actually slid from the left,…
> ~100ms represents optimal [human] reflex time in recent research. For unpredictable inputs. Intervals between a human own actions or discrepancies in delays between successive external events can be effected or perceived with significantly greater precision, especially for people with e.g. music training, especially for percussionists. I’d bet on somewhere between one and two orders of magnitude more precision, tha…
Yep! That's why I thought it was important to mention the caveat on chained shortcuts. Two keyboard inputs can easily happen within 30-50 ms of one another when it's a learned movement. This is not a situation where a user relies on visual cues to move between steps, however.
Re: Every Frame Perfect
#287Earlier quoted context omitted.
A mouse, even a lightweight gaming mouse, is substantially heavier than a pencil. Even if you somehow made a mouse with zero mass, your hand still has mass. The momentum is unavoidable. You don't need to add an inferior simulation of additional momentum to the momentum that already exists.
No one said that one should add "hindrance" to the movement itself. But just because your hand slowly decelerated at the end, causing the mouse as well to stop slowly, maybe the endpoint of the movement should reflect the vector of movement as well? E.g. scrolling to the bottom of the page causing a small bounce back instead of doing nothing is an absolutely information-providing animation you don't even think of as…
>E.g. scrolling to the bottom of the page causing a small bounce back instead of doing nothing is an absolutely information-providing animation you don't even think of as an animation. That's how you know it's good.
A bounce-back animation is bad design. Bouncing is distracting and annoying. My scroll area should not bounce unless I deliberately order it to bounce. GTK has a somewhat better solution, where it shows a animated shrinking translucent chord of a circle (or some similar shape) at the end of the scroll area. This could be considered a dedicated notification area, but it's not a good one because it overlaps whatever else is in the scroll area. Ideally, the "invalid scroll" notification should be shown in the scrollbar.
Re: Every Frame Perfect
#288I still remember that you could slow down animations in OS X - I think with the shift key. Steve Jobs even did it in presentations because they looked so gorgeous in slowmo. If we‘d still have that I‘m sure they would care more about that every frame.
Re: Every Frame Perfect
#289Earlier quoted context omitted.
There is no irony; I'm under no obligation to take up any debate on any particular point you raise. You're constructing more strawmen.
I’m really shocked you can’t see the sheer hypocrisy on your part here again. You have literally added nothing to the discussion, other than levying criticism and denigrating any points made just because you either don’t agree or don’t actually have anything material to add. Anyway, it’s the internet. No point getting annoyed by drive by responses from a stranger. Enjoy your weekend.
You seem confused.
It is you that was levying criticism and denigrating others because you don't actually have anything material to add.
Re: Every Frame Perfect
#290Bad things:
- An animation that prevents the next thing for enough milliseconds that it causes input loss. Example - the iPhone calculator that wouldn't accept the next digit until the last press was done animating.
- Animation that moves active elements like buttons out of or into the way as you are clicking/tapping, causing an errant click.
- A lack of animation or visible context change that causes you to not realize the screen has changed. This sometimes gets me when I click another section or chapter in some kind of two-pane interface and the other side updates at a random time.
- Animations that take so long that you can't work at the speed of your hand/eye/brain coordination.
- Animations that feel like you're trapped in a liminal space until they're finished, which I think is basically the subject of the article.
Better things:
- Coordinated animations that accentuate updates, especially when you didn't request them. Reordering a leaderboard, adding a new item in the middle of a list from a distant update, etc.
- Animations that cover for slow processes. If we expect a while (but not too long) before a request and a response, an animation can be better than a spinner or nothing at all. It might help prevent the rapid clicking that some users do. I prefer if it doesn't spend a whole second when the response comes back in a tenth of a second.
- Stylistic animations that don't affect how you work. The genie effect and the bouncing app animation of old Mac OS X come to mind. A key feature is that you usually can turn them off.