Design Research: Graphical symbols help improve user experience

Source: Internet
Author: User
Tags copy interface

Just now, I installed the Twitter plugin for Gmail.
After installing the plugin, Gmail prompts me to connect to Twitter's account to use:

As I follow the prompts, I see this page:

All the way down the English interface, has made me quite a headache.
But these two buttons make it easy to guess what they mean even if they don't read the copy.
The "Small arrow" design is really sweet compared to the square buttons.
Here it guides me exactly what I'm doing next.

In TB Ued's latest article, "Chicken-like copy content", said: Can not say not to say, with excellent interaction to replace the copy.
Here can be a small supplement: excellent visual design can achieve this effect.
When we are obsessed with the fact that the copy here is "accept", "allow" or "next", a small arrow is the best illustration of the problem.
The role of graphic symbols can not be overlooked, it is intuitive and easy to remember, very easy to convey information.

I think in the following 3 aspects, graphical symbols can help us to improve the experience:
First, clear direction

From the beginning of our learning of interactive design knowledge, we have been emphasized to "conform to the user's mental model".
We racked our brains to cover up the incomprehensible work patterns of computers.
(1) It is like registering:

We want to tell the user:
Online registration is just as easy as when you apply to open a business in a bank.
Follow certain procedures and you will succeed.
Even better, there are gentle bank sister told you: you still few steps to deal with success.
Who cares how many times the computer exchanged data in the back.
(2) In addition to the operating flow, the appropriate graphics can also guide the direction of the vision:

If this Pull-down menu is not down, it's going to the left.
It's supposed to be a very annoying thing.

Ii. Improving efficiency

Reading a graphic is always faster than reading a text.
(1) In the improvement of efficiency, the most appears is the feedback icon.
In order to speed up the user's understanding of the feedback, most of the site's feedback provides not only the identification of the icon, but also the color to distinguish.


Such feedback, do not need to read all the copy, at a glance can get feedback information.
(2) The advantages of graphics in contrast are also obvious:

Just like the one above, you want to know the services offered by different sellers, and you can see the difference almost at a glance by a graphical comparison.
But if there is no graphics, I believe you have to spend a lot of time:

(3) Of course, there is also the example of Twitter above, which greatly improves the efficiency of my English blindness.
At least, I omitted the time to look up the dictionary.

Third, easy to learn

In the real world, there are many physical objects that can provide us with metaphors.
Although it is said that in complex interactions, the right metaphor is not as easy to find as we imagine.
But for some simple behavior patterns, the use of some common graphical symbols, will save the user's learning costs

For example, above, save on the left and print on the right.
has been widely used in the major software interface.
This generic and even standardized functional graphics, for users, the cost of learning is very low.
Of course, do not rule out the inappropriate graphics instead of the user caused a problem.

When we can not find the right solution by way of interaction and copywriting.
Try to see if you can solve the problem through visual methods.
Just like Twitter's intimate arrow button.



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.