视觉原理在当下红火的机械视觉中是必不可少的，那么在我们日常工作的UI产品设计中又有什么可能性的呢？今天，我从「视错觉」这个角度，探索下如何运用在UI上。
视错觉历史
古希腊哲学家亚里士多德的《灵魂论》里阐述了人类五感：视觉、触觉、味觉、嗅觉和听觉。我们视觉设计师暂时无法在长方形盒子（泛指各种电子设备）内设计味觉、嗅觉和听觉，而对于触觉，说到底，我们始终在与这个长方形盒子接触，但是无法通过对设计内物体的真实触摸而得到感觉，实际伸出手探寻或步行而感受到距离等，去比较大小、距离等进行认知。因为这个客观存在，也更加需要我们视觉设计师运用视觉原理与技法让用户更容易与机器进行交互。因为这样的认识， 我思考了以下这些可能性：
一. 蓬佐错觉-Line
蓬佐错觉是有关长短的视错觉。自从意大利心理学家马里奥·蓬佐(Mario Ponzo,1882~1960)发表了相关论文后，这一视错觉便被称为蓬佐错觉，但在这之前，它就早已被人们所熟知。
上图上下并列的两条横线，上面的看起来比下面的长。有一种观点认为这是因为横线外侧的斜线使大脑觉得有纵深感，认为上面的线更远一些。长度相同的线段，位于远处的应该更长一些，因此上面的横线会让人觉得比下面的短。
这一视错觉在UI运用上，第一个让我想到的就是Input、Cell或段落间的分割线。各App的长短不同，大多数App都按照iOS或Android Guideline，在各控件左右留P的距离。也有一些不走寻常路的App。
△ 1.摄影图片分享App－iOS系统；2.回家吃饭－iOS系统；3.记账软件－Android系统
△ 1.日志软件－Android系统；2、3.Uber-iOS系统
图1截取iOS与Android系统上一些App，设计师使用非常规P距离线。图2截取了各平台App左右不留间距的线。从这两张图我们可以看到使用各种长短线的都有，并没有统一标准，最主要是你想要表达什么？在这里蓬佐错觉是否能帮助到你的UI表达。
手机屏幕的边界就如蓬佐错觉中外侧斜线，分割线与边界的距离就能让人对间隔中左右信息产生或长或短的感受，易读性也成为考量的一点。在App设计中，全局规范考虑是非常重要的，满足了单个页面的视觉需要是远远不够的。前端开发害怕的是没有逻辑规则的不同，只要定义好功能规范，即使在不同界面使用不同线长短也不是大问题。
简言之，在定义Line长短时，我们可以更多思考为什么要留边距、留多少合适、为什么确定这样的长短、是否有逻辑可循、考虑过全局性了吗、是否与品牌相合、是否能传达出视觉故事等等。
二. 艾宾浩斯错觉-Space
赫尔曼·艾宾浩斯（Hermann Ebbinghaus）是著名的研究人类记忆的心理学家，出生于德国，任职波兰布雷斯劳大学教授。他主要研究人类如何进行持续性记忆的（题外话：艾宾浩斯记忆曲线非常有名）。上图是他发现的视错觉图。位于中间的两个橘黄色的圆大小相同，但是看起来右侧的明显偏大。右侧橘黄色圆的四周是小圆，所以看起来比实际的大，而左侧的橘黄色圆周围是大圆，因此它看起来比实际的要略小。
△ Representations of the (A) Ebbinghaus-Titchener size-contrast illusion and (B) Delboeuf illusion.
艾宾浩斯错觉在实际应用中非常广泛，利用我们身边的东西，进行排列组合，就可以确认发现视错觉。艾宾浩斯错觉加上德勃夫错觉（Joseph Delboeuf illusion）和万辛克（Dr.Brian Wansink）、薛尔特·梵·依特森博士（Dr.Koert van Ittersum）的研究证实，人们的进食量会被盘子的大小与颜色所影响，也就是说，我们会被这些视错觉而影响真实行为。
△ Desserts served on different coloured plates at the Institut Paul Bocuse Research Centre in the study by Piqueras-Fiszman
△ The strawberry-flavoured mousse served from square, round and triangular plates in the study by Piqueras-Fiszman
△ The balanced and unbalanced plate arrangements utilized by Zellner et al. 64. In the coloured presentations, the lines of tahini were green and the dots were red.
在食物与餐具的关系中，已经被证实的结果能否在我们UI界面中运用呢？
上图是根据Google color tool搭配出的两组配色，左右图中空间格局完全相同，但运用不同深浅，色相会给人有左边空间更狭窄，而右边更宽阔的感受。
左右图中的原点大小其实是完全一致，但在左图中感觉较小，而右图较大。艾宾浩斯错觉与德勃夫错觉能在界面空间上起到明显作用，我们可以遵循这个理论工具为我们的设计服务，更好的表达功能重点，在空间中体现结构关系。
三.卡尼莎三角–Iconography & Texture
盖塔诺·卡尼莎（Gaetano Kanizsa,1913~1993）是意大利心理学家。他在意大利的里雅斯特建立了「心理学研究所」，为意大利心理学研究做出了巨大贡献。
在卡尼莎发现的视错觉中，最有名的是发表于1955年大家所熟知的下面的「卡尼莎三角」。这个视错觉表明我们的大脑把实际上不存在的三角形轮廓线画了出来。我们把根本不存在的轮廓线称为「主观轮廓」。
上图可以看到，在图形的中心有一个实际上并不存在的白色三角形。这是因为大脑在观察的时候自发将线段连接起来形成了完整的图形，而且这个视错觉在各种类似图形上都成立。
卡尼莎不仅作为心理学家取得了巨大的成就，他也是一位活跃的画家。在她的绘画中也不乏利用视觉错创作的作品。
△ Gaetano Kanizsa,[Omenone] 1977- olio su tela. cm50x70
△ Gaetano Kanizsa,[Uovo] 1975- olio su tela. cm50x70
卡尼莎错觉其实可以在UI的Graphic中运用，当然，每个设计师都要评估这个工具是否与公司品牌与视觉语言相和。
在市面上暂未看到完全运用卡尼莎错觉的icon作品，但我们时常看到未连接完成的icon设计，但这些未连接完全的icon并不会造成我们认知上困难，这是因为大脑帮助我们自动补全。
而说到材质，我们不得不提到Google推出Material Design（之后简称为MD）后，MD在Graphic明暗交界处使用了颗粒状来表达材质，这是MD纸质表达的延续。
在Graphic中，大家也慢慢开始沿用MD的材质表达，之前某厂App升级也在Graphic的材质上做了更加大颗粒全图片材质表达。
从图形、颜色、材质本身来说没有任何问题，在手机上显示也是挺漂亮，但这个颗粒感材质是如何与全局视觉体系联系的？在仔细阅读了他们设计概念／思路中视觉打法这一段，并没