How to enhance the website user experience from visual layout and picture design

Source: Internet
Author: User
Keywords User Experience

Intermediary transaction http://www.aliyun.com/zixun/aggregation/6858.html ">seo diagnose Taobao guest cloud host technology Hall

At present, the Web site visual layout and user experience of the article, is basically translated from abroad, to foreign websites for example. Although goods is our role model, whether visually forward-looking or holistic, details, are very exquisite and exquisite, but have to say, both at home and abroad, whether it is the Internet environment or users of the use of habits, aesthetic habits are very different, so the reference of these translations will also play some discount.

I am doing design, and I like to do some of the online observation research and try, many online projects have tried, but also get a lot of income and harvest. This two-year study of the customer, net earn a lot of projects more. Basically all well-known related sites have tried to operate, because of occupational diseases, but also like the site itself from the interface design, process design, and so on the site to do some research. At the time of last year, I came across a website: Many treasures, immediately attracted. Register now as a user, has been so far. On the other side of the Web site profit model, marketing and so on are not said today, just said, this article mainly from my occupational disease: design. In my opinion, looking at similar websites, many treasures are from the interface visual design, the UI, the overall plan, the process design, even the picture design and so on details, all is this industry first-class. We mainly talk about the design of this site, mainly related to the ease of use of Web sites, user experience, and conversion rates and other topics. Get Up!

A clear and concise top menu design:

Clear, Concise top menu, you can tell the user at the first time what the site is. For example, the top of the fun menu, you see, directly know that the site can do 3 things: shopping, treasure, make money. Even if the user needs to continue to research on some specific functions, the minimum functionality, the user has been very intuitive to understand.

Note that this is the most important division, we all know, the main business is also divided into business, then the menu is the same. Many treasures use the mouse to move on the way, very intuitive shows the lower function:

Because of the many treasures of the treasure and the function of making money, so need a larger area to show. It may be for better visual effects, the 60x60 has a larger icon, which also makes it impossible to show all the child functions in the menu area, so add a drop-down scroll bar to the right. There is a slight flaw in this. The last time I was with a lot of fun customer service exchange, she said that is modifying the presentation here, hoping to see better rendering effect.

The function of many treasures is indeed too rich. Without affecting the core business display, the site uses a "+" more menu, mouse over, will show more rich features. Because the menu location is significant, there is not much loss of user focus. It can be said that the primary and secondary balance is very good.

And this one is also very ingenious, in a very narrow, integrated multi-function content search and different types of bulletin display functions. The appropriate display menu, greatly saves space.

Second, concise and orderly, full of rhythm of the overall layout and details:

Full-size banner large picture, scrolling slide focus. The button renders the caption directly, giving the user a clear view, reducing the movement of the mouse to see the content. Ease of use plus points.

Such steps and functional guide map, in many similar sites have, but more than treasure fun in the design of a better: simple and beautiful, while paying attention to the details of the icon design, so that users can feel is spent the mind.

  

On the left is the latest hottest treasure event merchandise display, attention to the "heat" icon will change with the value of color, very carefully details. On the right is the website recommended by the current hottest treasure and money-making activities. The design of the picture itself is an experienced designer to make. It is worth saying that you must ensure that the picture content is concise. Simple and clear information, can promote user clicks desire.

 

This piece of home page, presents a lot of treasure interesting website two big function plate: take treasure and make money. A concise text introduction is a clear button. The following dynamic display of the latest relevant information, you can visually guide the user to click on the button, into the next process. What is transformation?

The introductory text looks very simple, but it is very intuitive to convey the appeal. Fresh and bright new trend pictures, is not able to attract users of curiosity? Visual attraction, and then the next step into the business, which is the most popular smart way. Simple and effective. This is a lot of treasure is also the details of processing: the mouse over the picture, you will appear the details of the product.

It is noted that there is no, above a large banner of the overall white elements, followed by 3 pieces of separate, with a gorgeous color advertising pictures. Is that what you want? In design, this is called "Rhythm": from the white to the color of the rhythm, from the whole to the division of the rhythm, from large to small pieces of the rhythm. The interface has a visual rhythm that eliminates visual fatigue and ensures continued user browsing interest. Looks simple? Yes, but it's really hard.

Because the Community function is relatively minor, so many treasure interest will be placed in the site's home page lower than the position. It is important to show what users are most interested in. Many treasures show the "drying list" (that is, the user to get the sun after receiving the goods), the user's latest "talk" (similar to the words of QQ), as well as the latest and most active user display. Analysis, the sun, you can directly guide the user to understand the past order information to show the integrity of the site, to guide the user to conduct the next step to prepare, and display the user's dynamic, new users, and so on to show the popularity of the site. Every piece of content has its own description.

Many sites do not pay attention to the bottom of the site design. Think this position is not very important, the attention is not high. In fact, it is important to improve the user experience by doing the details of each place. Although the bottom of the many interesting display content is very similar to the content of the site display, but also in the design of a lot of fun to spend enough kung Fu: 1, using the overall dark gray tones, to ensure the overall sense, not too loud, distracting (because this is the general bottom, and the bottom of the content more, if the full use of color, Will greatly affect the user focus point); 2, the overall orderly arrangement, to ensure the comfort of visual feeling, design and professional sense of a strong icon design, to ensure that the user's sense of trust.

Above, is to many treasure Interesting website homepage visual design analysis. To actually look at the site, you can see [here]. In the back, I will continue to explain the site of other pages of the visual design and process design dongdong, analysis, a good site visual design and how to enhance the user experience.

adjourned)

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.