From the proper way to the iPhone

Wen: Ethics cloud notes head of Jiang Wei Hang, while we and other Internet product teams exchange in fact, there are many friends have mentioned a problem, that is, how to choose a suitable design for their products in? Youdao cloud notes iPhone version of the new product design, we have also encountered a typical situation in the above problem. After nearly four months of exploration and practice, we also found some suitable solutions. Therefore, we share in knowing, hoping to discuss with friends who have similar problems.

This article is long, and in order for everyone to feel that this sharing may be really useful, I will be the first to write some performance data, blowing leather. After the debut of the new Cloud of Note iPhone , the daily life rose to 25% while the number of new daily notes per person per day increased by 100% . In the user evaluation of the product, the product has reached 55 NPS , can be said to reach the highest point in history, while in the App Store five-star praise reached 91% . The preliminary data show that the revision is actually more successful.

Finish the data, the following to talk about our thinking process.

Timing of revision: Products are the need to bridge the gap between " early adopters " and " early publics. "

At first, the proper way cloud notes for the first time and we met in June 2011. Youdao notes after two years of development, the number of cloud notes users has grown rapidly from 0 to 20 million. In the process, we can say that we are deeply impressed by the rapid development of the entire cloud notebook category in China. From the very beginning, I also need to introduce "cloud notes" with friends around me. By now, many people can already name a few tried and tested cloud note brands. It also means that cloud notes have been transformed from the early GEEK "innovators" and "early adopters" into the broader, mainstream "early public." We are fortunate enough to stand in front of this chasm, and if we can succeed, cloud notes can be brought into the larger mainstream market.

Through our user research, there are more and more mainstream public users who have the cloud track record. The primary / secondary users of cloud notes account for 70% of the total number of users. So, we think it's time to think about what the iPhone side of the Cloud Note should look like for junior and mid-level cloud note users.

Revision target: to enhance the efficiency of the basic functions for the mainstream users

According to our research, two of the most frequently used features of Dao CloudNote iPhone Edition are browsing notes and fast fragmentation records. Data show that more than 60% of iPhone users browse the contents of notes every day, while about 30% of users are doing fragmented records. In our research, junior / mid-level users said they agree with the advanced features of the product (whiteboard correction, note sharing, to-do list, attachment center, note-taking tags, WeChat collection, reading passwords, etc.) This product is trustworthy and has potential. But they do not think they need to know how to use these advanced features right now.

So there are two ways before us:

1. Develop more and more cool advanced features for GEEK so that they form the basis of word of mouth to drive mainstream mass users;

2. Designed for the public users more simple and practical interface, the core functions are placed in the application where you want to go, do not have to remember do not have to find, truly "Do not Make Me Think."

As we said earlier, our most important goal at the moment is to bridge the gap. So for today's cloud notes, what we lack is not cool, dazzling advanced features, but how to make white users, get in touch with this product for the first three minutes to get started quickly and be impressed.

So in the end we chose the latter.

Therefore, the goal of this revision is very clear: to enhance the basic functions for the mainstream public use of efficiency - that is, to allow users to intuitively note browsing content and easy to record.

Implement three phases of the revision: Define the basic interactions, define the vision scheme, optimize the critical path

1. Define the basic interaction

Once we've set the goal, we need to determine the basic interaction pattern for cloud notes. We are faced with another option: tab bar or drawer interaction.

Since its release, we have been using Tab Bar's interactive mode to guide users through the different functions, which is also the most common mode of interaction in the application market. Tab bar has the direct display of content, at the same time support the advantages of fast switching classification, suitable for five or less core categories and each category has a higher utilization of the application. For Youdao Cloud Notes, this interaction model will be very suitable for geek users to explore a variety of advanced features, while ensuring the basic functions of the convenient operation. After Google introduced the concept of Navigation Drawer in 2013, this interaction model is also beginning to be widely used. Compared to the tab bar, drawer less valuable screen space, you can maximize the display content. At the same time, users can focus on the current content because there is no interference from other factors. In addition, the drawer's in-class design flexibility allows for good switching between different categories and levels, making it ideal for applications that require high levels of navigation flexibility.

The new design goal is to allow users to intuitively note content browsing and easy to record. Browsing requires a maximized, unobtrusive display of space while readily recording the quest for a faster and lighter experience. Based on these two core goals, we chose a drawer-style interaction model. In this mode, users can directly browse the contents of the recently modified notes as soon as they open the notes, display more space and interference factors are also minimized. Through the main interface supports a key to create notes, the recording process to achieve light and fast. In addition, the user also has the convenience of quick access to advanced features through the function entry in the drawer. The following diagram more intuitive display of the interaction between the old and the new version of the two contrast.

2. Define the vision scheme

In this comprehensive revision, we have also redefined the visual scheme of cloud notes. According to the characteristics of users of cloud notes, three key words of visual solutions are defined as individualized, young and flat.

Personalized foothold is to enhance the user's account of the cognitive notes. As a cloud note that synchronizes across platforms, a user's note account is the heart of the process. In our visual program, the user account is no longer a mailbox number, but is added with the user avatar, nickname, gender and other elements, and was placed in a very prominent position - sliding drawer interface at the top. We hope that through such a design to users to pass "Youdao cloud notes is accompanied by your personal notes," the idea.

As an efficiency application, the main color of Dao Yun's notes has always been a steady, efficient dark blue. More and more young white-collar workers and university students become the users of cloud notes. They are energetic, fashion-sensitive and dare to try new things. In order to increase the attraction of cloud-based notebooks to a younger user base, our new visual solution adopts a more interesting and lively visual element, which is mainly light in color proportion and is decorated with lively colors. In addition, in this revision, we also comply with the trend of flat design, with interaction, so that users can appreciate the simple style.

3. Optimize the critical path

In addition to redefining the main interaction model and the main vision program, this revision is also optimized for the critical path users use cloud notes. Here are a few examples.

1) improve the efficiency of the first page browsing

One of the characteristics of Yodao cloud notes is that users can record notes in a variety of forms: text, pictures, sounds, handwriting, attachments and the like.

Our research found that when the user to quickly take notes, positioning, notes and notes title as important. So in the new version, the notes core content elements are placed as important as the title of the notes - as shown in the notes list on the homepage. This allows users to browse the notes list, you can note title, body summary, picture summary, attachment summary and other elements quickly locate notes.

One of the difficulties that has surfaced with this design is that the picture and file elements that are visually "visually heavier" than the text break the sense of rhythm in the note list, making the list slightly messy. During the many attempts we made, we finally focused on both the card and the content segmentation.

Through the trial and comparison of the two prototypes, we realized that although the card can force the content to be segmented, it is more in line with our design principles to partition the content elements of the organization - in the simplest form, let the user focus on Notes content itself. We make a more elegant and elegant appearance of the page by finely adjusting the pitch of the title text color, abstract, pictures, attachments and other elements.

2) Fast fragmentation record

In the new version, we move the new note button from the bottom middle of the homepage to the bottom right corner. Click the eye-catching green plus button, the user can create a new note. Similar plus design can be seen in many applications. Unlike other applications, when the plus button is clicked, the note application does not show the option of letting the user select a new note type. Instead, it goes directly to the text editing state of the edit interface.

This design is based on the principle of "optimizing for the user's main scene." Through user data, we found that when users create a new note, the proportion of text type notes is much higher than that of other types of notes. Therefore, for junior high-level users, let TA without thinking and choice, the direct start recording text type notes is the most appropriate. More complex types of content, such as pictures, audio, attachments, can be added by long pressing or entering the editing interface.

Implementation of the revised project agile management

Finished the choice of design ideas, and finally talk about our team in this revised project agile management.

We started project management using agile development early on (see Scrum Agile Development Practices for Cloud Notes). In this revision project, we made further optimization on the basis of the original management of the agile project. iPhone end revision project began in late 2013. The project has gone through three phases: basic interaction and main visual finalization stage, main interface and function development stage, experiencing speed iteration development stage. Focus on the third phase of change and optimization.

The first stage: basic interaction and the main visual finalization phase

The product manager and the designer repeated the manuscript to finalize the main direction of the revision project: The three key words of interaction and master vision based on drawer interaction were personalization, youthfulness, flattening, and the new 90% Interaction design and visual design. This phase takes 1 month.

The second stage: the main interface and functional development stage

R & D team to participate in this project. During this phase, our team adopted agile iterative development, completing 85% of the new version of the subject interface and functionality in 3 iterations (2 weeks each for a total of 1.5 months). As this phase draws to a close, we realize that although the completion of the new version of cloud notes at this stage is high, we are far from satisfied with ourselves.

This is partly due to the fact that the remaining 15% of the interfaces and functions are not fulfilled, and the more important reason is the gap between design and experience. In other words, only when the engineer implemented the product as designed, did we find that the true experience of the original design was not exactly the same as we imagined. At this point, the conventional agile iteration is no longer suitable for solving the problems we face. Because one of the principles of conventional agile iteration is to "try not to modify the product design requirements during the iterative cycle," which requires a relatively stable product design. Therefore, we changed the working mode after the second stage and entered the third stage.

The third stage: speed-iteration for the experience of the development phase

This stage can be said that the revision of the most crucial part of the project. In this phase we no longer have a clear iteration cycle, but around a key impact on the user experience speed iteration. R & D team for a key day for iterative changes in the days; core user base (by product managers, designers, experienced users) the same day to install the latest installation package and in a real environment with their own real notes Account experience, to the R & D team put forward the key points of these feedback and further comments. For some key points that can not be judged, the R & D team will even hit multiple installation packages for the core user base for comparison. For example, focusing on the critical path of "improving homepage browsing efficiency", the core user group has put forward dozens of feedbacks on various dimensions such as load fluency, image sliding experience, image thumbnail visual experience, and note list segmentation experience. Correspondingly, the R & D team has iteratively developed nearly 20 versions, and finally reached the consensus with the core users at this critical point of experience. The third phase of this revision took 1.5 months.

This time there is a cloud note iPhone revision is a cloud note team is a self-learning, self-breakthrough process. Next, we will also apply the relevant experience and experience on other platforms. We hope that each step of our efforts will enable Yododian notes to become more in line with the habits of Chinese people and contribute to changing people's records. Also hope to take this opportunity to learn and discuss with industry peers.