top of page

 China Mobile HK x WorkMate 

MateCall

WorkMate Internal Corporate Communication

Individual Work Project // B2B // Web Design // Interaction Design // Figma

Project Background

MateCall is a multi-person communication tool in WorkMate Mobile for corporate employees to conduct online meetings between Mainland and Hong Kong with multi-party voice calls.

The project aimed to design an app that fits seamlessly into WorkMate mobile, improving the multi-party meeting function for smoother communication and easier work.

Mobile Interface
User Persona
Design Keywords

Click to view in detail

Branding

Text colors

Primary colors

Secondary colors

Typography
Home Page

Coupons

If users want to initiate a direct call, they can click on the dial pad hover button on the right to access the dial pad page

Users tap on the internal icon bar to switch in between features

My Plans

Call Settings

Contacts

Group Call

Expired Plans

My Plans

Users can view their package information, including remaining hours and expiration date, in “My Packages" or on the dialing page for easy access

Contacts

They can also search for departments and colleagues' names or contact information using the search function or the “Organization Structure”.

Users can view their package information, including remaining hours and expiration date, in “My Packages" or on the dialing page for easy access

Organization Tree

Search

Group Call

After clicking the dial pad or "Conference Call" entrance, select the person to be called from "Contacts" or "Organization Structure" or manually enter the number to call. Ensure that each number has the correct area code or international code before initiating the conference call. The user can also initiate the conference call again through the call record details page.

Group Call Screens

Incoming group call

Removing callee

Group call initiating

Adding callee 

Backend Management System

MateCall requires a backend management system with features such as tenant management, package subscription and assignment, redemption code generation, virtual number assignment, and binding to ensure normal use of call packages by users under each tenant.

Components

Designers benefit from high-frequency component reuse, improving efficiency and communication with product managers and better meeting user needs. Developers benefit from reduced costs, faster testing, and quicker launches. Users benefit from consistent experience through components.

Create New Order
Assign Group Plan
Manage Call Plans
View Backend Logs
View Plan Code Redemption
bottom of page