以下内容由Mockplus团队翻译整理，仅供学习交流，Mockplus是更快更简单的原型设计工具。

有时，优化网站或移动应用的界面会让用户感到瓦解。人们可能会对新的配色方案、元素的定位或其他类似的东西感到失望。显然，用户这样的反应并不是你所期望的界面优化。

即使是像Facebook、Instagram和Spotify这样的大型成功公司，也经常受到负面的反馈。例如，在 2017 年 2 月，Spotify更新了它的网页播放器，引入了新的布局、新的搜索功能和带艺术范的页面。

这一改变导致许多用户在社交媒体上表达了本身的不满。一位推特用户甚至写道： “哦，太酷了，他们升级了Spotify网页播放器，让它变得更糟糕了! ”太棒了!”

那么，如安在你改变UI界面的时候，不会让用户不满意呢?下面，我们一起来看看有哪些技能可以帮你在改变产品界面的同时，又能使你的用户对此改变感到满意。

人们是如何感知信息的

现如今，界面有了多样性，用户每次遇到新的(或更新的)界面都必需学习。因此，要用户花时间寻找功能时就会让他们感觉不愉快。

阿尔托大学(Aalto University)比来进行了一项研究，他们对视觉搜索进行了建模，试图找出人们是如何获取新的或改变的界面。

结果，研究人员认为，用户快速学习的关键在于三个因素：长期记忆，短期视觉记忆和眼球运动。知道人们如何感知视觉信息使UI / UX设计人员能够创建出不妨事碍用户找到本身想要功能的高效界面(和微调的UI界面)。

包孕尼尔森诺曼集团(Nielsen Norman Group)在内的多家研究公司对人们是如何浏览一页的信息以及他们的眼睛如何移动的问题进行了研究。据该小组的研究表白，用户通常在阅读或不雅观察内容时遵循以下三种模式。

古腾堡图表

古腾堡图表反映了西方的阅读文化： 从上到下，从左到右。按照古腾堡图表，页面上的信息应该被分成四个象限，让用户更容易感知丰富的文本内容：

古腾堡图介绍了内容摆列原理，阐明了如何让用户更容易找到相关内容。

如你所见，用户选择先浏览左上角的象限;这个象限被称为主视觉区。你应该把你的关键内容，好比标题和标识表记标帜，放在这个位置。

接下来，用户的眼睛移动到强烈的休闲区域。可考虑在本区域中提供某种后续内容，例如你之前表达的想法的图片说明。

然后，用户就会进入弱的休闲区，这个区域不太可能会引起人们的注意。它是用户在阅读路途上的“休息”区域。最后，在右下角的一个终端区域将引导用户得出合乎逻辑的结论。建议将CTA(行为召唤)在此区域中以文本、视频或链接的形式出现。

在界面上使用古登堡图表可让用户驾驭阅读节奏和增强对阅读的理解。这种模式还能让你洞察到在那些最有可能被阅读或注意的地方放置重要元素。

F模式

F模式体现元素在页面上的类似F的定位。据尼尔森·诺曼(Nielsen Norman)的研究显示，人们通过横向移动眼睛开始接触内容。接下来，他们扫描一条垂直线，试图找到他们感兴趣的点，如果他们找到他们想看的内容，他们会继续横向浏览内容。

Nielsen Norman对 200 名参与者进行了研究，结果显示其中一种流行的浏览内容模式是F型的。

为了提高用户体验，可以使用诸如要点、排版、彩色按钮、高亮文本等元素。这些元素赋予界面视觉权重，，并指出页面中重要的点。

使用F模式可以确保页面上有一个高效的视觉层次结构，这样用户就可以快速浏览内容并快速找到相应问题的解决方案。

例如，Medium之前的布局利用了F模式，将主要内容(博客文章)放在左边，同时把侧边栏放在右边。侧边栏中包罗了非主要内容，但仍然是相关内容，包孕每日摘要、标签和“关于我们”和“使用条款”的链接。

Medium之前的排版就是F模式的鲜明案例

现如今，Medium已经没在使用带有图片预览和大标题的经典线程模式。相反，新的博客文章以列表形式显示，因此他们将用户的注意力吸引到文章的作者，而不但仅是图片预览。

Z模式

Z模式被非官方认为是登陆页面的王者，因为它涵盖了视觉层次结构，内容结构和CTA等重要方面。与更适合文本或展现繁重内容页面的F模式差别，Z模式有效地将用户的注意力集中在带最小副本的登录页面上。

你可能已经猜到，这个模式代表了用户眼睛的类似于z图案的移动。

简约的界面可以从Z模式中获益，它以一致的布局和视觉上令人满意的内容结构为用户带来愉悦。

在使用z模式设计时，应遵循以下结构：

1.顶部的水平线应该包孕醒目的内容和元素，好比logo和导航栏(这样用户很快就能拜候网站的相应页面)。

2.遵循经典的讲故事方式，对角线应该向用户介绍主要内容，包孕主要内容，吸引注意力的图片，幻灯片等。

3.最后，一条较低的水平线应该有一个CTA(行为召唤)，它可以刺激用户执行某些动作，好比注册、订阅或购买。

底部线条：