Mobile on the design of NetEase and picture library redesign upgrade Design

A. Mobile phone on the process of NetEase http://help.3g.163.com/

A website or a page in a period of time will be a revision, and more easily urged the revision of the situation there are several.

1. The user experience needs to be greatly improved. 2. The demand for user habits has changed markedly. 3. Organizational structure or other reasons for adjustment. And this time the mobile Phone page revision is mainly the 1th. Summed up in the early stage did not seriously analyze product positioning and product design direction is the result of this rework a lot of important reasons.

The main difficulty is the accurate presentation of the relationship between functions and the intuitive nature of the structure organization.

First of all, the mobile phone NetEase Web page is to help users how to more easily and quickly use the mobile phone landing page. Mobile NetEase Web page is to allow users to understand the benefits of mobile Internet, faster and more timely and anytime can pay attention to each piece of information. After analyzing what is the mobile phone NetEase network can probably divide the main structure of this page. Second, the user most likely to use the crowd is the first mobile internet users, so the design interface must be friendly and accurate and intuitive. Another group of users may be senior users who are familiar with the operation of similar products. And a handful of users are passing by. Finally, users may use the environment mostly computer operations, but also may be mobile internet and anytime. After a brief analysis, you can determine how users should use the relevant interface elements.

The following figure is the mobile phone NetEase network before the revision of the page.

On a large structure, one. The page helps users to easily and quickly use the mobile phone landing page, while the mobile phone login page Two channels between the functional relationship does not express accurate. There is also ambiguity in the text description. Mobile phone input 163.com and send free SMS is actually the main function of this page two ways. Two. The content that the help page plays also does not show the intuition. There is no obvious difference between primary and secondary, the focus is not outstanding. Thus, the focus is dispersed, users are less efficient, and there is no reason for the graphic rendering to form a visual noise. After analyzing the general framework and the relationship between the various functions, a large frame diagram comes out.

The following is a simple framework diagram:

The following is the latest Mobile NetEase Network revision page:

While there's a lot of detail on the page that's not good enough, it's a good UI design guideline as long as you keep moving forward. Accurate information expression, to eliminate the ambiguity, primary and secondary clear focus. If you do these two points, it may be a good design products. If together with the first two points in addition can make the information to impress people. It could be a work of art. For example: Apple ...

two . Picture library design Process

Photo Gallery This revision is not a success, is still continuing efforts. Combined with the first case to urge a product revision of the situation, the picture library is combined with the 1th and 2nd, the user experience needs to be greatly improved, user usage habits have also been significantly changed. And the design of this image library is difficult to adapt to the style of each channel and how to communicate with each channel to the user in the use of Photo gallery, what is the main purpose ...

Here is the original version of the page:

A picture library that is initially designed to meet the requirements of each channel and adapt to departmental specifications. and the revision of this page is for the revision and revision, and does not really stand up to the user's degree to consider, in fact, the user's purpose is very simple and intuitive, this page presents a lot of messy information. First, the title has two, the brief text has two, the navigation has three, the search box has two. The focus is too much to confuse the subject. Does the user really need so much information?

The following is the last Photo Gallery revision:

Although the subject of this revision is much clearer, however, the use of the norms on the various channels to do the work also need to coordinate, although the image library function than before there are obvious improvements, but also produced like the audio and video playback of the same scroll bar, so that users faster and more convenient to find their own goals, but not to do a better user experience. When creating an interface, there are always problems. Never mind, just keep moving forward and remember that the UI is easy to use.