现实生活中的视觉符号

将 UX 和界面设计原则扩展到数字产品以外

视觉符号（Visual indicators）用于使物体更加醒目，它们不须要用户采起主动行动，而是充当一种「通讯工具」来提示须要注意的事情。

视觉符号并不老是存在，它们通常会在某些特定条件下出现。为了完成传达，符号能够采用图标、印刷风格、尺寸、颜色变化或者动画等形式。

在数字世界中，符号无处不见。好比：

• Gmail 使用回形针图标来显示包含附件的邮件，黄色星号用于标记保存
• Todoist 用户经过复选框的颜色指示项目的优先级，并能轻易地看到评论历史记录
• 更新 App 时，进度指示器覆盖 iOS 上的 App 图标，以此显示剩余下载时间

UX 和 界面设计工做中颇有趣的一点是，它的原理和元素不只限于数字产品，在咱们周围的世界一样有迹可循。例如，可视指示符能够用来传达有关它们所表明的实体信息，最多见的一种方式是「添加文本」，超市中促销用的「降价 20%」就是一例。

固然，对于非文本指示符，还有使用颜色、方向甚至移动来进行信息传达， 而不单单是添加文字。

---

状态

「系统状态的可见性」是 Jakob Nielsen 10 种用户界面设计可用性启发之一，其中规定任何系统应该始终让用户了解正在发生的事情。

在现实物理世界中也具备相似的，视觉符号是沟通的经常使用手段。

• 项目： 邮箱

• 符号： 标记在「向上」的位置

• 对象： 邮政工做者

• 信息： 这里有邮件须要收集

• 项目： 餐厅帐单

• 符号： 卡片出如今帐单钱包 [支付状态]

• 对象： 等待员工

• 信息： 付款方式已准备好

• 项目： 飞机涡轮发动机

• 符号： 运动中的螺旋图形 [开/关状态]

• 对象： 机场地勤人员

• 信息： 当心！这架飞机的发动机正在运转。

• 备注： 这个符号也有助于规避鸟类！

---

进程

数字产品中的进度指示器很是广泛，用于传达用户距离结束还剩余多少时间或步骤。在物理世界中，它们表现为传达剩余增量或时间的标记，直到达到状态或须要采起行动。

• 项目： 书

• 符号： 将书签放置在特定页面中 [完成进度]

• 对象： 读者

• 信息： 看看你还剩多少页就看完这本书了

• 项目： 自行车刹车片

• 符号： 凹槽磨损量 [可用剩余量]

• 对象： 骑自行车的人

• 信息： 这些磨损沟槽几乎消失了。须要更换新的刹车片了！

• 项目： 鳄梨

• 符号： 茎干下面的颜色 [Ripeness Spectrum]

• 对象： 顾客和商家

• 信息： 绿色 = 已经成熟，能够吃了；棕色 = 熟透了

---

其余

生活中一些不经意的小事其实也利用了视觉符号传达的功用，好比预测人们可能会寻找什么，而后利用这个信息来设计一个符号去消除可能的混乱，从而在不用说一句话的前提下就完成了信息的传递。

• 项目： 啤酒罐

• 符号： 瓶身上用力挤压的凹陷 [表明全部权]

• 对象： 任何可能错拿我啤酒的人

• 信息： 这不是你的啤酒。

• 项目： 餐厅茶壶

• 符号： 盖子的倾斜放置 [Empty / Full Status]

• 对象： 服务员

• 信息： 茶壶空了，能够帮我加点水吗？

• 项目： 衣领

• 符号： 衣架挂钩朝向 [清洁/穿过状态]

• 对象： 我！

• 信息： 衣架朝外 = 这件衬衫很干净。 衣架朝内 = 至少穿了一次。

像这样的符号还有不少，在正确的情境下，这些视觉线索能够帮助用户区分一个项目的不一样状态，用户利用这个信息作什么取决于他们的即便需求或最终目标。

不论在数字世界或者物理世界中，简明的视觉符号都能提供直观清晰的帮助。

---

原文连接：An exploration of visual indicators in real life

个人知乎：@Aceyclee | 个人微博：@Aceyclee