NetEase Mailbox Speed 3.5 version lasted more than half a year to finally meet with you.
What are the new features of speed 3.5:
- Neat, concise home page, able to adapt to the size of the screen to provide the best way to display.
- Integrated sidebar design, more centralized function, find more convenient to use.
- New icon Design, read the letter when the letterhead information can be minimized, so that you get a larger reading space.
What have we done:
- Countless interactions, visual discussions and validation with research.
- Output effect chart, more than 200 pieces.
- 1 sets of "visual design Specifications" and 1 sets of "interactive control specifications" have been developed.
Briefly talk about some of the things you do at various stages:
with the research stage:Speed 3.5 with research mainly to do the work: competition analysis, focus groups, questionnaires, usability testing, experts to check.
1: The analysis of competitive goodsThe goal is to analyze the advantages of competitor mailboxes, why users like to use the reasons, which can learn. Mainly from the main function, interactive experience and product integration, emotional design 4 aspects to analyze, the main analysis of the mailbox has: Gmail,qqmailyahoo,hotmail and so on. What should be a good mailbox?
- Excellent mailbox product main features and interactive experience in the advantages of highlighting.
- Excellent mailbox use relationship chain and product integration can improve the product's user viscosity.
- Excellent mailbox emotional satisfaction can bring a deep impression on the user.
2: Focus groupThe main purpose is to understand the students, work two groups of different major user groups on the needs of the mailbox, explore the new version of the design ideas. The main conclusions to be drawn are:
- In many ways of communication, why do users choose mailboxes?
- In many mailboxes, why do users choose a specific brand of mailbox?
- What features and services are important to users?
- What are the needs and expectations of specific functions or services for different segments of the population?
- How to push the diversity function to different groups?
Mainly used the card analysis method:
The main conclusions drawn are:
e-mail emphasis on formal communication
- When users engage in business or other formal communication, the role of e-mail can not be replaced. In addition, some non-communication functions of e-mail, such as file storage and the function of registering as ID, are also the outstanding features.
- The answers we get in the focus group are similar to the findings of Eric's survey. Combined with the user's evaluation of other commonly used and love mailboxes, we find that excellent mailboxes can better help users to achieve their main goals.
- For example: Gmail has a great advantage in formal communication, such as label function, correspondence display function, etc. while QMail has great advantage in storing backup information.
- This result to our Enlightenment is: Excellent mailbox, must reflect the user's core needs. So what do users really need?
The requirements of the workgroup and student groups for the main function are high and common.
- Team users in the use of mailboxes, more attention to whether the efficiency of the work can be improved, so powerful search function, contact e-mail and other functions, in short, can reduce management time, improve efficiency of the function can attract them.
- The needs of the student group are more diversified. Closely linked to the school's "circle" culture, "sharing" is very important, therefore, students need group mail, group message functions such as, they share a lot of files, such as movies, music and so on, and will explore and use a number of extended functions, but the function must be changed to attract attention, Not just a simple overlay.
3: Usability testing is mainly to the mailbox itself product experience inspection, by observing the user in the product to complete a series of tasks, find the usual difficult to find usability problems, and then according to the importance of the problem and the severity of the batch solution.
Initial design-usability test Some results:
Test period-usability testing part of the summary:
Interactive design phase:
Concept Draft phase:
The mainstream of the mailbox design, home, inbox, read letter, letter, Address Book.
About left navigation:
NetEase Mailbox Speed 3.0 frame is the navigation + left navigation, although highlighted a number of major products, but the product logic has some problems, such as: Open the top of the Address Book, treasure box and other labels, in the frame on the left column or display "Inbox, sent ..." And so on "Mailbox characteristics navigation. New Edition 3.5 To solve this problem and optimize the left column to make a lot of assumptions. Finally, the 5-layer concept is differentiated:
The toolbar relationship and content have been combed again:
The tool bar is analyzed, and the use and importance of each function is analyzed in accordance with each content. I hope to give users the most comfortable way to use the tool.
Develop NetEase mailbox Interactive control specification:
How do you define this specification? NetEase Mailbox Interactive Control specification is the mailbox used by all the controls summed up (such as: tags, breadcrumbs, links, windows), the use of all control methods, scope of application, interactive norms, such as the development of standards, the formation of a unified document.
Why do you want to do this?
- In order to form the unified standard and style of the application control of the mailbox products, ensure the user interface usability and the user experience consistency of the mailbox products.
- Optimize workflow and efficiency so that designers do not repeat mistakes in the use of basic controls.
- Help new designers get started quickly, familiar with the design details of the mailbox interaction.
What does the specification include? Includes a total of 18 commonly used controls, divided into four categories: navigation class, Description class, control class, hint class. For each control, explain and analyze from four aspects.
- Definition--Defines the properties and effects of a control.
- Composition element--resolves the elements that the control specifically contains when it is used.
- Scope of application--analyze control usage scenarios.
- Interaction specification--from use cases, mouse interaction, text, and page structure to explain the use of controls.
Visual design phase
The default version of the speed 3.5 visual design direction is: "To provide users with the most concise interface to better assist users of the operation," in this direction, you need to follow these principles:
- Fully assists the user to operate, does not produce the superfluous visual information.
- For each color appearing in the interface to do demanding, hashed.
- The default style is as simple as possible, putting more ideas and ideas into the skin.
Here are the various stages of visual design:
In the design time removed 3.0 has always been strong texture design, hope that the design as far as possible "back to the park" to the principle of practicality, hope to create a more comfortable operating environment for users, and even hope that users do not feel the existence of visual design, more focused on the operation.
Part of the specification of visual design:
Visual Design Specification:
Extract common elements, such as text, colors, lines, balloons, tips, labels and so on to make the specification, the follow-up to the mailbox to add the function of visual design and skin changes to guide the significance of speed and quality of design.
Icon Design:
Speed 3.5 Club A new set of icons (including weather icons), design of all the mainstream icon style analysis, combined with the main interface and NetEase product design style, so that later can be applied to netease other products of the same type.
Weather icon:
Get rid of the original cartoon style and hope for a more realistic feeling.
Next, please look forward to NetEase mailbox Speed 3.5 version of the skin-changing function.
