Tencent practical case! Review of the design process of the QQ home-school group

A *** screwdriver can't unscrew the screws on the glasses frame. Like a *** screwdriver, QQ is also a universal communication tool. In vertical scenarios such as games, fans, and home and school, many user needs are not well met. Among them, the number of users and activity in the home and school group scenario are still in a stable growth, and the number of users is still far less than the number of home and school groups in the market, so there are considerable opportunities. So we hope to better serve this group of people to attract more users.

1. Why is it a homework scene?

In the home-school group, whether it is the previous low-frequency offline communication or the current high-frequency online communication, the content of communication mainly revolves around the synchronization of some school information and students' homework status.

Online communication tasks occur almost every day: users synchronize and submit tasks and synchronize task results within the group.

However, through user interviews, we found that homework, as a high-frequency communication scenario, still has some pain points for users. Therefore, we hope to solve these pain points of users and further explore the homework scenario to attract more teachers to use QQ home-school groups.

2. Industry Trends

As for homework, there are already many apps on the market, including excellent and popular apps like Yiqizuoye.com and Zuoyebox. Through analysis and interviews with users of these apps, we found that online homework is a trend in the future.

3. Design Goals

Online homework is already a trend in the industry, but QQ group users are more likely to synchronize and submit homework within the group, so we hope to reduce teachers' workload and improve efficiency through automatic grading while maintaining existing user habits, and then gradually cultivate their habit of assigning online homework. On the student side, we also hope to solve existing pain points while making them feel that doing homework is easier and more enjoyable.

4. Design Solution Exploration

Based on the above analysis, the home-school group project team worked together to conduct a series of design explorations and attempts on the QQ home-school group.

1. Easier to arrange and check assignments

There is already a "homework" application in the home-school group to help teachers assign homework, but the assignment process is too long and complicated, so many teachers cannot find it and do not use it. In response to this, we have simplified the assignment process and optimized the content of written homework.

On the parent and student side, in order to avoid messages washing away homework content and to more efficiently view all homework for the day, we have improved the entry for viewing homework and added new homework reminders.

2. Intelligent homework grading reduces teachers’ workload

Due to technical issues, we are unable to grade all types of homework. Therefore, we analyze the keywords of the homework assigned by existing teachers to obtain the types of homework that teachers often assign, and analyze the workload and benefits of teachers in specific question types.

Through analysis, we decided to try automatic grading of three types of homework: recitation, mental arithmetic, and dictation.

Online recitation, a new instant recitation experience

For teachers, the pain point of recitation homework is checking, and they need to listen to the recordings one by one to know the students' recitation status. For students, they need to cooperate with a third person to complete a recitation homework, or keep recording to achieve their ideal state, which is inefficient and boring. In order to improve efficiency, we moved all the recitation processes online to simplify the process.

During the online recitation process, students recite a sentence and the sentence is displayed, so that students can see where they have mispronounced. When they forget the next sentence, they can also actively get a prompt, restoring two common offline scenarios. At the same time, in order to make recitation easier, after the recitation is completed, the students are told the recitation results in a more relaxed way, and there is also a celebration animation when the recitation is completed.

Marking paper-based oral math problems

For homework such as math, teachers usually ask students to take photos of their homework and submit them, and then they can count and correct them. For oral arithmetic and other types of questions, the technology already supports recognizing and correcting oral arithmetic questions. Therefore, we maintain the habit of students taking photos to submit homework, and add the ability to count wrong questions, so that teachers can more easily explain the wrong questions to students.

After checking the correction results, the teacher can give feedback to the students. The design of the feedback page is also presented in a more interesting way to reduce the students' sense of pressure.

Dictation experience to help students review new words

The existing dictation method is the same as recitation, which requires a combination of offline and online methods to complete. It is also inconvenient for teachers to count the dictation of families. In addition, through research, we found that:

• The teacher will usually dictate the new words after forming them into words;
• The teacher hopes to examine students' mastery of pronunciation, writing, and stroke order through dictation;
• Home dictation requires the cooperation of parents to complete, and sometimes the completion of students' homework will be delayed due to parents' busy schedule.

To address the above issues, we moved dictation from offline to online to facilitate statistics on dictation, and made special arrangements for the above scenarios.

3. Visualization of job statistics

In addition to marking homework, teachers also want to know the overall completion status of the homework. The existing homework applications in QQ home-school groups already have a homework statistics function, but through interviews with teachers, we found that teachers mainly focus on the following when checking homework:

• Find out how many people have not submitted;
• The overall status of the work completed;
• Randomly check some students' homework.

However, the layout of the existing statistics page is different from what teachers focus on. At the same time, we found through data analysis that in 98% of cases, teachers only assign one homework that needs to be submitted online. Therefore, in order to allow teachers to check the status of each homework more efficiently, we have redesigned the teacher statistics page to make the information that teachers focus on more prominent and make it easier to spot check and comment on homework.

4. Visual Design

The visual design is also developed around the two design goals of efficiency and ease. How to reduce the pressure of teachers and students and improve the efficiency of teaching and learning is the goal that the QQ Home-School Group project team is constantly pursuing.

Content is king: immersive navigation and card-style content

Immersive navigation. In scenarios such as online homework in QQ home-school groups, the information content is quite complex, so we made the system navigation bar immersive, simplified the interface, reduced the levels, and effectively reduced the inter-layer relationship of the overall page. The navigation bar sinks and the main content floats up, so that the main content can be presented to the user in the cleanest logic, improving user efficiency and achieving the purpose of efficient information transmission.

Card-style: a reliable and versatile carrier. The content of online homework in QQ home-school groups is relatively complex, and it is difficult to control multiple media formats such as text, pictures, and videos when mixed. In addition, the content customized by students and teachers is generally not beautiful. The card-style design solves the above problems very well. As a container, the card is used as an independent content unit to carry the most important information on the page. It can integrate content in multiple formats. At the same time, the card is a carrier with very strong operability and scalability. It can be extended up and down, slid left and right, and popped up.

When QQ Home-School Group was designed, it insisted on reducing the impact and challenges of the product itself on users' work habits in offline scenarios in every aspect, and let the content itself become the direction to guide users.

Color matching: rich and traceable

Each subject has its own character and temperament. "Mathematics is a spirit, a rational spirit." Blue is also a representative of calmness and rationality in the color system. Language is the inheritance of Chinese culture, and red is the most representative color of Chinese culture. According to the attributes of color, each subject is given a unique color. We identify the colors that match the characteristics of the subject from the QQ color system - blue corresponds to mathematics, and red represents language. More importantly, the QQ parent-school group believes that teaching and learning should be rich and colorful.

Abandon quantitative scores and focus on emotions

One of the main purposes of education is to motivate the educated to continuously pursue progress. QQ Home School Group believes that every student is excellent and there is no distinction between them. Therefore, QQ Home School Group weakens the naked score system in school education. Instead of using scores directly, it uses color gradients to express the scoring stages. At the same time, QQ Big Yellow Face, as QQ's unique IP image, is also used in the design. This is because emoticons can carry more information than words, and can also convey complex emotions that are difficult to express in words to users. At the same time, we have also changed the rough expression of ordinary copywriting in the past and injected emotions, hoping that students can feel the warm encouragement poured into it when they see the results of homework review.

Tell a story with texture

We also use representative and storytelling textures of each subject to express the special temperament of each subject. The foundation of language education is not only how to learn to use Chinese characters, but also to guide students to feel the beauty of Chinese characters. Chinese characters are pictographic characters, which are based on pictograms. They use shapes to express meanings and convey emotions. Shape, meaning, and emotions are all integrated into one square. For example, the character "旦", "从日见一上", literally means "the sun rises on the horizon", which is the unique expressive ability of Chinese characters. Therefore, Chinese characters are disassembled, reconstructed, and re-expressed to become a symbol of language education. Mathematics uses the "impossible triangle" as the basic figure for repeated interpretation, and physics uses Newton's apple, which shows the special temperament of each subject.

5. A little outlook: Providing more beautiful and better educational products to young people

Although the design ideas of the home-school group project team have not been fully released, they have been well received by grayscale users during the grayscale period. From a design perspective, in the current situation of lack of aesthetic education, young people's understanding of aesthetics mostly comes from the books, tools, packaging, etc. that they come into contact with in their lives and studies. As an Internet education product, QQ Home-School Group hopes to take on the responsibility of aesthetic education for young people. Our design is likely to affect the next generation's understanding of aesthetics, and our design is likely to subtly influence the establishment of young people's own aesthetic system. Real education is not just about teaching knowledge, but also about cultivating students' aesthetic sense, inspiring the truth, goodness, beauty, and joy deep in their hearts, so that these pure emotions can nourish their lives.