top of page
fba5758260032e7affde95958f06a2c4.jpeg

A Flagship Launch with Smart Complexity

Smart Premium Oven from Media 

​美的旗舰智能烤箱UX/UI设计

Launched during China’s 2021 Singles’ Day shopping festival with a retail price of around €1000, this flagship oven combined multiple cooking modes—baking, steaming, microwaving, and air frying—into one smart device with Wi-Fi connectivity. As the UX/UI design director, I was responsible for crafting a systematic, self-explanatory interface that enhances usability and communicates the product’s premium positioning through both form and function.

作为品牌旗舰级智能烤箱,这款产品于 2021 年在“双十一”电商节期间正式上线,定价约为 1000 欧元,集合了烘焙、蒸汽、微波、空气炸等多种烹饪功能,并支持 Wi-Fi 联网,具备完整的智能家居属性。我带领的团队的任务是为其构建一套系统化、可自解释的用户界面,提升使用便捷性与产品感知价值。

Journey Mapping and Information Architecture

用户流程梳理与信息架构搭建

Unlike touchscreen-only mobile apps, this oven featured a hybrid interface composed of a TFT display, physical buttons, and a rotary knob. To design an intuitive experience, I first mapped user journeys based on real usage scenarios, aligning each step with the oven’s functional logic. By analyzing and comparing task flows across all cooking modes, I defined a clear visual hierarchy and interaction model, ensuring users could easily navigate and control the appliance with minimal learning.

与手机 App 不同,烤箱的操作界面由触摸屏、物理按键和旋钮共同构成,部分情况下还支持与手机同步。因此,设计初期的关键是梳理用户在实际使用中的操作路径,并将其与设备的功能一一对应。通过并列对比不同功能的操作流程,我们得以明确主次页面的层级逻辑,同时也优化了旋钮与按键的数量与分布,使整体交互更符合用户直觉。

Bildschirmfoto 2022-07-20 um 10.59.13.png
Bildschirmfoto 2025-07-25 um 22.24.13.png

Hardware-Synced Interaction: The Arc Dial

屏幕与旋钮联动的交互体验

One of the signature interaction elements is the dynamic arc on the right side of the screen, which forms a concentric relationship with the physical rotary knob positioned just outside the display. As users rotate the knob to adjust parameters, the on-screen arc animates in real-time to reflect those changes. This creates a tactile, synchronized feedback loop between hardware and interface—elevating the precision, responsiveness, and overall satisfaction of the interaction.

烤箱的 UI 设计采用了独特的圆弧式界面元素,其设计灵感源于屏幕右侧的实体旋钮。屏幕上的圆弧与旋钮的旋转路径形成同心圆关系,用户在旋转旋钮时,圆弧随之产生动态响应变化,直观地反映操作的数值变更。
这种软硬件协同的交互方式,不仅增强了用户对操作结果的即时感知,还提升了产品的整体质感和专业度,使人机交互过程更加自然、流畅且富有触感反馈。

wireframe workflow.png
Screenshot family.png
architecture.jpg

Visual language

视觉语言

Visual guides function

This oven offers a wide range of functions, each enabling different cooking outcomes. While traditional Western ovens typically use icons to distinguish programs, user interviews revealed that many users do not fully understand the meaning behind these abstract symbols. To address this, we replaced icons with rendered images that visually illustrate each heating method, accompanied by clear text labels to help users quickly grasp and select the appropriate function.

视觉引导功能

这款烤箱功能繁多,不同程序可实现多样的烹饪效果。传统西式烤箱多使用图标区分程序,但从用户访谈中我们发现,许多用户并不理解这些抽象图标所代表的实际意义。为此,我们在设计中用渲染图片代替抽象图标,通过直观图像展示加热方式,并搭配简洁文字说明,帮助用户更快速地理解并选择所需功能。

Icon System 

While rendered images serve as the primary interface, icons remain essential in certain contexts—especially for this flagship model, which offers significantly more functions than others in the same series. We designed an expanded icon library tailored to this model, adhering strictly to the brand’s visual language. Both pixel-optimized versions for screen display and print-ready versions for manuals and packaging were developed to ensure clarity and consistency across all touchpoints.

图标体系
Color and Contrast

To guarantee optimal readability across usage scenarios, we conducted multiple rounds of usability testing focused on color contrast and text clarity. These tests simulated various conditions, including strong lighting, smudged screens, and reduced vision in certain users group. The findings directly informed our decisions on primary interface colors and button state indications, ensuring users of all ages and environments can clearly perceive on-screen information.

色彩与可读性测试

为了确保所有界面元素在各种使用环境下都具备良好的可读性,我们对色彩搭配和文本对比度进行了多轮可用性测试,涵盖强光、油污屏幕及视觉感知等特殊使用场景。这些测试结果直接影响了界面主色调和按钮状态色的最终选择,确保无论用户年龄或环境条件如何,界面信息都能被准确感知。
 

Animated Prototypes with Audio Feedback

动效与声音

Explore More Cases

更多案例
Female hand holding iPhone 14 Pro mockup (Mockuuups Studio).png

MyZEISS vision

UX/UI Design

Cover.png

Chat component

UX/UI Design

c6d2d610797f9b43c2500fcac0e9a385.jpg

SIEMENS dish care

Industrial design

bottom of page