在 UI 设计领域，格式塔原理是解读用户视觉认知规律的核心依据。它源于心理学对 “整体感知” 的研究，主张人们对视觉元素的认知并非孤立看待单个部分，而是倾向于将其整合为有意义的整体。这一原理能帮助设计师贴合用户本能的视觉习惯，让界面更易理解、更具逻辑性，进而提升用户体验。下面，我们将聚焦格式塔原理中与 UI 设计关联最紧密的七个核心原则，结合实际设计场景展开分析。

一、亲密性原则：用间距划分功能关联

人们在观察界面时，会本能地将位置相近的元素归为一组，元素间距越小，彼此的关联性在用户认知中就越强。这一原则在 UI 设计中，是划分功能板块最自然的方式 —— 无需依赖边框、色块等显性分割，仅通过调整元素间距，就能让用户快速识别 “哪些内容属于同一模块”。

比如支付宝首页，“余额”“账单”“总资产” 三个元素的间距极小，形成一个紧密的 “个人财务区”；而这个区域与下方 “理财产品推荐” 板块之间，会留出两倍以上的空白。这种间距差异无需额外说明，用户一眼就能区分 “个人资产查看” 与 “理财服务” 是两个独立功能，极大降低了认知负担。

二、相似性原则：用共性强化模块识别

当多个元素拥有共同特征（如相同的形状、色彩、大小或风格）时，用户会自动将它们视作一个整体。在 UI 设计中，这一原则是统一功能模块视觉语言的关键，能帮助用户快速建立 “元素特征与功能属性” 的关联。

以美团 APP 为例，底部导航栏的 “外卖”“团购”“买菜”“我的” 四个图标，均采用 “圆形轮廓 + 黄色主调 + 线性风格” 的设计：圆形轮廓统一了图标的外在形态，黄色主调呼应了品牌色，线性风格则保证了视觉的简洁性。即便四个图标的内容不同，用户也能通过这些共性特征，立刻识别出它们是归属于 “核心导航” 的同一模块，避免混淆功能层级。

三、连续性原则：用视觉惯性整合碎片信息

视觉具有 “延续性” 本能 —— 当看到不完整的线条或元素时，用户会下意识地将其补充为连续的整体，而非孤立的碎片。这一原则在 UI 设计中，常用于整合分散的信息，让用户感知到 “信息间的逻辑关联”，尤其适用于流程类、序列类设计。

除了常见的 logo 设计（如耐克的 “对勾” 标志，通过简洁的曲线让用户感知到连续的运动感），UI 中的 “步骤条” 也是典型案例。比如电商 APP 的 “下单流程”（待付款→待发货→待收货→已完成），每个步骤都是独立的圆形图标，但通过一条贯穿始终的浅灰色线条连接，用户会本能地将这些分散的步骤视为 “连续的下单流程”，清晰知晓当前所处阶段与整体进度的关系。此外，时间轴设计、进度条设计也常借助这一原则，让碎片化的时间节点或进度片段，形成连贯的视觉逻辑。

四、闭合性原则：用 “不完整” 激发整体认知

当观察熟悉的视觉形象时，即便形象存在缺口或不完整，用户也会自动将其补全为完整的整体 —— 这就是闭合性原则的核心。在 UI 设计中，善用 “不完全图形” 或 “正负形”，既能简化视觉元素，又能让界面更具设计感，同时不影响用户的认知理解。

小红书 APP 的图标就是典型案例：图标主体是一个 “缺了右上角小角的正方形”，但由于 “正方形” 是用户熟悉的基础图形，即便存在缺口，用户仍会本能地将其补全为 “完整的正方形”，而非孤立的 “带缺口图形”。这种设计既避免了纯正方形的单调，又通过微小的缺口增加了图标的记忆点。此外，部分 APP 的卡片设计也会运用这一原则：卡片顶部保留一个小弧度的缺口，但用户仍会将其感知为 “完整的卡片容器”，既简化了设计，又增强了界面的呼吸感。

五、主体 - 背景原则：用对比凸显视觉主次

人们在观察画面时，会自然地将 “小物体”“对比度高的物体” 视为 “主体”，将 “大物体”“对比度低的物体” 视为 “背景”—— 这一原则是 UI 设计中划分视觉层次的关键，能帮助用户快速聚焦核心信息，避免被无关背景干扰。

除了 “大小差异”，设计师还会通过 “色彩对比”“清晰度差异” 强化主次关系。比如 APP 中的弹窗设计：弹窗主体通常是尺寸较小的白色卡片，而背景则是覆盖整个屏幕的半透明黑色蒙版。这里，白色卡片与黑色蒙版形成强烈的色彩对比，半透明的背景降低了自身的清晰度，再加上 “小卡片” 与 “大背景” 的尺寸差异，用户会立刻将白色卡片视为 “需要关注的主体”，将黑色蒙版视为 “衬托主体的背景”，从而快速聚焦弹窗内的核心信息（如确认提示、输入表单）。

六、焦点原则：用 “突出性” 引导视觉焦点

视觉焦点具有 “优先性”—— 无论界面元素的位置或属性如何，只要通过设计让某个元素 “视觉突出”，它就会成为用户首先关注的对象。在 UI 设计中，这一原则是引导用户操作的核心，尤其适用于需要 “强引导” 的关键按钮或信息。

为了突出核心元素，设计师通常会采用多种手段组合：放大尺寸（如 “提交订单” 按钮比 “取消” 按钮大 1.2 倍）、高饱和度色彩（如红色的 “确认付款” 按钮，区别于灰色的 “返回” 按钮）、添加视觉装饰（如按钮外的边框、内部的渐变、hover 时的阴影）。以淘宝 APP 为例，商品详情页的 “加入购物车” 按钮，不仅尺寸比 “收藏”“分享” 按钮更大，还采用了品牌标志性的橙色，且添加了轻微的阴影效果；而 “收藏”“分享” 按钮则为浅灰色。这种设计让 “加入购物车” 成为视觉焦点，精准引导用户完成核心购买动作。

七、共同命运原则：用 “运动同步” 关联元素

即便元素之间距离较远、外观差异较大，只要它们 “同步运动” 或 “同步变化”，用户就会将其视为相关联的整体 —— 这就是共同命运原则。在 UI 设计中，这一原则常用于强化 “元素间的功能关联”，或通过 “差异化运动” 让特定元素脱颖而出。

高德打车 APP 的 “打车图标” 就是经典应用：在首页地图界面中，其他元素（如街道名称、POI 点）均保持静态，而 “打车图标” 会持续进行轻微的 “上下浮动” 微动效。这种 “单独运动” 让图标在静态背景中格外突出，用户能快速定位到核心叫车功能。此外，列表设计也常运用这一原则：在微信消息列表中，左滑某条消息时，该消息对应的 “标为已读”“删除” 按钮会同步滑出；而其他消息保持不动。这种 “同步运动” 让用户明确感知到 “按钮与这条消息是关联的”，避免误操作。再比如导航栏选中态：当点击底部导航的 “我的” 图标时，图标颜色会变深，同时下方的指示条也会同步移动到 “我的” 下方 —— 两者的同步变化，强化了 “图标与指示条的关联”，让用户清晰知晓当前选中的模块。

结语

格式塔的七个原则，本质上是对 “用户视觉认知本能” 的总结。在 UI 设计中，它们并非孤立存在 —— 有时会结合使用（如焦点原则常与主体 - 背景原则配合，共同突出核心按钮）。设计师无需机械套用，而是要基于用户需求与界面场景，灵活运用这些原则：通过亲密性划分板块、用相似性统一风格、借连续性整合流程、以闭合性简化设计、靠主体 - 背景区分层次、凭焦点引导操作、用共同命运关联元素。唯有如此，才能让 UI 界面既符合用户的视觉习惯，又能高效传递信息，最终实现 “设计服务体验” 的核心目标。