Work Inquiries
yi.chen.designer@gmail.com
Ph: +1.585.406.2710
Product Design UI/UX
May 17, 2021

Clipt

Clipt allows you to seamlessly and safely send text, photos and data over the cloud using your clipboard. It’s as easy as copy on one device and paste on another.

Open Project
Task

Build a cross-platform app that helps OnePlus/Android smartphone users to transfer data like text, images and files freely between devices.

  • Strategy

    UX Strategy

  • Design

    Product Design, UI/UX Design

  • Company

    OnePlus

  • Tools

    After Effects, Figma

INTRODUCTION

Seamless clipboard.
Now available
for all.

From Android to Mac to Windows and iOS the app works across all devices to help streamline your multi device use and organise your clipboard.

branding

Young and fresh. Just for your productivity.

We brainstormed the name of our new product, and “Clipt” wins for its simplicity and uniqueness. Following our idea, I explored the symbol design for this product and had a final outcome. I designed graphics for the product by following in a linear, shaped style.

Ideation process

Logo

Typography

App Icons

Color Palette

Illustrations

Google Play Store promotional screenshots

Forum / Social media post covers

Email newsletter

Chrome extension onboarding pages

inspiration

The journey begins from OnePlus fans.

Last summer, OneLab had an online research session with a few Community members looking into a topic we called ‘content creators’, and during it we needed people to get something from their phone to a computer. One person emailed themselves, one used a messaging app to text themselves and another used a cloud service. This was unrelated to the testing but it did catch our attention…

Opportunities

Users are being punished if not in an ecosystem.

Many of OnePlus fans are young students and professionals. They complained about using a powerful Android smartphone like OnePlus 8 but cannot work seamlessly with their Macs. They are locked outside Apple’s ecosystem if not using an iPhone. Our aim is to break the boundary.

Target audience

Targeting who are busy with multiple devices.

“I often take photos of the sildes and send them to my laptop when organizing notes.”

“After we started remote learning, I scan my homework everyday and email myself to transfer them to my laptop.”

“I do most my work on the computer but often use my phone as a second screen to search for information I need. “

About

Age: 16-35
Gender: Both male and female
Location: NA, EU, IN
Profession: Students and young professionals
Device: Android phone, MacBook
Key characteristic: use multi devices for working & studying

Goals

Copy and paste text easily between device
Send files back and forth easily across devices
Ensure privacy and data security

Frustrations

The transfer process of current solutions is not easy enough and not intuitive.

Competitive Analysis

Make the best experience among major competitors.

I collected 3 major clipboard tweaks that allow users to send data between devices, and found that all of them have their unique points. We try to solve problems that these tools didn’t solve, so I did a detailed competitive analysis.

challenges

How did I deal with challenges and tradeoffs?

During the time we design the interaction part, we faced many design challenges. We helded several moderated user testing sessions and had several iterations after summarizing user feedbacks.

Possible places to put Clipt button.

One More Step

We need to teach users how to use it, because Android does not allow direct read to the system clipboard. We have to design one more step for user to manually send data to the cloud.

The developer suggested the quicksettings menu, and I suggested the notification bar.

Final Decision

We chose the notification bar, as users can easily slide down the notifications to see this button. I prepared a nice onboarding process for user to learn how to use it.

There are two reasons why we did’t do the quicksettings menu: Firstly, the onboarding is complicated to do, and we have limited time and resources. Secondly, the system settings can be different on different brands, so it’s difficult to make a general tutorial.

Option 1: Top dashboard

Option 2: Separate dashboard

Dashboard

We explored several ways to design a dashboard for users to manage devices they have. We want users to control all their devices with their smartphones, but it’s a paradox that each client has too much power to control other clients, and after user testing sessions we found user don’t need it much.

Final Decision

After discussion, I designed a slide-down menu for checking what devices the users have. They will not be able to control other clients on a certain client, and they have to manually disable their other clients if they want to. We concluded that the delete action or turn on/off action are not usual for most users, and this UI pattern works best for not interrupting normal use.

Different styles of buttons and signifiers

Toggles

We were struggling with toggles.
A cloud sync session contains copy to the cloud and grab from the cloud, so it can actually be separated by two toggles; A notification toggle is needed for proper user feedback.

Final Decision

After discussion, we decided to remove the sync toggle. I suggested that too many toggles can confuse users, especially first-timers. As a result, we simplified the process, and if users want to turn it off, they can simply quit the app by multitasking gestures.

research

Fast iteration driven by user feedback.

The team held many moderated user testing sessions before the product launch, and I helped designing tasks and observe user operations with the UX researcher. The iterations are mostly driven by our summarized feedbacks.

achievements

Users love it.
Big success upon launch.

Clipt gained great achievements after the community launch in May 2021. OnePlus users love it, and multiple Android-focused tech sites are reporting this product.

0+
active users after 1 week
0+
Average pieces of data
sent per user
0+
Media reports
0+
Rating on Google Play

Media Highlights

summary

Working as a full stack designer cultivates leadership.

Clipt is one of the biggest real projects I take part in. I work as a full stack designer doing not only product design and visual design, but also user research and business strategy. For me, it’s a very good opportunity to study from different jobs and think as a leader of a big project. I gained exclusive and precious experience at OnePlus.

If I get more working time at OnePlus, I may start building a design system to unify the UI experience for all platforms. Next time when I do a similar project, I would prioritize design system building as well as applying Heuristic Evaluation to our internal test process.

I would like to give credit to the following members in my team, as we learned from each other a lot during the 3 months R&D for Clipt:

Sam Twist, Product Manager
Tim Weng, Creative Technologist
Sharon Wang, UX Researcher
Jay Qian, Product Designer
…
And everyone who supports this product.

Back
Next Project
FUNKEY