How to skillfully and properly hide the design of the interface

Source: Internet
Author: User
Tags touch

The product manager said: Add this, this, and this. Designer helpless threw: on the slap so big place, how possibly put so many functions a brain to plug in? This test to the designer's interface hidden Kung Fu, especially the information overload today, this is absolutely necessary skills, today Tencent's Viconia students to share his hidden skills summary, from the beginning to kill all have, Let's learn!

One sentence summary: You just inadvertently appear, and this is the hidden meaning.

In this information explosion of the society, the message overload has become the norm, in order to enhance the efficiency of users, processing interface information level is an important lesson for every designer to face. The topic that this essay wants to focus on is "hiding" in the interface. In the interface design, hiding is not for the user to hide and seek, but to allow users to better focus on the important content, reduce the interface signal-to-noise ratio, improve the efficiency of information transmission.

I used to play the d&d, very much like the Rogue (Rogue) role, sneak in the dark, waiting for a fatal blow. A good hidden design, can also be the same as the thief's back Thorn to force it? Let's look at the hidden skills Launch conditions first.

In fact, the field of this skill is wide, and it can be performed in fixed and specific situations. First look at the use of fixed conditions. The fixing includes two kinds: it is not often changed and directed to external targets.

 First, the variable settings:

Fixed position or function, when relatively unimportant, operating frequency is not high or one-time settings, reasonable organization of information can be hidden.

such as ebay or Apple's account information, personal tasks can be attributed to the fixed module, "My EBay":

Amazon's rich class navigation from A to Z is hidden beneath the left logo. It's all in the old place waiting for the show:

The fixed position of the whole station can always find it, hiding not only to maintain cognitive consistency, but also save space:

  Second, point to external objectives

This kind of concealment takes into account the number of external sharing platform, often changes and decreases, all show, interface design more complex; the variable setting is absolutely fixed, pointing to the external target is relatively fixed.

Sina Weibo and watercress radio spots, are hidden in a variety of external sharing channels:

The sharing of watercress radio:

So far, the hidden information mentioned above is hidden. Is that what Rogue is capable of? Take it easy, then. In particular cases, "hide" will change the green leaf character to show advanced skills. Like a senior rogue, only in the appearance of the show, beautiful shot back or even hit a blow, will hide the technology to play a pole.

In a specific reading scene, timely prompts the chrome plugin of the hidden choice of words translation:

Apple official website Registration ID, verbatim paragraph fill in, the input box will be timely pop-up tips to prompt users, the Apple ID meets the requirements include these three content:

According to the specific situation in the input process, the problem points, to be completed or special requirements, are targeted tips, according to the status of the target shot, is a successful rogue necessary quality. Timely hints of hidden information, greatly enhance the efficiency of form filling:

For advanced Skills Rogue also has a set of precision back needling skills: do a complete hiding timely prompt, in fact, it is also easy: to light quantitative clues or hints, to seek advanced technology please look over:

 A small place------elegant and just hint

Since the hidden, if the hint too strong, large or obvious, it is against the hidden original intention, appears to be clumsy, light point does not disturb the user's task process, so the hint should be subtle, appropriate.

The small triangle on the bottom right of the well known PS toolbar gracefully invites users to explore more features as needed in their use:

 Second, the gradual reminder

With the task operation process, the user gradually uncover the hidden veil, is the effective hint.

Pinterest in the upper right corner of the message frame input, a very light visual tip: to after the input characters; with the input action, there appears the next step to choose which channel to send the hint:

Prior to registration of real-time check prompts, is also an effective application of progressive hints.

Iii. tips for scanning/reading

Inadvertently user scan quickly, with a small force can pry attention. Rogue is not the best of the meat shield, skillful force is the most suitable.

Compared to digital bubbles, small red dots are enough to cause users to scan the focus, such as Giles Colborne proposed "where to put the label than the label to do much more important":

Iv. Focus/focus on task tips

This is the most rogue action to be reached for the target of the back stabbing: Focus on the target and appear in due time. Usually focus on the task, give a strong targeted operation tips.

The premise of Inbox in LinkedIn is to look up new information or deal with previous entries.

The entire information list, except the new and old information is balanced out of the listing; Once the specific items are focused, the mouse action is exactly hover the corresponding operation tips:

When you see the plus sign for path, it's natural to add new information; Follow the logic before you touch it: Tip To select an item to categorize or close:

Often according to the picture, guess is interested in the content of the picture, followed by the relevant tips. When scrolling up and down, the right side prompts for time information about the order of the publication:

Evernote's label filter probably never told you that it could recommend a list of other tags to you, in addition to the current information tag, and that it would be more efficient to find out what data was collected before, depending on the relevance of multiple labels, prompting for and pushing fast related entries:

Finally, it is the familiar iphone, in the not found and "catch frenzy slippery", the search box comes quietly, and the keyboard prompts you to enter the information you want to find; When you enter, you are prompted: You can quickly change the word, or choose from the recommended items, and according to the characteristics of touch screen, other areas to cancel this call:


Hidden skills say almost, design work, to achieve the hidden success, hit the rogue of the fatal blow, is the design of the balance of the best solution. The effective hiding is for the timely appearance. With great concentration of advanced skills, do the most power design solutions, believe that a hit, in the near future will be.

Related Article

E-Commerce Solutions

Leverage the same tools powering the Alibaba Ecosystem

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

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: and provide relevant evidence. A staff member will contact you within 5 working days.