智能手表的用户体验设计

许多设计师对于桌面端和移动端的应用程序在设计方面都有亲身实践的经验,但是智能手表对他们来说却是一个全然陌生的领域。因为设备的大小和人们与之交互的方式都需要使用不同的设计方法。

应用程序在智能手表上的最佳实践需要其支持快速交互、并专注于用户最关心的内容。本文将提供一些实用建议,帮你创建出色的智能手表应用。

一目了然

表盘对于显示信息的空间是有限的。所以,请务必记住与手表的互动需要以秒为单位进行测量,因此应用程序必须迅速向用户提供所有必要的信息和操作。你可以通过使界面保持整洁并为信息创建清晰的层次结构来实现此目标:

  • 避免一次在屏幕上显示太多信息。仅显示用户需要查看的基本细节。
  • 使用不同的字体粗细、大小、颜色和空白强调重要信息。
  • 创建可视分组,以帮助用户找到所需的信息。使用负空间将相关元素和信息放置在不同的区域。
并排比较两块手表,一个在表盘上显示了一行行的水平线,另一个则显示的是一个简单的复选标记。很显然,左侧的表盘信息需要用户眯着眼睛才能看清写的是什么。

专注于核心功能

设计出色的智能手表用户体验需要使用一种专注的方法。「人们不想购买四分之一英寸的钻头,他们想要的是一个四分之一英寸的孔。」该设计原理适用于所有类型的产品,包括智能手表。智能手表的设计应该响应用户的特定需求。而其用户体验设计应始终围绕着实现应用程序的核心目的来展开。

不要在应用界面中包含不必要的功能、操作或内容。专注于主要业务。例如,如果你为智能手表设计电子邮件应用程序,则应专注于创建出色的阅读以及发送快速回复的体验,并跳过添加附件或编辑收件人的选项,因为用户很少会在智能手表上进行这些操作。

反应灵敏

智能手表的应用程序应该是具有高性能的,需要对用户的操作立即做出响应。进行性能基准测试,并确定应用程序中需要用户等待的位置。优化加载时间缓慢的内容(通常,加载时间缓慢是由诸如图像和视频之类的多媒体内容引起的)。

提示:有一个两秒互动的简单规则,即你的智能手表应用程序设计中的任何响应都不应该超过两秒。

可预测的导航

减少总页数

在智能手表用户体验中包含太多页面的内容将耗费应用内导航的时间并且使用起来会令人沮丧。当用户需要更多信息或功能时,他们可以切换到移动或桌面端等其他媒介。专注于基本内容,并为实现应用程序快速而便捷的交互而设计。

选择适当的导航模型

如果应用具有多个屏幕,则需要选择合适的导航模型。选择最能满足你需求的导航模型。Apple建议使用page-based 或 hierarchical 模型:

  • Page-based 基于页面的:在基于页面的导航中,用户通过水平滑动即可在页面之间进行导航。基于页面的导航是一种呈现扁平信息集合的好方法,其中所有项都是对等的。
Page-based导航。图片来源:Apple
  • Hierarchical 分层级的:当用户点击层级中的项目时,将显示一个新屏幕,其中显示了有关该项目的详细信息。这种类型的导航非常适合父子界面(即,类别和该类别中的项目)。
Hierarchical 导航。图片来源:Apple

请记住,一旦决定要使用哪种导航模型,就要在应用程序中只使用它一种。不能在同一应用中使用两种不同的导航模型。

提示:避免创建深度超过2-3层的层级结构。当用户在导航过程中迷失方向时,包含超过2或3个级别的信息很容易出状况。

不要重新定义手势的含义

手势是与移动设备和智能手表进行交互的标准方式。用户希望与产品之间进行熟悉的手势交互。因此,应避免使用标准手势来执行非标准操作。例如,最好不要重新定义滑动或捏合缩放的含义。除非你的应用程序是游戏类的,否则重新定义标准手势的含义会使智能手表的用户体验变得混乱而复杂。

降低交互成本

交互成本是用户为了实现目标而必须在应用程序交互上投入的所有努力(无论是精神上的还是身体上的)。无论用户执行什么操作,都不应占用他们太多时间。减少用户必须看到的屏幕数量以实现该目标。

利用设备传感器

目前市场上有许多智能手表都内置了加速度计和陀螺仪。来自传感器的数据可用于与健身和健康相关的活动或游戏。设备传感器不仅能够减少数据输入的工作量,而且还为用户提供了很多好处。例如,健身应用可以使用这些数据来提供有关用户总体健康状况的反馈。

及时且相关的通知

智能手表非常适合提供可行的实时数据。他们应该在正确的时间(当用户期望看到或需要看到它时)提供正确的信息(为用户带来高价值)。

在为智能手表端进行设计时,要记住以下几件事:

  • 通知应易于解除。智能手表端的设计应使用户感到舒适,不要干扰用户正在进行的操作。
  • 仅将触觉反馈用于重要通知。触觉反馈用来告诉用户发生了重大的事情,需要用户注意。
  • 请注意隐私。避免在通知中显示潜在的敏感内容。

优化多媒体内容

优化所有图像

经过优化的图像占用磁盘空间会更少,加载速度会更快。建议使用 JPEG 格式,因为其压缩算法通常会产生较小的尺寸。JPEG 压缩的优点在于,很容易在图像质量和大小之间找到平衡。JPEG格式提供了从0%(重压缩)到100%(无压缩)之间选择图像压缩方式的能力。但请记住,该文件格式是有损的,这意味着它每次压缩时都会丢失一些数据。缺乏透明度是这种格式的另一个缺点。

保持视频剪辑简短

应用程序界面中的媒体剪辑不应超过 30 秒,越短越好。长剪辑不仅会消耗更多的磁盘空间,而且还要求用户将手腕长时间抬起,这可能会产生疲劳。

视觉设计

字体排版

字体排版必须尊重内容。使文本可读、易懂和清晰至关重要。

以下是处理智能手表的用户体验时应遵循的一些实用建议:

  • 尽量使用系统字体。San Francisco (SF) 是Apple watchOS中的系统字体(分为两种变体:SF Compact Text 和 SF Compact Display)。 Roboto Condensed是Google Wear OS中使用的主要字体。
  • 避免在小尺寸字体上使用细体。在小字体上使用细体会导致字体显示不清晰。
  • 请谨慎使用自定义字体。自定义字体使产品团队能够传达其品牌。但是,建议在应用程序中使用不超过一个的附加字体。尽管 watchOS 和 Wear OS 均支持自定义字体,但使用过多字体会使界面感觉混乱。
  • 请确保自定义字体清晰易读。自定义字体在字体较小时可能不会太清晰(它们很少支持 Apple 的 Dynamic Type 调整每个屏幕字体大小的功能)。 因此,最好将自定义字体用于标题等较大的文本元素。

文本对齐和UI元素对齐

UI设计模式中的F模式适用于所有类型的设备,包括智能手表。左对齐的文本更易于阅读。对于按钮等功能元素,建议将其显示为带有文本标签的垂直堆栈。此设计决策使按钮更加容易被用户的眼睛扫描到。

两只Apple Watch和中间的iPhone显示了不同的健康结果界面。

颜色

颜色是可以与用户进行交流的功能强大的工具。选择正确的配色方案不仅可以支持你的品牌,而且还可以在不同屏幕之间建立视觉上的连贯性。

使用颜色时,请记住以下几点:

  • 考虑上下文。确保选择的颜色传达了适当的消息。例如,如果一个正念应用程序在冥想期间使用鲜艳的红色作为背景色,那将是令人生厌的。
  • 考虑对比度。 Apple 的颜色设计准则建议为文本使用浅色,因为该种颜色更容易获得合适的对比度和清晰度。
  • 考虑色盲。许多色盲人士都很难区分红色和绿色。不要将这些颜色组合作为传递消息的唯一方法。
苹果人机交互指南中建议的配色标准。

动画

精心制作的动画效果可以为用户创造真正令人难忘的体验。即使设计人员以前有为移动应用程序创建动画的经验,但是为小屏幕创建动画也会遇到挑战。因此,建议遵循一些简单的规则来创建出色的智能手表用户体验:

  • 保持动画简短。简短的动画传达所需的信息,而无需用户等待。
  • 创建具有特定用途的动画。切勿仅仅因为可以创建动画而创建动画。动画应始终出于功能目的,建立情境并提请用户注意界面的特定部分。
  • 最小化并发动画的数量。同时运行许多动画不仅会影响应用程序的响应速度,而且还会使用户对动画难以理解。
  • 将动画设置为可选。在辅助功能偏好设置中启用减少动画选项时,应将应用的动画最小化或消除。
来自Apple Watch的优秀动画示例。图片来源:Feng ZHU

不要孤立地考虑手表端

智能手表可帮助用户快速访问信息,但有时用户可能希望切换到其他介质以更深入地浏览内容。请务必清楚,手表不应使信息孤立。相反,这些信息应该在用户拥有的所有数字介质之间进行传递。在进行移动端设计时,你需要考虑移动设备和智能手表一起工作时的情况。同步用户进度,使用户更轻松地切换到其他介质,并直接从同一步骤继续进行旅程。

从 Apple Watch 上移交任务。用户可以继续在 iPhone 上执行 Apple Watch 上启动的任务。图片来源:苹果。

总结

在为智能手表设计应用程序时,最终目标是模糊设备和软件之间的界限。与经典手表类似,与智能手表的交互应轻巧快捷。智能手表用户体验的重点在于交互的速度和舒适性。用户不应觉得自己正在与计算机交互,而是在与使自己的生活更舒适的个人设备进行交互。


英文原文:https://xd.adobe.com/ideas/principles/app-design/ux-design-for-smartwatches/
原文作者:Nick Babich
编译作者:@设计吐司

以上译文仅代表原作者观点。如需转载请遵循CC版权协议正确标明出处。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 160,706评论 4 366
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 68,002评论 1 301
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 110,462评论 0 250
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 44,375评论 0 216
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,763评论 3 294
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,849评论 1 224
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 32,033评论 2 317
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,768评论 0 204
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,490评论 1 246
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,734评论 2 253
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,204评论 1 264
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,566评论 3 260
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,227评论 3 241
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,137评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,934评论 0 201
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,926评论 2 283
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,774评论 2 274

推荐阅读更多精彩内容