Why and what value motion design actually bring? Check it out!
Motion effects are becoming more and more present in the current apps. Have you ever wondered why and what value they actually bring? ??
The use of in-app motion effects is growing every day. It became possible with the advent of technology, thanks to which animations no longer affect an app's performance,
To make things simple, we can boil down motion effects to just two groups:
? animations,
? micro-interactions and other motion effects.
Animations are usually a part of corporate identity and can tell the story of a brand (e.g. during the onboarding process) much better than a static image or plain text. But animations are also great for communicating the status of a process.
Think of your favourite app. Does it have an animation on a 'thank you' page? Or maybe an animated splash screen? What's on the screen when a page is being loaded?
Micro-interactions show status changes and help users navigate. Designers can use micro-interactions to provide better (more vivid) feedback to the user, e.g. after performing an operation or using a button. Thus, micro-interactions significantly improve the understanding of the user flows or the application as a whole.
In short, animations and micro-interactions significantly improve the user experience. They maintain engagement and provide feedback or prompts. Additionally, they simply make using the app enjoyable. And as we know, an application capable of keeping a users' engagement is simply more likely to be used.
And what does external expert Patryk Nawrocki think about this? ?? Let's see! ??
What will you do to make the user more willing to click on certain buttons? What action will make us feel satisfaction when performing actions on the screen? This is where micro-interactions come into play. The word "micro" is the most misleading in the name - because their effectiveness is much greater. Treating micro-interactions only as a visual add-on is a mistake - they should be looked at from a UX angle.?
Imagine your own e-commerce app. It sounds ridiculous, but your business depends on one button - "BUY NOW". The more often it's clickable the better, so it's in your interest to take care of this element. Maybe fireworks should pop up on the page when clicked? Maybe the button should pop up, and a smiling emoticon should slide out from behind it? We are only limited by our imagination.?
领英推荐
Micro-interactions are, in short, all actions which, when executed, are signalled in a way that is pleasing to the user. For example, after clicking the "Like" button - the thumb icon pops up and changes its colour. While in UX, one of the basic laws is the repetition of patterns (you can find out what they are here), as users are used to certain products on a daily basis, micro-interactions also allow the user to let their imagination run wild. In all this, however, there are some rules:?
? All animations/visual effects should be short. Of course, the length depends on the context - if the micro-interaction is a click on the "Heart" button that is used frequently, then ideally the duration should be between 0.3 - up to 1 second. On the other hand, if we are creating pop-up animations at the very end of a purchase path that is passed quite infrequently, then values in the range of 1 - to 4 seconds may be tempting. I would like to point out that there is no top-down rule as to exactly how long this should take, but personally I would recommend these values.?
? The number of micro-interactions should be limited. If you are trying to make a particular action stand out with an animation, and at the same time you want to animate every clickable element in the system, then ultimately you will not stand out at all. Of course, you can create an eye-pleasing product where every button and icon, gives an animated response, but ultimately they should be simple and neat. If there are fireworks popping up everywhere - then it's hard to make a particular action stand out and allow the user to remember which button produces the coolest effects.?
? The effects of micro-interactions should be consistent throughout the product. The same rule applies to the style of icons, illustrations and other elements that make up the design system (you can find out what a design system is here). Make sure that animations are uniform to build a certain image of your product in the eyes of the user.?
Micro-interactions are also becoming the new standard for 'cool' products. Ask yourself, how do you perceive apps/websites that have nice animations after an action has been performed??
It has been noticeable for a long time that we judge a portal as modern and polished when it has interesting animations. We are accustomed to this by major apps such as (this will be an interesting example) - Tinder, where the main action is swiping left and right, to which is added vibration, sound and the eye-pleasing effect of moving the profile tile - we later measure each new product by the same yardstick, i.e. the amount of pleasant stimuli that came to us during use. The same is true for cars, as we recognize the newer ones immediately by the headlights or the tablet in the middle of the cockpit.?
We also asked another expert about micro-interactions. See what Bart Andrzejewski thinks about them. ??
Micro-interactions aren’t just a visual add-on these days. They can make or break the experience. A few years ago they were treated like an extra step or just an unnecessary gimmick, now they’re a must-have. If done right, they can improve the accessibility and readability of a feature or a product, and make the whole User Journey organic and easy. In my opinion, micro-interactions in terms of user engagement are unbeatable, and this will not change soon. Imagine your favourite social channels without loading (post) indicators, tiny notifications in the top-right corner (or bottom-left :)), and a search field without auto-suggestions while you are typing. Feels way less smooth, right? Some people will say that a well-designed process should work just fine without any guidance, hints, indicators, etc. But is “just fine” still enough? That's why I always put a lot of focus during the product design process on prototyping, which can elevate user experience to another level and make the whole product development handoff look like a child's play.