Should the action be subtle or noticeable?

Source: Internet
Author: User
Tags new features

Back to the Tang Dynasty, Du Fu has said that the excellent dynamic design of the wind into the night, the smooth things quiet. Thousand years later, as a CI poet Huang Weiwen, like wood like stone words can get attention? To make an accident, suddenly sing can be eye-catching.

After reading this article, you may realize that 80% of all the dynamic effects you see in various applications may be inappropriate or unnecessary.

In essence, the application interface is in the 2D frame of the display for us to show a broader 2D or even 3D world. In real life, if you put a hammer in a drawer, it's there, you know, pulling out the drawer and you can see it. In mobile phones, if an element is moved out of the screen, it no longer exists. Therefore, to apply the design of more "intuitive", it is important to make the interface elements to the user in real life familiar with the way to exercise.

All along, I design applications, painstaking research on a variety of applications, reading, online consumption content ... Experience has taught me that the dynamic effects of various interfaces can be broadly divided into two categories:

A subtle and dynamic effect

Compelling, dynamic, and effective.

A subtle and dynamic effect

Do you use Facebook? Don't open Facebook apps and tell me: when you scroll up and down in the feed interface, are there any other elements that are moving in addition to the content? Think carefully ...

The answer is: Of course, there's a chant.

That said, maybe some people realize that when content scrolling, the top of the search bar will automatically be closed, but it is quite obvious interaction, the intention is to provide more visual space when the user browsing content. Seemingly simple things, but the good thing is that the user may not even notice this.

This is the classic example of "subtle action": For my actions, interface elements can respond in a way that is very intuitive and not even noticeable to me.

The details of Facebook are awesome, but you never thought it would be so much! "the latest Super Fire!" Design details in 23 Facebook paper

HIGH energy!!! Ahead

ACHVR application is a counter example. On Facebook, when I move my fingers up to 5 pixels, the top search bar also moves up 5 pixels, which makes me feel like my actions are keeping the search bar hidden. In the ACHVR, a very small roll-screen operation will result in substantial movement of content, the interactive experience is very inconsistent with expectations. In Facebook, we barely notice the changes in the interface itself, and in ACHVR, my attention is forced to focus on interface interaction.

You know, in the two pictures above, my fingers are moving the same distance.

What's the situation?

Apollo Robbins The process of pickpockets at TED (Https://www.youtube.com, a ladder) and discussed why our brain can focus on very few things at a time, such as a spotlight on a podium.

Let's do a little experiment: what is the application in the lower left corner of your iphone's main interface? Try it now and see if it's consistent with what you remember.

Then put the phone up and don't look at any other devices, tell me, what time is it?

You can actually see at least two times in front of the phone, but you probably didn't notice it at all.

Simple, intuitive everyday things are often overlooked by the brain because it's hard to find anything interesting or surprising in it.

On the other hand, your current attention will still be attracted by the little squares that are flashing in the lower left corner of the above picture, right? Because it's in a situation that doesn't correspond to our intuition, you don't understand why this thing is flashing all the time, so your brain will focus on it.

So, when we roll the screen on Facebook, it's usually hard to notice because the search bar is hidden in a way that's exactly what we're doing when we move our fingers, and the ACHVR content is moving far beyond our subconscious expectations of the results of the operation, so it feels abrupt.

Sometimes you don't want the user to notice something, and some times it's the other way around. This leads to the second kind of dynamic effect we are going to discuss:

Compelling, dynamic, and effective.

As you may have guessed, the main thrust of this type of activity is to lead users to focus on a place, such as some new features that you want users to notice.

The animated picture above demonstrates the Animoto video maker application, and I like to use it to demonstrate the dynamic effect of focusing attention. In order to avoid the use of the Novice tutorial a kind of cumbersome things, animoto trying to create a very simple mobile interface, and through the dynamic effect to attract the attention of users, interpretation of the Operation method. When the user enters the interface shown above, suddenly see the panel bouncing, it is very difficult not to try to open it to see the point.

The illustration above shows the introduction interface for Jink applications. Where did you notice that? Nature is the action. People usually don't pay attention to the introduction of the new application, but I really noticed it in the jink. Many applications try to get users to read some introductory text in these interfaces, but jink just use the text as an adjunct to interpreting the animated demo.

Conclusion

"Oh my God, look what I've achieved!" Almost every new developer will say so. This feeling is not bad, but it is also very dangerous. At first you don't know how to present a UI element, and all of a sudden you can make everything cool and move away. I have been like this a long time ago, and I am often caught up in this desire now and then. However, we must always remember that the beautiful action you have just achieved is not necessarily really necessary. Remember to consider the following points:

Your ability to move UI elements doesn't mean you should.

Most of the activity is naturally categorized into the "compelling", which means it's easy to move the user's attention away from the really important elements. If you're not sure that something is really necessary, get rid of it.

If something must move, ask yourself whether the content or function here needs to be subtly changed, or should the user immediately notice it?

Find a senior developer and ask them what they think. Your friends will usually tend to tell you that it's really good if they know it's you, but developers know how it works, and they won't be affected by the appearance of cool or innovation.

Try to observe the performance of the product in the actual situation. I strongly recommend that you do not just look at the good apps, the bad ones are also worth reading. A good application can tell you what can bring value to the user, and poor apps will let you know which ways are not going to work.

"Imperceptible effect" than "eye-catching dynamic effect" to be more difficult to design, remember to spend more time to delve into the analysis.

Wait, about ...

You may say, those traditional dynamic effects, such as the level of the interface progressive, discoloration, pop-up, zoom in and so on, are different styles of action, how can only be divided into two categories? I agree that each of these dynamic effects can be carried out separately to explore, but I also believe that, in general, the main effect is to do two things:

Feedback responses to user behavior in an intuitive manner.

Attract the attention of the user.

So, in the future, we can try to start from these two directions, to observe how we usually see a variety of applications to create the dynamic effect of these two goals, the design is reasonable and worth learning.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.