ONLINE MEETING
This project is an iterative design of a video conference for Happy Ping An during my work at Ping An Technology.
Role： UX Designer
Duration: 30 Days
Tools: Axure; Sketch; Protopie
BACKGROUND
"Happy Ping An" is an office software which is developed by Ping An company. It currently provides daily office support to Ping An 300,000 people. Video conference is one of the important functions, providing online communication in order to release the stress of meeting rooms.
Because the PC version was developed earlier, the underlying technology and design are old. During the epidemic of COVID-19, the demand for online communication increased greatly. It needed iterative design.
CHALLENGE
Ping An meeting system includes offline meeting system such as polycom meeting room, meeting warehouse, online meeting system such as teleconferences, video conferences, and 100-person conferences. They belong different modules and their interactions are independence. We need to consider the similarities and differences between multiple parties and integrate existing functions;
The user data is incomplete and the demand is unknown. The business partner can't provide user feedback files;
Business partner want to increase the ability of 18 people to participate in the meeting to 300 people.
COMPETITIVE ANALYSIS
We experienced the mainstream office software and conference software in the market: Ding Talk, Lark, WeChat for enterprise, Tencent Meeting, WeLink, QQ, and analyzed competitive products from the scope, structure and framework；
Compare with Happy Ping An and get the conclusions:
• Conference mode: design two modes of voice call and meeting;
• Multiple views: design different views based on different meeting scenarios
• Screen sharing: Support screen and application sharing screen;
• Conference control: design conference control function in meeting mode;
• Toolbar: reorganize existing functions and new functions, and redesign the toolbar;
• Conference ID: Each conference has a ID, which is convenient for joining and sharing. It can also be combined with a personal conference number.
USABILITY TEST & INTERVIEW
Test script
First, in order to understand the use of video conference and to find out problems that encountered by users. I wrote a test script.
Usability test
Sample
To ensure the differences, I recruited 6 colleagues from different departments. They have different working models and habits.
Test Results
Overall
• The users can basically complete the task, and completion rate is about 91%;
• Tasks 1 and 2 are more difficult to users. Users usually give up because they can't complete the tasks, which can cause boredom.
Classification issues
In the test, we found 11 problems and classified them according to the classification criteria. It will help us prioritize requirements.
Test results (by task)
From the results, we can find out which task is more difficult to complete. We can know the user's evaluation of the difficulty of each task, and the reason for the scoring through the users' scoring.
Conclusion
Based on the results of tests and interviews, we gave some suggestions from the two aspects of interaction & vision and product functions.
JOURNEY MAP
Based on the results of the interviews and tests, I draw a user journey map.
PRIORITY
We mark the 22 requirements which are discovered in research according to P1-P22. Use Prioritization Grid to confirm the priority. We'll design high-priority requirements. And we'll design non-urgent and unimportant problems by selected.
DESIGNING PROCESS
Workflow
This iteration has modified the procedures for initiating single-person calls and multi-person video conferences, and added conference control procedures.
Interaction Design Details (part)
Mini Mode
The modification of the mini mode is focused on the unification with the APP function. We modified the Mini mode to support 1v1 calls only, and designed a lightweight call interface. Users can switch to conference mode by turning on the camera, expanding, and inviting members.
Multi-screen Mode
In order to adapt to the multi-screen mode and voice activated of Polycom conference equipment, we designed multi-screen mode. Its display rules are consistent with Polycom devices.
Presenter View
We have also made a comprehensive design of the speaker mode.
Change the floating window to an embedded list, and the list can be collapsed.
User List used both window and list to display. And two display modes can switch by a button. Users can easily control meeting through list mode.
Our design distinguishes between members in the meeting and those who have left. Resolved an issue where all meeting members were stacked in a list and could not be distinguished.
Toolbar
We integrated most of the functions into the toolbar, and classified them according to basic functions, common functions, and more functions.
• Basic functions include microphone, speaker, and camera which are used frequently;
• Common functions include functions that users often use in meetings such as inviting members, mute all members, and desktop sharing;
• In addition, we have developed many black technology functions, such as subtitles, conference recording, remote control, etc. We put these functions in more function. Users can experience them if they need.
User List
Depends on different scenario, we designed different user list:
• In the multi-screen mode, the list mode is displayed to facilitate conference control;
• In presenter view, the small window is displayed by default, and users can view other users' pictures. If you need conference control, you can switch to list mode.
UI Design
