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 (no animations, movement is directly tied to your hand) to a pencil with a pompom on a spring attached to the end. Which is most fun for brief use? Which would you rather write a whole page of text with?
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, for example, but rebounding the last few pixels from an imaginary slide. Our eyes just draw their conclusions to inform us of a movement, and in exchange the component is readable and usable immediately.
[1] ~100ms represents optimal reflex time in recent research. [2] Anything that requires user attention to interact after the component appears is very comfortable with a 150ms transition. One important note is that for components you can navigate across (i.e. one key shortcut invokes a modal state, another key runs a command in that modal), experienced users will "type" consecutive shortcuts in one go, and you must have the second behaviour responsive from frame 1.
[2] Some athletes seem to train down to ~80ms on very specific reflexes, which recently lead to race-start controversies when block timers disqualify sub-100ms reactions for runners.
> ~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, that is single-digit milliseconds, at higher skill levels. (Chopin’s Fantaisie-Impromptu is among the easier rhythm-based parlour tricks and already requires staying below ~30ms of error. Alternatively, a single frame at 60fps is 17ms, and speedrunners can hit single frames of a game pretty reliably.)
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.
I'm pretty sure that the way speedrunners get their fast times are by either anticipating, or more likely, by finding an earlier trigger event that correlates, and allows them to hit the frame perfect timing.
Yes, that was my point: just because people can’t react to unexpected events faster than ~100ms does not mean that shorter time periods can somehow be disregarded as imperceptible to the conscious mind or beyond human capability. The perception or reaction jitter is easily an order of magnitude lower than the reaction latency.
Reaction time is unrelated to perceptible latency. You're not reacting to things; you are seeing the result of an action you requested. You already know it's coming. To say that delays less than your reaction time don't matter is like saying it doesn't matter if your flight is delayed by an hour because it takes 8 hours to cross the Atlantic.
Watching your own hand movements through your phone camera is a good demonstration of this. Set 60 Hz video mode, and the latency is probably less than 30 ms - but still extremely obvious.
it's quite a lot more than 30ms, as phone cameras do some real heavy-weight image processing to compensate for their tiny size, I'm talking neural networks and such. the throughput might be 60fps when it's all conveyor-ed but the latency sure isn't
You're right. Looks like it's more around 90 ms, at least for my iPhone 12 Mini. Test setup was taking a photo of the iPhone 12 Mini watching an incrementing counter on a 50 Hz CRT.
If the animations are effectively 'cancellable', i.e. they don't block input or delay the change in state, this can be reasonable. You can put in a sequence of actions into a UI at a much faster pace than 100ms, if you have the muscle memory for it.
Using a keyboard or other hardware input device, yes however in today's modern touchscreen world, you have to wait for the UI to render before you can get to the next step so you do build up a step for the next step memory, but you do have to watch the screen so it's not exactly muscle memory.
I think this is key to understand the motivation behind pretty and animated UIs. In games it has a different motivation compared to UIs that you use as a tool. If you compare old software to new software, a lot of tab switching and hotkey magic is simply not there anymore. Blender has a notoriously difficult UI but once you get the hang of it, you become very efficient. I think the current way of creating UIs caters to people making decisions of whether to purchase the software but that don't actually use the software in the end.
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.
Hover effects are a terrible way of indicating if something is clickable, because you have to mouse over them instead of just looking at them. This problem was already solved a long time ago by rendering inactive elements in gray. I'm not sure which GUI did this first, but the Apple Lisa (1983, first mass-market personal computer with a GUI) definitely did it.
Everything in reality is animated. Nothing instantaneously snaps between two states. Which is why UX designers want to animate everything, it looks more natural for something to move from one place to the next rather than snap instantaneously. Everything used to be even more animated, ebook readers would play a 3D page turning animation, these days we settle for subtle abstract animations.
>Everything in reality is animated. Nothing instantaneously snaps between two states.
That's precisely why a GUI should not be animated. No matter how I operate it, the action I use already has its own animation, e.g. my finger moving on the mouse. If I add another animation in the GUI itself that's double animation. It's equivalent to pressing a button and triggering a servo to automatically press that same button.
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 meanwhile.
Animations might be a good idea in theory, but it doesn't seem like anyone has figured out how to do them right.
Unless you can back that up, "Majority" is something you're making up. It's a guess.
It also doesn't matter whether it's true if the majority or not- "Instant transitions are only good in theory" is not a true statement. Instant transitions are good in practice for many people and that has been true for decades.
Most people with that opinion keep using apps and devices with animations, but thinking it would be better without them. Very few actually torture themselves like that in practice.
I thought I had disabled animations on android, but it looks like I have it set for half duration.
Probably because I had run into some apps with bugs when animations are disabled, and making them run twice as fast as normal is more compatible and reduce the annoyance enough that I forget its enabled. Apps that animate at normal speed in defiance of my settings get deleted.
But I also set windows not to show window content while moving or resizing, because I find that to be annoying too.
Reducing duration or eliminating animation is one of the first settings I do on a new install.
Most shoulder-surfers who see my phone ask me how everything's so fast, and get me to show them the settings. Being able to disable the extremely-excessive animations many things have nowadays is fantastic, and is a great reminder that hardware actually has made progress in the past two decades.
(I use accessibility -> reduce motion, personally. less flaky than the dev options, though also less reliable)
Finally someone not roleplaying. You're the first person who acknowledges the flakiness of the dev options. People are self-reporting when they claim they set it to 0x without realizing it's unusable due to the bugs.
Denigrating others as "roleplaying" is unnecessary and not serious.
AOSP is not the only operating system that allows you to disable animations, even if its implementation is not the best. And yes, I still use 0x on my Android, because it's still that much better than having animations enabled.
Setting animations to 0x is famously broken on Android with the UI jumping up and down on transitions. It's a litmus test to spot people falsely claiming they have it disabled without realizing it outs them.
You continue making unsubstantiated claims with loaded terms, denigrating others by accusing them of being dishonest when just stating their preferences.
It's not a litmus test, you are simply wrong in the way you dismiss other people.
Some of us like it at 0x, even when some apps are janky. Further, plenty of us here use desktop operating systems. Android is not the only way to get on the internet.
Both Windows (at least as of 10 and before) and most Linux distros allow you to disable animations too, and it works fine. Desktop operating systems ~15+ years ago lacked these animations entirely.
For a professional tool, animations are anathema. They interfere with muscle memory.
Someone who uses a program continuously can be clicking or typing before a dialog box or button is even in the right position.
My wife drives me MAD with this. She has already clicked the cancel button on a popup before I can even read the first word in the dialog box. This is fine when she is working as the dialog box is just a dumbass notification from some idiot UI designer. This is NOT fine when she has asked me to help debug a problem. I have to force her hand off the mouse so that I can read the damn error message before she clicks it away.
I don’t understand this. One of my colleagues drove me mad with exactly this behavior. He opened an internal tool to load some complicated data for visualization. The tool immediately had a popup that said “Loading” with a sole button labeled “Cancel” in it. He reflexively clicked “Cancel” and then complained that the internal tool did not work at all.
The amount of times people asked me for help without even reading the very obvious error message is astonishing. Many people just completely switch off their brain when anything goes wrong.
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.
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.
Not the gotcha you think it is considering how common fake loaders are in all application development. They're inserted for a reason, but that's a different topic. We're talking about pure animations here, not loading screens.
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.
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.
I agree that some things have a use and can do so without getting in the way, but I think as your example illustrates it is mostly to help new or infrequent users who aren't familiar with how the system works and often comes at the expense of regular users. Like mrob mentions (with a wonderful example), I usually want software to function like hand tools where I can just do a thing as quickly as I can do it and without unnecessary distractions. I've turned off cursor blink in my terminal and even though it isn't as bad in the browser I just turned it off in Firefox since you mentioned it (add a new preference ui.caretBlinkTime set to 0). Some of us do get more distracted by this kind of thing than others :/. Same with audio cues.
I do still like progress indicators when you might be waiting on a longer task (and when it actually indicates liveness, which too often it doesn't :( ).
Games I can sometimes appreciate the new user benefits and affecting the pace can sometimes have an artistic intent or relaxation effect that tools should not normally have. I have stopped playing games for excessive animations and will usually quickly (but not always immediately) disable anything that can be disabled. It is so common that I distinctly recall the free game Strange Adventures in Infinite Space intentially doing the opposite to great effect (it has been a bit but I think it was not only instant transitions but on mouse click instead of release).
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 bit slightly disorienting with certain workloads)
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.
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.
Hardly any difference. If you haven't seen it before, try an Android phone in your hand and toggle animations 1x/0x and see what a stark difference it is. iOS is still littered with animations all over the place with that toggle enabled.
Games are games, work is work.
I disabled every animated transitions in my desktop UI. Elements appear instantly at full size in the place they rest and disappear instantly.
Reasons:
1) I'm doing that thousands of times per week, I know what's going to happen
2) It's my desktop, there is no one else who might be puzzled by a non standard behavior
3) It's faster.
By the way, it is a GNOME desktop on Debian 13.
Oops, I lied. I was about to click on Reply and I realized that the bottom panel (which on a standard GNOME is at the top) is on autohide with a short transition. Maybe because it's the only transition that I activate with the mouse pointer: I hit the bottom of the screen and while it's traveling the last pixels the bar starts sliding in. It's very fast.
Compare an ordinary pencil (no animations, movement is directly tied to your hand) to a pencil with a pompom on a spring attached to the end. Which is most fun for brief use? Which would you rather write a whole page of text with?