Stepper VI
Hey there!
Explored a stepper interaction last weekend and came up with a couple of dozens of ideas. I’m going to post some of them during this month. Astrologers proclaim the month of steppers.
A delay of the numbers animation works as an additional hint for a user, as visual feedback of what’s going on. If the last number is animating first, it means that a user is trying to increase value. If it is inside out it says that the value is getting less. It might seem like something extra visuals. But keep in mind that the stepper can be used for untouchable interfaces as well, e.g., desktop software, game consoles et cetera (you interact with UI keyboards, mouse, game controllers indirectly). So it could be beneficial to have help from a motion side to support visual feedback on a screen.
Duration of whole the numbers appearance animation is 1s. It’s not too fast definitely. But at the time it doesn’t look too slow. Why do we use not fast animation in the first place? Immediate feedback from UI is a crucial factor when we take in mind to evaluate the quality of the UI, isn't it? Why do designers slow down their interfaces? That’s a question. And there are a couple of points:
1. We slow down animation to control user attention, make an accent on essential parts of an interface;
2. When a user should learn and adapt their attention to a new UI (slow first);
3. When we need to mask delays in computing and processing of a data.
The last one is more popular. Often it takes time to process user input. For example, we need to compute their data on a server side, and it takes a couple of seconds (lousy internet connection, or some other reasons). To make smooth UX and not made a user wait for a response we can show them an animation. It makes UX seamless and delightful at the same time.