Lark Email Client

Shipped project. UX & UI Design for Lark Email, a SaaS product in both mobile & desktop environment. Available on App Store.

Context

Email in Lark Office Suite

In 2019, we designed the email product in Lark office suite from 0 to 1.
Based on our research data, we defined email collaboration as our main product strategy and competitive feature which differentiates our email product from other email clients.

Lark Office Suite
Lark is an office suite that includes instant messaging, Docs, Calendar, and much more.

Email in Lark Office Suite
To meet users' needs and business needs, we conceptualized Lark Email and designed it from scratch.

Target Users
Use Lark for internal communication while use email for external communication.

Available on App Store.

Introduction

The goal of this project is to provide users a seamless way to share, discuss and co-edit email in the Lark Email client. I worked as the product designer and I am the co-owner of the feature sets.

User Need
A seamless way to share, discuss and co-edit email.

Business Need
Competitive feature for Lark Email to acquire customers.

Results
High NPS score, well received by internal stakeholders and users; acquired new customers.

Contribution
Product Designer, Project co-owner

Design Direction

Seamless Experience to Share, Discuss and Co-edit Emails

We brainstormed ideas, prioritized concepts, and decided to provide users a seamless way to share their email thread, discuss and co-edit email within the Lark Email tab. We wanted to provide a holistic solution that provides good user experience for all three user groups.

Design Challenge

What Collaborators Can do? Collaboration vs Privacy?

We invited target users to our design workshops, and discussed with them about what they expect in email collaboration. Based on the workshop insights, we conceptualized the permission control system as showing below.

How to Share Email Threads?

With the permission control in our mind, we designed an MVP version of Lark Email. We released it to selected target users and collected data and user feedback during a period of time. Overall, users appreciate this feature and the permission control. However, we got some new findings.

Allow Collaborators to Share Emails
For most of the cases, users would like to allow collaborators to share emails, but with their approval.
Reason: Collaborators always ask owners to add a collaborator. They need to find the specific email and  person to share. It is not convenient, especially when they are busy.

Share Emails to Lark Chat
In some cases, users would like to send email to Lark chat while sharing the emails with a collaborator/group.
Reason: When users talk about relevant events, they would like to share this email in the discussion context, so that they can continue the discussion.

Other Feedback
- Users wish to view all shared threads in a place.
- Users wish to easily recognize a shared thread in the message list.
- Users wish to control whether or not to share with external Lark users.

Design Solution

Share Email Thread

This is the very first step of email collaboration and we were very cautious about the permission control. With the user feedback in our MVP version (allow collaborators to share, share emails to Lark chat, added Shared Emails label, etc..), we redesigned the email sharing flow.

Discussion within Email

After an email thread has been shared, collaborators can discuss emails in the side panel. We hosted A/B tests on side panel discussion and in-email discussion with comment style and found that our users appreciate side panel discussion more than in-email discussion, also by integrating Lark chat components in Email discussion we are saving development time.

Co-edit Email Drafts

When it comes to co-edit email drafts, in order to protect owners' privacy while fostering collaboration, we adapted the permission control of viewing messages, co-editing drafts and sending out messages based on users' feedback from our MVP design.

Owner - Jane
Owners can do anything, especially have privilege in sending out and deleting drafts.

Editor - William
Editors can initiate drafts, co-edit drafts, but can not add recipients or send out the message.

Viewer - Sean
Viewers can view email messages and drafts, but can not edit drafts. They can request edit permission, as needed.

Design System

Platform Consistency

During this process, we developed the Lark Email design system. We defined the color palette, typography and UI styles in the early stage to ensure design consistency within Lark. There are some specific components that we need to develop for email products, e.g. the attachments, and the thread layout for different states.

Measure the Success

Impact

The public beta release was well received by our users, and we measured the success of both the user side and the business side.

Share flow
After A/B testing, the new design brought a double-digit DAU increase.

Discuss & co-edit flow
In 78% of the shared email threads, users used discussion panel.
‍In 39% of the shared emails, more than 51% of users edit drafts.

Overall
Well received by users and stakeholders.
‍A selling point for Lark Email and helped acquire new customers.

Self Evaluation

As a Product Designer, first I tried to understand the product as much as possible:

1. Why people need email collaboration;

2. What features users need most for collaboration;

3. How can we integrate the new features into the current design seamlessly.

Then with these questions in my mind, along with several rounds of user studies, I was always designing with intention, finally I was able to deliver the email collaboration features which were well received by internal stakeholders and our target users.

"Ethan did a really great job in problem framing and solving users’ pain points with his experience design skills.

Senior Designer • Microsoft

Junying Chang

"Ethan did a really great job in problem framing and solving users’ pain points with his experience design skills.

Senior Designer • Microsoft

Junying Chang

"Ethan did a really great job in problem framing and solving users’ pain points with his experience design skills.

Senior Designer • Microsoft

Junying Chang