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.
inigyou 30 minutes ago [-]
You might have thought the title was about Wayland and you're right. But this isn't about Wayland.
ikesau 1 hours ago [-]
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.
tsunamifury 1 hours ago [-]
Motion is critical for reorientation after transition.
Often with out it your brain has to rescan the entire page on each refresh.
mrob 48 minutes ago [-]
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 alarms and flashing lights, not an animated "toast".
geokon 1 hours ago [-]
Do you have some concrete examples?
"Back-in-the-days" you'd click and stuff would instantly happen, and I don't remember anything being more difficult to visually interpret.
On my Kubuntu desktop if I disable all animations (the whole compositor) I don't feel there is an increased cognitive load of rescaning things - but maybe it's my preexisting memory of the UIs and certain baked in UI expectations. Maybe this animated stuff helps people that are computer illiterate? (software made for the lowest common denominator)
ikesau 1 hours ago [-]
Ah yeah, that makes sense, but I still feel like there's room for a little more discretion.
I don't think I would have to rescan the entire page to figure out where things were afterwards. Everything's shifted to the right, just like when I open my browser bookmarks.
naet 5 minutes ago [-]
I think it's not uncommon for good animations to cheat a bit while in motion, rather than look perfect on every frame. Like how cartoons can use smear frames that look bizarre when paused at the wrong time but when viewed as part of a larger animation help sell the motion visually.
throwaw12 11 minutes ago [-]
I would love to understand these people, really!
On a personal level, if thing works - I say, cool, lets focus on something else now.
But I have worked with people who are similar to the author and we will get into the conversation:
- they: wait, but the bundle size is 2.4Mb, it can be improved a lot
- me: by how much? and we have 10k users/day and we have cache policy setup
- they: we can reduce it to 1Mb, imagine saving 10k*1.4Mb every day
- me: yeah, but its not costing us much, if you focus on making it perfect your salary will cost us 2 years of outbound traffic cost.
- they: no, but its not perfect
I admire those people, because they're valuable asset in some companies (e.g. Google scale, saving 1.4Mb for 1 Billion people every day is a lot), but my mind doesn't even want to think about what's perfect.
How do I get there? What are the resources I can read and learn from to look at things to make them perfect?
piskov 17 seconds ago [-]
Broken windows theory
The issue with “premature optimization is bad” is that some see it as a permission to not optimize at all. Hence you eventually end up with a system where everything is bad.
satvikpendem 9 minutes ago [-]
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.
bvrmn 1 minutes ago [-]
I'm a happy user of android with animations turned off. It's the only mean to make it somewhat "snappy". IMHO lag is always worse than lack fancy transient state in input -> UI change context.
saati 1 minutes ago [-]
All animations are just wasted time while you can't properly interact with the UI, it's much better to just turn every one of them off.
ivanjermakov 5 minutes ago [-]
Give it one day and you won't come back to those sluggish animations slowing your intent down.
yellow_lead 8 minutes ago [-]
Not for me, I always turn off animations. It feels fine for me, and I can operate the phone a lot quicker without having to wait for animations to complete.
intrikate 5 minutes ago [-]
I don't turn them off entirely, I kind of enjoy the feeling of momentum animated elements can provide, but I definitely do go in and speed them up massively. I find that when a phone is feeling unresponsive or sluggish, it's usually because I'm moving two steps ahead of the animation and it has to catch up. Feels like tripping on your own feet.
hankbond 1 hours ago [-]
This resonated with me, but I would have loved to see some positive examples as well. The tone did not read as a rant, but as someone that doesn't know too much about good UI construction, I did not feel like I walked away any closer to understanding what a North Star should be.
jastanton 12 minutes ago [-]
Or if the author mocked out what each of the bad examples should look like if done properly.
mbostock 18 minutes ago [-]
There’s a similar principle of congruence in information visualization, stated in Animated Transitions in Statistical Data Graphics by Heer & Robertson as: “Maintain valid data graphics during transitions. To ensure viewers’
mental models are congruent with the semantics of the data, we
suggest that, as much as possible, intermediate interpolation states
remain valid data graphics.” https://idl.uw.edu/papers/animated-transitions
jadar 29 minutes ago [-]
I think a lot of these are because Apple has built animations into their products as first-class citizens, but that means that they need to somehow figure out how to compose them well. (Which obviously is a rather difficult problem to solve!) In my experience, you end up spending a lot more time trying to get all of the animations to work well together than you do on creating the actual UI, and that time is just not worth it if your start and end states are beautiful and intuitive. There's also the cross-UI-framework tax that has come up since Apple has allowed mixing SwiftUI and (App|UI)Kit, and animations are part of that.
skybrian 20 minutes ago [-]
These seem like low-priority bugs to spend time on? Most apps have bigger problems.
ChrisLTD 6 minutes ago [-]
These aren’t bugs in the traditional sense. They built the animation system to work like this, and replaced the old system that didn’t produce these psychedelic transition states.
sam1r 1 hours ago [-]
I feel like OP brought up a good problem to solve, with no solution. I dream of the days where posts like these end with "5 ways to better execute on this today".
Instead, we get a zooming in/out raccoon (making fun of the reader, IMO) for recognizing this problem via the OP author.
Maybe it's just a really hard problem to solve across all devices & latencies... Perhaps more time needs spent on "problem solving" vs "problem description".
flyingshelf 1 hours ago [-]
This is the kind of things that bother me when using software and unfortunately almost every software is affected.
I just look at the largest tech companies in the world that with their unlimited finances cannot produce software that isn't glitchy like this.
vlovich123 47 minutes ago [-]
It would have been compelling to describe / show what it should have looked like. Because the only alternative for some of these would just be sharp jumps instead of any animation - animating simultaneous appearance and transition of information will inherently result in frames that look imperfect.
boredatoms 1 hours ago [-]
This explains why I feel compelled to turn off any animation whenever there is a toggle to do so
renox 1 hours ago [-]
Bah, each time someone say this they "forgot" that one side effect of 'every frame is perfect' is that it can increase latency..
Perfection or latency? That should be the user's choice not the developer's..
Rendered at 16:30:48 GMT+0000 (Coordinated Universal Time) with Vercel.
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.
Often with out it your brain has to rescan the entire page on each refresh.
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 alarms and flashing lights, not an animated "toast".
"Back-in-the-days" you'd click and stuff would instantly happen, and I don't remember anything being more difficult to visually interpret.
On my Kubuntu desktop if I disable all animations (the whole compositor) I don't feel there is an increased cognitive load of rescaning things - but maybe it's my preexisting memory of the UIs and certain baked in UI expectations. Maybe this animated stuff helps people that are computer illiterate? (software made for the lowest common denominator)
https://tonsky.me/blog/every-frame-perfect/toolbar@2x.mp4, for example
I don't think I would have to rescan the entire page to figure out where things were afterwards. Everything's shifted to the right, just like when I open my browser bookmarks.
On a personal level, if thing works - I say, cool, lets focus on something else now.
But I have worked with people who are similar to the author and we will get into the conversation:
I admire those people, because they're valuable asset in some companies (e.g. Google scale, saving 1.4Mb for 1 Billion people every day is a lot), but my mind doesn't even want to think about what's perfect.How do I get there? What are the resources I can read and learn from to look at things to make them perfect?
The issue with “premature optimization is bad” is that some see it as a permission to not optimize at all. Hence you eventually end up with a system where everything is bad.
Instead, we get a zooming in/out raccoon (making fun of the reader, IMO) for recognizing this problem via the OP author.
Maybe it's just a really hard problem to solve across all devices & latencies... Perhaps more time needs spent on "problem solving" vs "problem description".
I just look at the largest tech companies in the world that with their unlimited finances cannot produce software that isn't glitchy like this.