Amber Beverage and Plant Shadow Still Life
Amber Beverage and Plant Shadow Still Life
Amber Beverage and Plant Shadow Still Life

Challenge

The inline controller needed to support multiple functions: media control, calls, volume adjustment, and EQ switching, using only three physical buttons. The design had to remain compact and ergonomic, avoid accidental activation, and provide immediate feedback despite the absence of a screen.

Challenge

The inline controller needed to support multiple functions: media control, calls, volume adjustment, and EQ switching, using only three physical buttons. The design had to remain compact and ergonomic, avoid accidental activation, and provide immediate feedback despite the absence of a screen.

Insight

In screenless hardware interfaces, clarity comes from timing, tactility, and feedback rather than visual cues. Advanced features like EQ switching must be discoverable yet intentionally gated, so they do not interfere with high-frequency actions such as volume or playback control.

Solution

Button Interaction System

The three-button controller is designed as a layered interaction system rather than a set of isolated actions. High-frequency actions are prioritized through short presses, while low-frequency, high-impact features such as EQ switching are gated behind deliberate long-press gestures.

Design Ops: Hardware UX Design System

When I joined the team, HARMAN was in the process of standardizing hardware interaction design systems within Figma. Through this project, I contributed to refining and extending that system by clarifying interaction definitions, press-timing rules, state transitions, and feedback mappings for physical controls. I also built reusable Figma components to translate these rules into executable design artifacts and accelerate iteration.

Because there is no widely adopted industry-standard template for hardware interaction design systems, this work required exploration and continuous iteration. The resulting improvements increased clarity and reusability, aligning design, firmware, and QA around a shared interaction language while informing future hardware development.

Sample Component
Sample UI Specification

JBL Tune 310C

JBL TUNE 310C is a wired USB-C earphone designed to deliver intuitive media control and on-device sound customization through a compact three-button remote. Without relying on an app, users can switch between EQ presets: Default, Bass, and Vocal, while retaining familiar playback, volume, and call controls.

Year

2024

Year

2024

Client

JBL

Client

JBL

Team

Joe Deng, Sam Liu

Team

Joe Deng, Sam Liu

Timeline

2 weeks

Timeline

2 weeks

JBL Tune 310C

JBL TUNE 310C is a wired USB-C earphone designed to deliver intuitive media control and on-device sound customization through a compact three-button remote. Without relying on an app, users can switch between EQ presets: Default, Bass, and Vocal, while retaining familiar playback, volume, and call controls.

Year

2024

Client

JBL

Team

Joe Deng, Sam Liu

Timeline

2 weeks