当前位置: 首页 > 科技赋能

【教程】如何设计智能穿戴设备的UI?

时间:2024-05-22 18:34:15 科技赋能

从PC到手机,人们开始研究如何在更小的屏幕上设计更好的UI体验。

如今,随着可穿戴设备的到来,如何在2英寸见方的屏幕上为佩戴者提供更加舒适的体验成为了需要解决的问题。

虽然“设计”这个词乍一听起来有些吓人,但设计师只需要回归本源,回归最基本的设计理论,就能设计出体验更好的可穿戴设备。

用户界面。

可以说,可穿戴设备对当前的设计师提出了设计领域的新挑战。

虽然目前市场上的可穿戴设备种类繁多,但可穿戴设备都有一个共同的特点——屏幕都比较小。

随着越来越多的智能手表跟进,可穿戴设备提供的屏幕色彩和功能丰富程度也在逐渐提高。

另一方面,健康手环等智能可穿戴设备越来越受欢迎。

简化开发。

  不同类型的可穿戴设备,从简单的健身追踪器到功能更丰富、更强大的智能手表,如何在这么小的屏幕上更好地设计更好的UI,需要考虑的事情有很多。

目前,我们可以看到,市场上的可穿戴设备主要分为三类:基于蓝牙与智能手机连接的智能手表,比如Apple Watch或者三星的Gear S2独立智能追踪手表,比如运动员比较喜欢的那些。

具有GPS功能的手表活动跟踪器,例如Fitbit的Surge,每一个的屏幕尺寸都只有几十毫米,这也使得手表的UI设计相当具有挑战性。

有些设备还配备全彩屏幕。

其中许多设备具有与智能手机类似的功能,而其他设备则只有黑白显示屏。

界面设计理论的应用 那么,如何设计可穿戴设备的UI呢?我们应该从什么角度来考虑呢?我们先回顾一下设计的基本理论以及在课堂上学习设计时学到的一些概念。

这些概念包括颜色、对比度、空间和版式。

颜色 目前,大多数智能手表选择黑色作为屏幕背景颜色。

许多智能手表应用程序在黑暗背景光环境中运行。

这就使得颜色的选择显得尤为重要,需要使用在黑色环境下能发挥更好效果的颜色。

当谈到如何在较小的屏幕上更好地工作时,扁平化设计就是答案。

再加上深色背景,这意味着我们需要设计一个颜色鲜艳的图标。

如上所示,Runtastic 在图标上使用明亮的颜色方面做得很好,使它们在深色背景下很容易看到。

蓝色用于建立品牌标识,而更亮的绿色则用于代表按钮和用户操作。

所有颜色选项一目了然,这对于设计和功能来说都非常有用。

对比度 对比度也是小屏幕 UI 设计时需要考虑的重要因素。

设计应清楚地定义每个元素,并包括它们之间的间距。

如果屏幕上有许多不同的元素,这一点尤其重要。

同样,对比度也很重要,因为正确的对比度可以使元素一目了然,这是手表佩戴者与设备交互的最佳方式。

如上图,Streaks 利用明暗对比强烈的方式,在元素之间营造出鲜明的对比,有助于提高内容的可读性。

每个圆形图标均设计用于触摸以打开或关闭特定功能。

通过颜色和按钮大小的选择,条纹很好地使每个元素清晰可见。

空间利用率的高低将决定可穿戴设备UI设计的成败。

太多的空白或太大的选项框将导致内容空间非常有限;如果屏幕上充满了内容,就很难区分优先级,并且佩戴时也很难查看。

所以必须掌握好这个度,既要保证UI的功能性,又要保证其可用性。

如上所示,《卫报》做得很好。

图片和文本都留有足够的空间,以确保每个场景都能传达完整的单一信息。

需要注意的是,《卫报》对每行的字符数也调整得很好,不太多也不太少。

版式 只有一种版式适合在这些小屏幕上工作——极简版式。

简单的无衬线字体在市场上几乎所有应用程序中都占有重要地位。

在可穿戴设备上,字体大小通常比你想象的要大——每行大约 20 个字符(英文字符),并且每条消息不超过 6 个屏幕的屏幕大小。

如上图所示,Citymapper采用多层界面文字,为佩戴者提供不同层次来执行不同的操作。

字体简单、清晰。

该应用程序完美地结合了所有这些元素——颜色、对比度、空间和漂亮的版式——帮助佩戴者了解哪些信息是最重要的。