UI/UX 设计原则-视觉指示在现实生活中的延伸

视觉指示(Visual Indicators) 可以让某些物品在芸芸众生之中突显出来。它们不会要求用户采取行动，而是让某些值得注意的事项，获得关注的沟通工具。指示不会一直显示，只在某些条件下才会出现。指示可能会用图示、排印风格、放大、颜色变化和动画等方式传达讯息。

在互联网的世界，到处都可以看到指示的范例。比如Gmail ，用回纹针显示带有附件的邮件，还有用黄色五角星标示已经收藏起来的讨论。Todoist 的使用者用勾选框的颜色来区分优先顺序，而且也很容易看出哪些有备忘记录。iOS 的App 在下载更新时，图示会覆盖一层进度指示，让使用者知道还要下载多久。

我喜欢研究UX 和ui界面设计，是因为原则和元素可以延伸出互联网产品本身。我们的周围到处都有像直观功能(affordance) 和符号(signifier) 的指示，传达它们所代表物体的信息。最明显的视觉指示方式是加上文字，例如超市里，把东西标上「打八折！」的标签。

在这篇文章里，我们将举一些现实生活中的例子，没有文字的指示，而是颜色、方向和姿态等来给出视觉指示。

状态指示

系统状态提示是Jakob Nielsen的用户界面设计的10个易用性法则之一，其中提到：任何系统都要一直让使用者知道现在发生什么事情。在现实世界，到处可见以视觉指示传达状态的情况，而且用途相似。

物品：信箱

指示：旗标位在「往上」的位置[收信/寄信的状态]

对象：邮差

信息：「嘿，这里有信件要寄！」

物品：餐厅帐单

指示：卡片伸出帐单夹[结帐状态]

对象：服务生

信息：「可以进行结帐了！」

物品：飞机引擎

指示：旋转中的螺旋图像[运转/关闭状态]

对象：机场地勤人员

信息：「小心！这架飞机的引擎启动了。」

进度指示

还要[增加] 多少，[此物品] 才会[完成]？进度指示用来传达用户距离流程结束还剩多少时间或步骤，这在互联网产品里很常见。而在现实世界，它们以显眼的记号传达某种状态还剩下多少份量或时间，或是还要多少行动。

物品：书

指示：插在某一页的书签[进度]

对象：读者

信息：「这本书你大约已经看完一半啦。」

物品：脚踏车煞车皮

指示：沟槽的消耗量[剩下可用量]

对象：脚踏车骑行者

信息：「上面的沟槽几乎不见了。该换煞车皮咯！」

物品：牛油果

指示：梗底下的颜色[成熟度颜色]

对象：正在购物的人

信息：咖啡色=「我已经熟透了或者被碰伤了。」绿色=「我熟了，可以吃了！」

个人喜好

我一直在寻找能够让问题在提出之前就获得答案的创意方式。事先预测人们在寻找的物品，就可以免于造成潜在的困惑。我发现以下指示所传达的讯息，可以不说出任何一个字，就有助于区分其他人和我自己之间的界线。

物品：啤酒罐

指示：把罐子凹下去[所有权]

信息：「这不是你的啤酒。」

补充一下：酒杯上的装饰小物（还有毛巾上的吊饰 ）都是相同的手法！

物品：餐厅的茶壶

指示：摆放位置，还有把茶盖斜放[空的/满的状态]

对象：服务生

信息：「茶壶已经空了。请帮我们再倒些水。」

物品：有领子的衬衫

指示：衣架钩子的摆放方式[干净/穿过的状态]

对象：我自己！

信息：钩子向外=「衬衫是干净的。」钩子向内=「这件衬衫至少穿过一次了。」

这些指示并不会明讲自己是什么东西。但是，只要在正确的情境之下，这些视觉线索可以帮助使用者辨别出物品的不同之处。至于使用者依赖这些传递信息的行为，则要看当下的需求或最终目标。不管是在互联网或现实世界里，视觉指示都随时在旁提供协助。