B端页面设计

视觉关联：

当人们全身心投入到某个活动中时，会对周边干扰视而不见，这种状态被称为“流”。宜家的动线设计很好的营造了这种状态，让消费者完全沉浸于商品浏览，并且尽量不去打断这种行为流。
任何一个界面呈现给用户的时候，用户都会下意识的去判断界面上什么信息是最重要的，接着会去关注这些信息都有什么关联；因此，除了按照逻辑去组织信息之外，还应该合理的去呈现信息的视觉层级关系。

视觉层级关系有几种常见的区分方式：

• 强调：使用基本视觉元素（颜色、形状、大小等）区分层级。
• 亲密性：位置接近的元素通常是有关系的，而且位置越近，关系越强。
• 图胜于言：视觉符号和对象关联，例如：齿轮或扳手=设置，垃圾桶=删除。
• 浏览顺序：根据浏览顺序，从左到右（部分地区）或从上到下信息重要程度依次减弱

页面信息的视觉关联性

如何验证界面元素的视觉关联性是否合理呢？

眯眼测试：

《About Face 4：交互设计精髓》 中提到了一个很有意思的测试，为了确保界面视觉信息有效的拉开层次关系，图形设计师经常会用到一个方法“眯眼测试”（squint test）——闭上一只眼睛，眯着另外一只眼睛看屏幕，看看哪些元素突出，哪些元素模糊，哪些元素看上去成组，哪些元素看上去零散。从多个角度去观察，总能够发现之前没有注意到的布局和构成问题。