Image credits:https://lawsofux.com/,中文为译者注
四、清晰传达相关性在设计时,利用元素的视觉变化来表现组织和关联更容易:如使用形状、颜色和尺寸等基本元素来表现相关(或相似性)或不相关(差异)。
如下图所示,沙龙(旧)网站的两个组成部分由它们的相对尺寸来区分,用户可以清楚地感知到两个独立的区域:左侧的「头条故事」和右侧的「最多阅读」。虽然这两个部分的功能:展示文章,都是一样的。但是,通过放大「头条故事」的版面,并以不同颜色显示作者名称,让用户首先注意到这个部分。
这与「相似定律」有关:即便元素是分开的,人眼倾向于将设计上相似的部分看作一个整体。
Image credits:https://lawsofux.com/,中文为译者注
如果上面的例子还没有说服你,让我们看看如何在设计中使用「相似定律」来传达关系。
链接和导航是方便用户快速浏览网站最常用的方法。通常,用户不会通读整个页面,而是浏览链接或使用导航来查找他们所需的信息。
设计师在日常网页设计中,经常有意无意地使用「相似定律」,它可以用来解释为什么这么多设计师喜欢使用蓝色下划线或看起来一样的链接。
美国船主协会(BoatUS)的官方网站使用下划线和颜色来表现导航链接组之间的关系,让读者将视觉相似的导航链接感知为站点的数据结构中相关或层级相同的内容。
五、聚集、合并、拆分以简化视觉大多数与我们合作的客户都说,「我们想要能给用户留下深刻印象的、简洁直观的应用设计」。
用户不喜欢混乱复杂的设计,Hubspot组织的一项调查显示,「访客注重是否能轻松找到所需信息超过漂亮的设计或美妙的体验」。