EnSpire Webcam Software

Building a webcam app from the ground up to enhance the hybrid experience for remote workers.

ROLE
  • Product Designer, leading end to end project
  • Conducted 3 rounds of usability testing to refine the user experience.
  • Redesigned the UI and revamped the information architecture (IA).

COMPANY

TOOL

Figma, Miro, Google Sheet

IMPACTS

  • Increased the System Usability Scale (SUS) score by 23%, from 65 to 80.
  • Improved hardware and software integration for a seamless user experience.
  • Reduced communication friction for remote workers, improving overall meeting efficiency.

TEAM

1 Product Manager, 2 Product Designers, 3 Engineers

DURATION

12 months
CONTEXT

Rising Demand for Virtual Meetings during the Pandemic

The COVID-19 pandemic increased the need for remote meetings. As companies shifted to work-from-home models to minimize contact, the demand for virtual conferences surged. With more people working remotely, the need for video conferencing solutions became critical for maintaining team collaboration and communication.
PROBLEM

Challenges in Remote Communication

The shift to remote meetings has posed communication challenges for many remote workers, especially those whose work involves use of gestures or physical objects during meetings. These individuals encounter the following difficulties:

Trouble Explaining Ideas

Designers struggle to convey concepts in remote meetings, especially when using gestures or physical prototypes, making it harder for teams to fully grasp their ideas.

Lack of Instant Feedback

Remote workers often juggle multiple tools, delaying real-time feedback and disrupting smooth communication during meetings.

Extra Preparation

Converting physical documents to digital formats for remote meetings adds extra prep time and risks losing important details, making the process more tedious.
SOLUTION

A Versatile Webcam Software for Hybrid Meetings

I designed the EnSpire webcam software with camera customization, annotation toolkit, and multi-window support to empower remote workers in hybrid meetings.

Camera Customization

Tailor the webcam settings to meet user's specific needs, adjusting aspects such as brightness, contrast, saturation, and white balance for optimal video quality.

Annotation Toolkit

Enhance presentations or discussions by annotating directly on the screen, allowing for dynamic highlighting, drawing, or text additions to user live video feed.

Multi-window Support

Simultaneously view multiple video feeds or content sources in separate windows, enabling efficient multitasking and collaboration during video conferences or live streams.
DESIGN PROCESS
DISCOVER

How Do People Work in Hybrid Meetings?

Remote workers face challenges like difficulty explaining ideas, lack of real-time feedback, and increased prep time. To better understand user needs, we designed a comprehensive testing approach.

Planning Usability Testing

We conducted three phases of product and usability testing: working samples, Engineering Validation, and Design Validation. Each test followed the same process—explaining the test purpose, running usability tests, conducting a 30-minute interview, and completing the System Usability Scale (SUS) questionnaire.

We focused on three stages of a typical video conference: pre-meeting setup, in-meeting discussions, and post-meeting notes. Users completed five tasks, assessing both the product’s and their own performance.

Recruiting Participants

I tested with 11 internal employees—4 mechanical engineers, 1 UX designer, 2 prototype engineers, 4 industrial designers, and 2 marketing specialists—representing both advanced and novice webcam users. Advanced users handled complex tasks like sharing sketches and product models, while novice users focused on online collaboration tools.

Building Web-Based Prototype

The initial EnSpire prototype included three core components: a control bar, main functions (screen recording, freezing, zoom), and secondary functions, offering users essential tools for hybrid meetings.
Also, there is a "Settings" function located in the bottom left corner of the screen which allows users to adjust more advanced options, such as signal sources and resolutions.
TESTING RESULT

Product is Usable, but there is Room for Improvement

In the process of usability testing, we observed and recorded user behavior, documenting findings on Google Sheets. While most users could complete tasks, they encountered three major usability issues:

Confusing Advanced Settings

Users struggled to find the image adjustment function, and even when they did, it didn’t work as expected. This made the advanced settings difficult to use.

Insufficient Feedback and Guidance

Some users had trouble understanding certain interface features, like adjusting the focal length or accessing advanced settings. They felt that relying only on icons didn't effectively communicate the intended functions. Providing clearer explanations could improve their understanding of how to use these features.

Need for Additional Features

While industrial designers and mechanical engineers find the current EnSpire functions adequate for their hybrid meetings, they would benefit from more advanced capabilities. Suggestions include adding features like text boxes, circles, and arrows to the annotation toolkit for enhanced functionality.4o mini
IDEATION

Exploring Potential Design Solutions

After pinpointing the usability challenges with the product, I conducted competitive analysis of over ten webcam control and video conferencing software options. This analysis helped inform our feature planning and iterative development for EnSpire, in collaboration with the product manager.

Conducting Competitive Analysis

I conducted product analysis for more than 10 webcam control softwares and video conferencing softwares, exploring potential design and feature planning.

Redesigning Information Architecture

Through the analysis of competing products, I gained a better understanding of how most existing products categorize their features. Subsequently, I restructured the information architecture with a focus on "Setting" feature.

Deciding Layout Options

During usability testing, advanced webcam users mentioned their habit of opening multiple windows. As a response, I designed several different styles of multi-window layouts and annotations.
Additionally, I went a step further in planning the functionality of the user interface for different window sizes. When users minimize the screen, I hide certain features.

Redefining the Core Value of EnSpire

During the process of product iteration, we introduced some new features such as multi-window support and annotation tools, leading to changes in the product's core functionality. Through brainstorming sessions, we redefined the core functionalities of EnSpire.
We identified and defined the following three core functions of EnSpire:
RESULT

Where did we end up?

After completing three rounds of usability testing and making necessary iterations, I improved the software's System Usability Scale (SUS) score by 23%, raising it from 65 to 80. Here are some key features of the EnSpire Minimum Viable Product (MVP):

Image Adjustment

Initially, the settings included options for source, resolution, and white balance, but users struggled to find what they needed during testing. In response, I reorganized the interface to categorize settings into three clear sections: source, image, and capture.

Annotation Toolkit

Users found the annotation feature easy to use during testing, but many requested additional options, such as text boxes, to enhance note-taking during meetings.

Multi-Window Support

Interviews revealed that users often needed to navigate multiple screens during remote meetings. To address this, I designed features like split-screen and picture-in-picture (PIP) views to better meet user needs.
LEARNING

Navigating the Entire Product Design Journey

Participating in the project to build the product from the ground up was an amazing experience, and it provided me with invaluable learning opportunities.

Insights from User Interactions

Observing user interactions is crucial for effective design. Users often behave differently than expected, and understanding these behaviors helps create products that genuinely meet their needs, leading to a seamless user experience.

Finding the Balance Between Simplicity and Complexity

While "keeping it simple" is a key principle, it doesn't always apply. Initially, I grouped all setting functionalities together to simplify the interface, but usability tests showed that users found it confusing. This experience highlighted the importance of balancing simplicity with the diverse needs of users.

Integrating Hardware and Software

Designing the EnSpire software emphasized the importance of integrating hardware and software. Previously, I focused only on software design, but I now recognize the need to consider both user-friendly interfaces and the capabilities of the hardware. This integration results in a more cohesive and efficient user experience.