Guanfang Chen





DREAME Z40增强版 LCD UI设计
LCD UI Design01/05/2025

在 Z40 增强版的机器 UI 优化项目中,主要负责统筹设计策略制定与落地执行。该项目的核心设计原则是延续 Z 系列一脉相承的视觉基因 —— 包括家族化的界面布局逻辑、标志性的交互动效语言及用户熟悉的功能模块架构,以此保障系列产品在用户认知层面的连贯性与辨识度。

由于设备搭载了全新的 BOE LCD 屏幕,我们重点针对屏幕特性展开了系统性分析:对比原屏幕,BOE LCD 在色域覆盖范围、色彩饱和度表现及明暗对比度等维度存在差异,可能导致原有 UI 设计在新屏幕上出现色彩偏色、视觉层次弱化等问题。基于此,我们从用户视觉体验出发,进行了多维度优化:一方面对界面基础色彩体系进行参数调校,通过调整主色调的明度曲线、优化辅助色的饱和度占比,确保核心视觉元素在新屏幕上的呈现效果与 Z 系列设计初衷一致。

另一方面针对高频交互场景(如图标显示、文字阅读、图片预览等),细化了元素的色彩适配规则,例如增强图标边缘的色彩对比度以提升识别度,优化文字与背景的色差值以保障可读性,最终在延续系列设计精髓的同时,让 UI 在新硬件载体上实现了更精准、更舒适的视觉表达。

In the UI optimization project for the Z40 Enhanced Edition, I was primarily responsible for overseeing the formulation and implementation of design strategies. The core design principle of this project was to carry forward the consistent visual DNA of the Z series—including the family-style interface layout logic, signature interactive animation language, and user-familiar functional module structure—thereby ensuring the coherence and recognition of the product series in terms of user perception.

Meanwhile, as the device was equipped with an all-new BOE LCD screen, we focused on conducting a systematic analysis of the screen's characteristics. Compared with the original screen, the BOE LCD exhibits differences in aspects such as color gamut coverage, color saturation performance, and light-dark contrast ratio, which might cause issues like color cast and weakened visual hierarchy in the original UI design when displayed on the new screen.

Based on this, we carried out multi-dimensional optimizations starting from the user's visual experience. On one hand, we adjusted the parameters of the basic color system of the interface: by modifying the lightness curve of the main color and optimizing the saturation proportion of auxiliary colors, we ensured that the presentation effect of core visual elements on the new screen remained consistent with the original design intention of the Z series. On the other hand, targeting high-frequency interaction scenarios (such as icon display, text reading, and image preview), we refined the color adaptation rules for elements. For example, we enhanced the color contrast at the edges of icons to improve recognition, and optimized the color difference between text and background to ensure readability. Ultimately, while preserving the essence of the series' design, the UI achieved a more accurate and comfortable visual expression on the new hardware carrier.


*     UI Design


©GUANFANGDesigner\Art  CreatorPhone: +86 156 8037 3903 / email:  chenguanfang0721@163.com