Experience Revamp of the Creative Board

UX/UI Design · Digital Whiteboard

Company

Optoma

My Deliverables

End-to-end UX/UI Design, Research, Analysis, Design Systems, User-Testing

Platform

Interaction Flat Panel Display (Android app), Responsive website

Timeline

Jul 2020 - Aug 2022, launched in Europe

Tools

Figma, Adobe XD, Zeplin, Illustrator, Photoshop

Team

Renee: Lead Product Designer for Creative Board
Winnie: Product Designer
Ariel: Product Manager

And of course Dev, QA, and all of the Product & Design Team

Introduction

Creative Board is a built-in annotation tool on the Opotma interactive flat panel display. Over time, with remote teams on the rise and its user base evolving, the existing experience couldn't handle the emerging use cases. In 2020, we set out to revamp the product to build a flexible collaboration platform that works equally well for everyone.

Outcome

As a result, the new collaboration experience was very positive in many ways, both in terms of critical business metrics and user engagement. Users have also given positive feedback on ISE 2023.
We saw a higher amount of engagement, more ideas, more visitors, and more collaborative interaction among users who came to our platform. Based on these numbers, our users have become more engaged and happier with their online collaboration experiences on Creative Board.

Learning & Takeaway

My first time designing and leading a large-scope project for a B2B product was an exciting journey. It was a pretty intensive period that all members in the team was working so hard for launching the product, we delivered a lot of good stuff and also struggled sometimes. I've learned a lot throughout this process, thanks to the amazing team!
System thinking
This project helped me broaden my thinking to be more micro-macro balanced and built a stronger connections with the team.

Decision making
How to find the balance among time, resources, constraints, and goal is really important, I learned that prioritization is very crucial for the team to speed up and focus on the right thing to do.

Work as a team
Everyone in the team should clearly understand the goal, plan, and problem to build a more meaningful product as a team.

Problem

While it is easy enough for people to collaborate in front of the large touch screen in the office. However, with digital co-workers growing, more workers say communication and collaboration from different places is a huge struggle.

Breaking down the problem

With the team members located in different places, follow-up action items are unclear and project tracking across multiple platforms is inconvenient.

It is not easy to view the presenting material across platforms with colleagues from different screens.

It is inconvenient for employees to view the document or resource across multiple platforms. (e.g. email, online message…etc.).

Defining the problem

Goal

Revamp existing experience to create a seamless collaboration platform that brings the team together to share ideas and stay connected anytime, anywhere.

Setting up criteria

Research & Ideation

01 COMPETITIVE ANALYSIS

Before starting designing, I decided to dive deep into existing competitor behaviors and features to better understand user needs.

02 Principles

I tickle out important items from my research and kept this key principle in my mind when designing. These principles helped me align and make design decisions more reasonably.

Key principles when designing

03 Challenges & Constraints

Then I start sketching the flow and find some conflict situations when designing for multi-users.

Conflicts in multi-user situations

04 User journey

To streamline user authority and entrance to the platform, I start sketching the flow for this crucial part with invites & join the online session flow. And wireframe the structure with this main flow.

Invite & Join online session flow

05 Visual style

My goal is to transform the image of sharp, cold technology into one of clean, elegant, and approachable design. Designing an interface that is minimal and simple to facilitate collaboration.

Final Design

DESIGN GOAL: simple

A clear primary navigation options

USER SCENARIO

Workers who schedule and participant the meetings everyday, have to setup meeting environment quickly. Finding what you need can take a lot of time and effort.

SOLUTION

With a clear hierarchy listing the sessions and an instant template, workers can quickly find the needed information and document.

DESIGN GOAL: Accessible

Join an online session with an ease

USER SCENARIO

Participants who don’t have an organization account want to use another way to access their online session.

SOLUTION

A quick way to join as guest, with simple type in session code and username to join.

DESIGN GOAL: Coherent

Infinite workspace to collaborate

USER SCENARIO

Real-time collaboration consists of powerful controls to bring teams and ideas together. But due to the high volume of attendees, it’s frustrating and limited when run out the space during the session.

SOLUTION

With an infinity canvas and the ability to add more workspace pages, attendees can interactively expand their ideas.

DESIGN GOAL: Simple

Simple, clear list for access control

USER SCENARIO

It's important for the host to be able to take quick actions and controlling a large number of attendee at the list itself.

SOLUTION

Separate invited attendee with collapse list and inline actions help host find and take action from the list itself.

DESIGN GOAL: Simple

Rich, easy to use white-boarding tool

USER SCENARIO

Workers have to express ideas immediately in a short time to instant share thoughts. Drawing and sketching ideas each time takes a lot of time and effort. Sometimes the results didn’t come out ideally.

SOLUTION

Instant shape and text tool help workers to share ideas correctly and immediately.

DESIGN GOAL: Accessible

Direct doc & browser all materials access

USER SCENARIO

It’s difficult to collect and combine all discussing materials from everyone and sharing the screen from different devices simultaneously can be hard.

SOLUTION

We Integrate with tools that employees already use featuring a share screen simultaneously, bringing a powerful platform and making communication more transparent and efficient.

Next steps

As a result of the launch of the rich design across the Optoma cloud platform, we have been able to unblock more ideas we'd like to build and test, and the foundation for our product has become stronger. We kept working on optimizing the end-to-end user flow, conducting user research to better understand our users and building more powerful features that make hybrid working more efficient.

user testing

45-min tests x 8 (small interview + usability testing) with real users
  • To validate user personas.
  • Validating the design decisions with real user feedback.

meeting stakeholders

1.5h meeting
  • Validate project criteria and goals by mapping stakeholders' problems and needs.
  • To review the current design and feedback.

Iteration

Design iteration based on users’ and stakeholders’ feedback.

keep improving

Continuing to follow our product roadmap and adhering to our design principles.
Due to NDA, I’m not able to share more details here.
If you're interested in the projects I worked on for Creative Board, 
let's get in touch  → 

More to explore...