[Микро-навигация (микро-подталкивание) ]- micro-animation to change user behavior
3r3191. 3r3-31. A small, but in my opinion very useful and interesting article) 3r3179. 3r3191. 3r3179. 3r3191. Some do it better than others, revealing the psychology of micro-animation. 3r3179. 3r3191. 3r3179. 3r3191. ![[Микро-навигация (микро-подталкивание) ]- micro-animation to change user behavior](https://habrastorage.org/webt/zj/gc/jd/zjgcjdg2y75lrfmpf6rrkezr-i4.png)
3r3119. Micro-nudging is a timely little animation that encourages the user to perform a “small” task that they may have forgotten or not noticed. 3r3122. [/i] 3r3179. 3r3191. 3r3179. 3r3191.
3r3179. 3r3191. 3r3179. 3r3191. Here is an example from Instagram: 3r3179. 3r3191. 3r3179. 3r3191.
Commenting is a small action that is easy to forget, so pushing serves as a reminder. [/i] 3r3179. 3r3191. 3r3179. 3r3191. "Commenting" is not displayed by default and is not displayed on each individual post. This would increase the visual noise, and its omnipresence would probably worsen the user’s perception effect, so it would be better not to show this action. 3r3179. 3r3191. 3r3179. 3r3191. Instead, the action is hidden by default. Comments are displayed only in the case when the user is likely to comment - when the user is interested in the post. Scrolling down captures the user's attention and reminds him to take action when he already intended to do so. 3r3179. 3r3191. 3r3179. 3r3191. Here is another example from Instagram. The same concept - tags are displayed only when the user pauses and seems to be interested in the picture. 3r3179. 3r3191. 3r3179. 3r3191. 3r360. 3r3179. 3r3191. 3r3179. 3r3191. LinkedIn tried something similar with the “Be the first to comment” animation. But, in my opinion, this was not implemented, as well as in the example of Instagram. *
3r3191. 3r3179. 3r3191. Here is the animation: 3r3179. 3r3191. 3r3179. 3r3191. 3r375. 3r3179. 3r3191. 3r3179. 3r3191. And this is shown for all non-commented posts (and you probably even have to look for them):
3r3191. 3r3179. 3r3191. 3r3384. 3r3179. 3r3191. 3r3179. 3r3191. The problem with this animation is that it happens for every post without comment, regardless of whether you are interested in this post or not. This inability to recognize the user's interest means that this particular animation is pushing for action more than just commenting. 3r3179. 3r3191. 3r3179. 3r3191. When you're not interested in posting, the animation asks you: 3r3119. 1) 3r3122. pay attention to the post, which initially was not interesting to you, and [b] 2) 3r3122. comment. Now it has become a much more “big” task. It no longer reminds the user to simply comment. 3r3179. 3r3191. 3r3179. 3r3191. 3r3119. The main goal of micro navigation is to induce the user to perform a “small” task that they might forget or not pay attention to. 3r3122. If the user is already interested in the post, then ask for a comment - this will be a “small” request. And if the user is not interested in the post, then asking him to comment on this post will already be a “big” request. 3r3179. 3r3191. 3r3179. 3r3191. I also noticed something else, this is the size and obviousness of micro-navigation. In Instagram, everything is obvious - they are big or right in the center of the image, so when the user is really interested in the post, he is less likely to miss these tips. While LinkedIn is smaller. Even if a user is interested in a LinkedIn post, this micro-navigation can be missed by the user as a reminder. 3r3179. 3r3191. 3r3179. 3r3191. In order to fix this micro-navigation problem, LinkedIn needs to be more selective in the use of animation. Show the animation only when the user is interested in the post, in this case the animation will push for further actions. And when pushing, make sure that it is obvious enough that the user does not miss the trigger. 3r3179. 3r3191. 3r3179. 3r3191. 3r3119. In fact, micro-nudges work best when
3r3122. 3r3179. 3r3191. 3r3179. 3r3191.
3r3191.
The task is small, and the pushing serves as a reminder.
3r3191.
Recognition of the user's intention is timely and is shown only when the user "showed" interest. If this is shown all the time, pushing can be distracting, forcing, or just annoying.
3r3191.
Micro-nudging should be easily noticeable, not hidden.
3r3191. 3r3138. 3r3179. 3r3191. 3r3179. 3r3191. By extending it to other areas where else can we use these micro-navigation, where else can we take the user to the desired action? What actions do you want your users to do? 3r3179. 3r3191. 3r3179. 3r3191. These are just some of my initial ideas, as I’m still thinking about it, but if you have thoughts, ideas or suggestions, comment and join the dialogue. 3r3179. 3r3191. 3r3179. 3r3191. ————————————————————————————————————————————————
3r3191. 3r3179. 3r3191.
Note: 3r3156. 3r3179. 3r3191. 3r3179. 3r3191. * My thoughts on LinkedIn animation suggest that LinkedIn is trying to increase participation in its posts. 3r3179. 3r3191. 3r3179. 3r3191. Of course, it is possible that with this specific implementation they simply tried to increase their participation in new published posts, in which no one has yet taken part. If this is the case, then their animation is likely to attract attention, and interest in recently published posts is likely to be higher. 3r3179. 3r3191. 3r3179. 3r3191. But they face a problem, then, when many posts have no comments, this animation potentially becomes annoying. 3r3179. 3r3191. 3r3179. 3r3191. In order to avoid this situation, the animation should appear only in cases where the user is really interested in the post. 3r3179. 3r3191. 3r3179. 3r3191. Who knows - maybe LinkedIn has already tested this hypothesis, looked at the data and found that their current tactics are still more effective. 3r3179. 3r3191. 3r3179. 3r3191. Or, if any of you have tried something similar and collected statistics, comment below! 3r3187. 3r3191. 3r3191. 3r3184. ! function (e) {function t (t, n) {if (! (n in e)) {for (var r, a = e.document, i = a.scripts, o = i.length; o-- ;) if (-1! == i[o].src.indexOf (t)) {r = i[o]; break} if (! r) {r = a.createElement ("script"), r.type = "text /jаvascript", r.async =! ? r.defer =! ? r.src = t, r.charset = "UTF-8"; var d = function () {var e = a.getElementsByTagName ("script")[0]; e.parentNode.insertBefore (r, e)}; "[object Opera]" == e.opera? a.addEventListener? a.addEventListener ("DOMContentLoaded", d! ): d ()}}} t ("//mediator.mail.ru/script/2820404/"""_mediator") () (); 3r3185. 3r3191. 3r3187. 3r3191. 3r3191. 3r3191. 3r3191.
3r3119. Micro-nudging is a timely little animation that encourages the user to perform a “small” task that they may have forgotten or not noticed. 3r3122. [/i] 3r3179. 3r3191. 3r3179. 3r3191.3r3179. 3r3191. 3r3179. 3r3191. Here is an example from Instagram: 3r3179. 3r3191. 3r3179. 3r3191.
Commenting is a small action that is easy to forget, so pushing serves as a reminder. [/i] 3r3179. 3r3191. 3r3179. 3r3191. "Commenting" is not displayed by default and is not displayed on each individual post. This would increase the visual noise, and its omnipresence would probably worsen the user’s perception effect, so it would be better not to show this action. 3r3179. 3r3191. 3r3179. 3r3191. Instead, the action is hidden by default. Comments are displayed only in the case when the user is likely to comment - when the user is interested in the post. Scrolling down captures the user's attention and reminds him to take action when he already intended to do so. 3r3179. 3r3191. 3r3179. 3r3191. Here is another example from Instagram. The same concept - tags are displayed only when the user pauses and seems to be interested in the picture. 3r3179. 3r3191. 3r3179. 3r3191. 3r360. 3r3179. 3r3191. 3r3179. 3r3191. LinkedIn tried something similar with the “Be the first to comment” animation. But, in my opinion, this was not implemented, as well as in the example of Instagram. *3r3191. 3r3179. 3r3191. Here is the animation: 3r3179. 3r3191. 3r3179. 3r3191. 3r375. 3r3179. 3r3191. 3r3179. 3r3191. And this is shown for all non-commented posts (and you probably even have to look for them):
3r3191. 3r3179. 3r3191. 3r3384. 3r3179. 3r3191. 3r3179. 3r3191. The problem with this animation is that it happens for every post without comment, regardless of whether you are interested in this post or not. This inability to recognize the user's interest means that this particular animation is pushing for action more than just commenting. 3r3179. 3r3191. 3r3179. 3r3191. When you're not interested in posting, the animation asks you: 3r3119. 1) 3r3122. pay attention to the post, which initially was not interesting to you, and [b] 2) 3r3122. comment. Now it has become a much more “big” task. It no longer reminds the user to simply comment. 3r3179. 3r3191. 3r3179. 3r3191. 3r3119. The main goal of micro navigation is to induce the user to perform a “small” task that they might forget or not pay attention to. 3r3122. If the user is already interested in the post, then ask for a comment - this will be a “small” request. And if the user is not interested in the post, then asking him to comment on this post will already be a “big” request. 3r3179. 3r3191. 3r3179. 3r3191. I also noticed something else, this is the size and obviousness of micro-navigation. In Instagram, everything is obvious - they are big or right in the center of the image, so when the user is really interested in the post, he is less likely to miss these tips. While LinkedIn is smaller. Even if a user is interested in a LinkedIn post, this micro-navigation can be missed by the user as a reminder. 3r3179. 3r3191. 3r3179. 3r3191. In order to fix this micro-navigation problem, LinkedIn needs to be more selective in the use of animation. Show the animation only when the user is interested in the post, in this case the animation will push for further actions. And when pushing, make sure that it is obvious enough that the user does not miss the trigger. 3r3179. 3r3191. 3r3179. 3r3191. 3r3119. In fact, micro-nudges work best when
3r3122. 3r3179. 3r3191. 3r3179. 3r3191.
3r3191.
The task is small, and the pushing serves as a reminder.
3r3191.
Recognition of the user's intention is timely and is shown only when the user "showed" interest. If this is shown all the time, pushing can be distracting, forcing, or just annoying.
3r3191.
Micro-nudging should be easily noticeable, not hidden.
3r3191. 3r3138. 3r3179. 3r3191. 3r3179. 3r3191. By extending it to other areas where else can we use these micro-navigation, where else can we take the user to the desired action? What actions do you want your users to do? 3r3179. 3r3191. 3r3179. 3r3191. These are just some of my initial ideas, as I’m still thinking about it, but if you have thoughts, ideas or suggestions, comment and join the dialogue. 3r3179. 3r3191. 3r3179. 3r3191. ————————————————————————————————————————————————
3r3191. 3r3179. 3r3191.
Note: 3r3156. 3r3179. 3r3191. 3r3179. 3r3191. * My thoughts on LinkedIn animation suggest that LinkedIn is trying to increase participation in its posts. 3r3179. 3r3191. 3r3179. 3r3191. Of course, it is possible that with this specific implementation they simply tried to increase their participation in new published posts, in which no one has yet taken part. If this is the case, then their animation is likely to attract attention, and interest in recently published posts is likely to be higher. 3r3179. 3r3191. 3r3179. 3r3191. But they face a problem, then, when many posts have no comments, this animation potentially becomes annoying. 3r3179. 3r3191. 3r3179. 3r3191. In order to avoid this situation, the animation should appear only in cases where the user is really interested in the post. 3r3179. 3r3191. 3r3179. 3r3191. Who knows - maybe LinkedIn has already tested this hypothesis, looked at the data and found that their current tactics are still more effective. 3r3179. 3r3191. 3r3179. 3r3191. Or, if any of you have tried something similar and collected statistics, comment below! 3r3187. 3r3191. 3r3191. 3r3184. ! function (e) {function t (t, n) {if (! (n in e)) {for (var r, a = e.document, i = a.scripts, o = i.length; o-- ;) if (-1! == i[o].src.indexOf (t)) {r = i[o]; break} if (! r) {r = a.createElement ("script"), r.type = "text /jаvascript", r.async =! ? r.defer =! ? r.src = t, r.charset = "UTF-8"; var d = function () {var e = a.getElementsByTagName ("script")[0]; e.parentNode.insertBefore (r, e)}; "[object Opera]" == e.opera? a.addEventListener? a.addEventListener ("DOMContentLoaded", d! ): d ()}}} t ("//mediator.mail.ru/script/2820404/"""_mediator") () (); 3r3185. 3r3191. 3r3187. 3r3191. 3r3191. 3r3191. 3r3191.
