top of page

项目概况

公司               小米
部门               可穿戴团队
实习时长        2021年5至9月
项目时长        1.5个月

软件工具     Figma / Photoshop / Illustrator / After Effect
设计技能    用户调研、用户体验、层级设计、视觉设计、原型图、高保真、动效设计

IF-Product-Design-Award-Logo.svg.png

智能手表
用户体验设计

红点 & IF 获奖作品

关于

在小米实习期间,我主要负责小米 S1 Pro 智能手表在用户体验上的升级优化。通过分析用户画像,日常需求,竞品调研,A/B测试等方法,深挖用户使用场景,与产品经理配合完善UX/UI设计方案。

在2021年,小米的智能手表出货量达到了2700万台,全球市场份额为15%,仅次于苹果。我们的手表系列还获得了众多知名奖项,包括iF设计奖、红点设计奖等。

ezgif-7-a68149f141.gif

项目一   健康App设计

​我的主要任务之一是升级手表上搭载的健康App系列。我参与修改的App包括心率、压力水平、呼吸、和女性健康。为此,我打造了几条设计宗旨,使页面更和谐美观且容易捕捉关键信息要素。设计旨在利用手表的表冠,创造动态互动体验。有效使用圆形表盘,创建有机且视觉吸引的界面。信息按清晰的层次结构排列,减少理解成本。

重塑页面规则

为了与小米的圆形表盘对齐,我率先提出应该引入中心对称的界面。优化了屏幕空间,标准化了卡片格式,并精炼了视觉细节以提高清晰度。此前,小米手表一直模仿苹果做页面文字左对齐的设计,但这与硬件本身的圆形表盘相悖。在我的建议下,后期小米圆形手表均采取了规范的居中对齐页面设计。

watchcover-1.png

​设计案例  女性健康App

 

这款App的升级标志着小米完成了在手表领域里真正意义上的原创设计摆脱了过往采取的对标苹果和华为手表设计的保守思路。新的设计方案巧妙融合了用户需求、软件功能性、和硬件局限性。

此前,小米和华为手表端的经期日历都是静止的,用户只能看到以平铺日历形式呈现的的周期信息,不能进行任何动态交互。苹果的侧重点在于记录当日经期,而不是查看之后一段时间的经期预测。大部分智能手表并没有重视这项功能,但其实这款功能对女性用户很重要,经期预测将影响到她们的出行、运动、手术、用药、或者备孕计划。

Frame 227.png
重新定义用户需求

我首先对用户进行剖析,我们的用户是15至45岁的女性。她们需要预测经期用于以下领域:日常生活安排、出行准备、运动计划、手术计划、用药、备孕、健康检测等。她们通常需要未来30-60天的经期预测。

层级逻辑

我们对层级关系进行了简化,仅用滑动屏幕和转动表冠,便于用户理解功能之间的跳转。

用户体验设计

为了解决融合日历和易于交互这个问题,我将经期日历设计成一个圆形周期视图,用户可以通过旋转表冠查看未来30天的经期预测。

period app ui draft.png

代表日期的定位豆会随着表冠的转动而顺时针滑动,屏幕中央的预测信息也会随之改变。这样在同一个页面内,用户通过转动表冠就能获取比原本更丰富更需要的信息。

UI 设计

我们保留了以前版本的日历颜色系统,并为每种类型的日期指定了特定的颜色。当用户旋转表冠在动态圆形日历中滚动时,颜色会根据特定日期以渐变方式变化。比如 当前经期、预测经期、排卵日 等。

Frame 184.png

文案情景设计

文案应该更为人性化,通过智能途径关怀我们的每一位用户。原先的文案表达会直接将预测的月经第一天写为“月经第一天”,但这并不尊重女性用户的真实生活情况。因此,我为不同场景设计了文本内容和排版方式。

Demo

我为这个方案创作了一段动效提供给产品经理并附上了应该采取此方案的原因和解释说明。

最终产品发布

我在2021年Q4实习结束前起草并设计了这套交互方案,一年后,我的小米同事联系我,告知他们决定采纳这个计划用于未来的产品设计。最终,这一方案被应用于2022年至2023年间发布的小米手表S1、S2和S3型号中。同期,华为也采取了类似方案。

Frame 230.png

项目二   其余功能提案

我们配合产品经理列了一个走查清单,里面包括使用中我们认为有优化空间的手表页面交互方式,和未来可以完成的多端平台交互。我提出的部分设想也成功被采用在后续产品中。

1.  设定健康数据阈值,增加预警机制

比如,当用户所在的地点超过设定的海拔高度时,预警联动血氧App启动,并友善提醒用户监测身体状况。

杜方_周报_08_27-4.001.jpeg

最终产品上线了 <血氧预警机制>,在血氧低于特定数值时及时预警,保障用户生命安全

Screenshot 2023-10-07 at 7.28.11 PM.png

4.  支持端互联 + 分享运动数据

用户可以将运动记录同步到其他产品端上。

比如,当用户在手表端点击完成运动时,手机端也会弹出提醒,引导用户查看和分享更完整的运动报告。

5.  让用户对阅读时长有心理预期

在手表端增加侧边分屏滚轴,让用户对页面的长度和切换顺序有心理预期。

杜方_周报_08_27-2.001.jpeg

最终产品采纳了 <运动记录多端联动> 的提案,让用户能够在多端同时监测运动状态。

Screenshot 2023-10-07 at 7.28.22 PM.png

最终产品也采纳了 <侧边分屏滚轴方案>,使用户对页面长度,屏幕分割,切换顺序等有一定心理预期。

Screenshot 2023-10-07 at 8.07.24 PM.png

4.  多端联动提醒,提高生活效率

比如,当手表在某一时间弹出常用App手机端也将同步反馈

比如在进入地铁时自动弹出支付宝交通二维码,或在起床后打开天气或音乐,并在手机端做联动提醒。

杜方_周报_08_27-5.001.jpeg

产品推出了 <联动交互方案>,将弹窗配对、勿扰模式、消息通知等在双端同步复刻。

Screenshot 2023-10-07 at 7.27.36 PM.png

结语

这是我在小米可穿戴团队做的第一套完整的交互设计。这个项目体现了我 追求细节、注重用户感官体验、灵活拆解需求 的工作能力。

团队鸣谢

项目经理                        Yan He
产品经理                        Zhoucong Tsui
软件研发                        5人团队
高级UI设计师                 Xuewei Tsui
高级UX设计师                Leo Liu

中级UI设计师                               Xiaoxiao Huang
中级UI设计师                               Kairui Wen
UX/UI设计实习生                         Zhen Mei
UX/UI设计实习生                         Julia Du

bottom of page