我们在UI设计中经常会遇到图形理论和视觉偏好上的冲突，这时候应该以视觉偏好为标准去决定方案的输出，即便它不符合理论，但只要符合人眼的视觉偏好，这就是好的方案。视觉错觉是人眼奇妙的生理特征。大家在设计领域的精进中，对视觉错觉的了解是非常有必要的，这能够让我们了解视觉的特征，从而做出符合视觉偏好的设计。  
我拥有被馈赠的礼物——可疑的超能力，能够一眼就发现设计作品在视觉上的缺陷。对于这种缺陷我就像拥有蜘蛛侠的蜘蛛感应，每当我看见不对齐、扭曲、或者不美观的东西时，我的后脑勺就会发出刺痛感。

01. 说明文本过浅
你有没有注意到放置在填充形状旁边的文本颜色看起来更浅亮？这是字体平滑效果，使得文本看起来比原始颜色更浅，字体越小，这种视觉效果越强。

02. 小字体，更纤细
在某些字体中，使用更小的字号会导致文本更加纤细和半透明化（字体平滑效果使然）。如果你坚持要用小字号（有时候这会营造某种感觉），那就按你想要的来，但请务必加粗：使用粗体，你的设计仍保持整洁，说明文本依旧纤细，但更加引人注目，而且清晰易读。

03. 背景图片上难以阅读的文本
在背景图片上放置文本是一种常见的做法，但如果图片是动态变化的，你要确保无论背景颜色如何，文本都保持可读性。这可以通过足够的对比度和渐变底色来实现：半透明渐变图层是一种好方法，即便是放置在浅色背景图片上也可以确保文本保持可读性。

04. 行距错误
说起文本，这是一个重要的内容，处理大字体时，行距可能会成为一个问题：根据字体的不同，将行距设置为比字体大小大 2pt-5pt。

05. 元素不对齐
一种称为”视觉补正“的技术（通常用在字体中），通过将按钮往左侧微移来修正不对齐的错觉。

06. 表单对齐的不一致
当表单使用不同元素时（不同形状、边框或者水平对齐方式），可能会发生视觉错觉，使得表单看上去似乎没有对齐：每种元素的设计都略有不同（有些边框是椭圆形的，有些不是），尽管有明确的对齐策略，但结果让人感觉完全扭曲。有许多可能的解决方法 —— 我选择将所有的圆角改成方角，并将所有的说明文本和边框对齐。元素类型更加一致，左对齐的效果就愈加明显，整个表单变得更加整洁和设计良好。

07. 不对齐的图标
有时你要做一点儿欺骗，移动/调整某些图标的大小使其视觉上的对齐：
一些图标感觉很大（电话、音频），而有些图标则因其设计和物理中心的不同而感觉没有对齐。一个可选的解决方案是选择外观一致的图标使其看上去一致（比如一组圆形图标）。
另一个解决方案（前文介绍过）是微调每个图标，使其并排放置时的效果更符合人眼视觉偏好。这意味着你可能要将图标放置在实际设计中，对其进行修改，重复试错几次，直到设计看上去完美为止。

08. 不对称的图形
我们在元素中心位置使用非对称图形（比如三角形）时，几何中心会造成视觉上的错误，使人感觉图形放错位置。

09. 不同的图标主题
如果你使用一些现成的图标，最重要的是选择看上去像是来自同一系列的图标。通常，我们会陷入漫长的寻找过程中，寻找那些最好看的图标，却忽略了不同图标之间的视觉差异。

10. 按钮说明文本多行显示
有时候设计会比复制更好。

11. 长文本
用户体验写作应该是设计流程中的一环。一些设计考虑因素将决定文本的长度，而某些文本考虑因素将决定设计。根据经验，文本应该简洁明了。

12. 点击对象太小
交互元素必须满足1cm x 1cm（0.4in x 0.4in）以支持足够的选择空间并防止胖手指的点击错误。苹果公司在12年前就说过，但找到不容易点击的按钮仍然非常容易。解决方法也很明显：按钮的尺寸要大于视觉内容的大小（无论是图标还是文本）。

13. 烦人的边框半径
里面那个形状的半径看起来更大，但这只是视觉上的错误。实际上，两个半径是相同的，但眼睛无法捕捉它们的一致性。将圆形按钮放在圆形框架中，会发生相同的事情：
框架和按钮都是一样的圆角边框，但它们看起来就是不一样。在这种情况下，“欺骗”是通过在框架中使用完全不同的曲率，以消除视觉错觉。

14. 恼人的边框（一般而言）
说起边框，太多的线条会让你的设计显得拥挤。设计师经常讨论留白，但随着产品的演化和新特征的引入（有时没有经过适当的设计流程），框架和边框不知不觉间出现：
摆脱便捷，改用空格分隔每组元素，就不会造成不必要的混乱。

15. 使用灰色而不是透明度
许多设计师在标题中使用不同的灰色阴影，从而在标题、副标题和正文之间建立层次结构。不幸的是，当文本放在彩色元素（例如背景图像）上时，灰色往往失效了。因此，我们应该使用一定透明度的白色来让元素吸收背景色：使用透明度来代替纯灰色，这会让你的半透明元素融合背景颜色，使其感觉上更自然。