01 · CORE DEFINITION
扁平化设计解决什么视觉问题
02 · RECOGNITION GUIDE
如何识别扁平化设计
响应式网格、清楚层级、稳定导航和以任务为中心的界面区块；简化几何图标、一致轮廓和可辨控件状态，避免把所有元素压成同一平面；有限平涂综合色与足够文字对比，可用受控综合色变化区分状态；通常减少装饰高光，必要时以轻微阴影或层级线索支持可用性；清楚矢量边缘、一致图标系统和适配不同屏幕的数字表面。 判断时不要只看题材，要逐项核对下面的视觉结构。
决定视线从哪里进入、信息按什么顺序被读取。
决定主体的力量感、亲近感以及人与空间的关系。
决定风格在缩略图和纯剪影状态下是否仍可识别。
决定第一情绪和区域层级，不能只作为最后滤镜。
决定空间深度、材质可信度和戏剧程度。
把风格延伸到信息层级；文字与图像必须属于同一系统。
提供触感、媒介和年代线索，增强风格可信度。
控制信息压力与观看速度；扁平化设计需要在识别度和可读性之间保持平衡。
03 · KEY VISUAL GENES
关键视觉基因：特征、作用与使用方式
生成或设计时至少选择三项共同工作，不要只复制一个表面符号。
响应式网格、清楚层级、稳定导航和以任务为中心的界面区块
作用组织观看路径和前后关系，是风格成立的结构基础。
使用先用“响应式网格、清楚层级、稳定导航和以任务为中心的界面区块”搭建大结构，再添加清楚矢量边缘、一致图标系统和适配不同屏幕的数字表面等表面信息。
简化几何图标、一致轮廓和可辨控件状态，避免把所有元素压成同一平面
作用建立缩略图级别的识别度，决定主体看起来如何。
使用用纯黑剪影检查“简化几何图标、一致轮廓和可辨控件状态，避免把所有元素压成同一平面”是否清楚，再补充色彩与材质。
有限平涂综合色与足够文字对比，可用受控综合色变化区分状态
作用把风格延伸到标题和信息结构，影响阅读顺序与节奏。
使用让“有限平涂综合色与足够文字对比，可用受控综合色变化区分状态”只承担标题和层级；正文仍需满足实际阅读尺寸。
通常减少装饰高光，必要时以轻微阴影或层级线索支持可用性
作用建立明暗层级、空间深度和情绪强度。
使用先确定唯一主光方向，再用“通常减少装饰高光，必要时以轻微阴影或层级线索支持可用性”塑造主体；不要叠加互相冲突的光源。
清楚矢量边缘、一致图标系统和适配不同屏幕的数字表面
作用提供媒介、触感与年代线索，避免画面只有抽象形状。
使用把“清楚矢量边缘、一致图标系统和适配不同屏幕的数字表面”附着到合理对象和表面，不要作为统一滤镜覆盖文字与留白。
使用高可读界面字体；标签、按钮和链接必须保持明确可发现性
作用把风格延伸到标题和信息结构，影响阅读顺序与节奏。
使用让“使用高可读界面字体；标签、按钮和链接必须保持明确可发现性”只承担标题和层级；正文仍需满足实际阅读尺寸。
04 · COLOR SYSTEM
常见配色方案与使用比例
比例是起始建议，不是硬性规范。先用面积建立层级，再根据媒介明度和可读性微调。
#2E78C7用于背景、最大形体或主要材质，承担扁平化设计的整体气质。
#E55C55用于区分层级、支撑主体和建立冷暖或明度关系，不与主色平均竞争。
#45A984只用于标题、焦点、交互状态或关键细节；面积越小，识别信号越明确。
05 · CONTENT FIT
你的内容适合这种风格吗
先判断要表达的主题、情绪与观看预期，再决定是否使用这种风格。媒介只是载体，不应成为选择风格的唯一理由。
适合表达
这种风格的原始命题是“扁平设计在数字界面中于2000年代末至2010年代初集中普及，以简化形体、平涂综合色、图标和排版减少装饰性拟物材质。它并非完全禁止层级、渐变和阴影；过度扁平化会削弱可点击性，后续界面已重新引入受控深度线索”。当你的内容也需要讨论相近的冲突、价值或观看方式时，风格与主题才真正匹配。
适合营造
适合营造平面感、精确、清晰与结构感、网格感、明快感的观看感受。它会主动改变信息压力和观看节奏，不只是给画面增加一种气氛。
适合展示
更适合把数字产品概念、内容层级与交互状态；品牌主张、价值立场与核心产品；叙事主题、人物关系与概念设定作为核心内容；主体需要允许响应式网格、清楚层级、稳定导航和以任务为中心的界面区块和简化几何图标、一致轮廓和可辨控件状态，避免把所有元素压成同一平面参与叙事。
传播场景
适合设计展览、教育传播、品牌系统与产品说明等需要把观点组织得清楚有序的场景。
受众预期
适合重视清晰秩序、功能逻辑和现代专业感的受众；需要亲密、随性或手作温度时，应加入更柔和的信号。
选择依据
如果内容同时需要“平面、几何、网格”，并能让响应式网格、清楚层级、稳定导航和以任务为中心的界面区块、有限平涂综合色与足够文字对比，可用受控综合色变化区分状态和清楚矢量边缘、一致图标系统和适配不同屏幕的数字表面承担表达任务，这种风格是合适的；如果只是喜欢其中一种颜色，建议轻度借鉴。
06 · UNSUITABLE USES & RISKS
不适用场景与执行风险
慎用场景
当项目要求完全中性、跨文化无歧义或极高信息效率时，不宜让扁平化设计覆盖全部界面；应以轻度借鉴为主。
具体风险
- 几何秩序过强可能显得僵硬，需要通过尺度变化或留白建立呼吸感。
- 不要同时混入过多相邻风格，优先守住响应式网格、清楚层级、稳定导航和以任务为中心的界面区块和简化几何图标、一致轮廓和可辨控件状态，避免把所有元素压成同一平面。
- 先验证标题、正文和主体在小尺寸下是否清晰，再增加清楚矢量边缘、一致图标系统和适配不同屏幕的数字表面等表面效果。
07 · COMPARISON
容易与哪些风格混淆
扁平化设计 vs 瑞士国际主义
扁平化设计响应式网格、清楚层级、稳定导航和以任务为中心的界面区块；简化几何图标、一致轮廓和可辨控件状态，避免把所有元素压成同一平面；有限平涂综合色与足够文字对比，可用受控综合色变化区分状态；清楚矢量边缘、一致图标系统和适配不同屏幕的数字表面。
瑞士国际主义模数网格、非对称对齐和清楚阅读顺序，网格可见或隐含；摄影、几何形、规则线和功能性图像形成精确关系；黑白红是常见方案之一，也使用全综合色摄影、蓝黄或其他受控综合色；精确胶印、摄影网点、哑光纸、清楚裁切和有限印刷误差。
关键差异：扁平化设计的识别重心是“响应式网格、清楚层级、稳定导航和以任务为中心的界面区块；简化几何图标、一致轮廓和可辨控件状态，避免把所有元素压成同一平面；有限平涂综合色与足够文字对比，可用受控综合色变化区分状态；通常减少装饰高光，必要时以轻微阴影或层级线索支持可用性；清楚矢量边缘、一致图标系统和适配不同屏幕的数字表面”；瑞士国际主义则是“模数网格、非对称对齐和清楚阅读顺序，网格可见或隐含；摄影、几何形、规则线和功能性图像形成精确关系；黑白红是常见方案之一，也使用全综合色摄影、蓝黄或其他受控综合色；平面印刷光与摄影原有光线并置，不添加装饰性立体光效；精确胶印、摄影网点、哑光纸、清楚裁切和有限印刷误差”。先比较空间结构和边缘处理，再比较题材。
查看瑞士国际主义完整指南扁平化设计 vs 拟物化设计
扁平化设计响应式网格、清楚层级、稳定导航和以任务为中心的界面区块；简化几何图标、一致轮廓和可辨控件状态，避免把所有元素压成同一平面；有限平涂综合色与足够文字对比，可用受控综合色变化区分状态；清楚矢量边缘、一致图标系统和适配不同屏幕的数字表面。
拟物化设计界面结构映射熟悉物件、容器或操作流程，优先保证功能可理解；斜面、压印、旋钮、纸页和现实控件形态按交互用途选择；综合色模拟来源材料或功能状态，不限定暖综合色和局部高光；木、皮革、金属、纸张、玻璃等数字模拟纹理和触感线索。
关键差异：扁平化设计的识别重心是“响应式网格、清楚层级、稳定导航和以任务为中心的界面区块；简化几何图标、一致轮廓和可辨控件状态，避免把所有元素压成同一平面；有限平涂综合色与足够文字对比，可用受控综合色变化区分状态；通常减少装饰高光，必要时以轻微阴影或层级线索支持可用性；清楚矢量边缘、一致图标系统和适配不同屏幕的数字表面”；拟物化设计则是“界面结构映射熟悉物件、容器或操作流程，优先保证功能可理解；斜面、压印、旋钮、纸页和现实控件形态按交互用途选择；综合色模拟来源材料或功能状态，不限定暖综合色和局部高光；方向一致的高光、投影和遮挡建立可操作层级，不制造相互矛盾光源；木、皮革、金属、纸张、玻璃等数字模拟纹理和触感线索”。先比较空间结构和边缘处理，再比较题材。
查看拟物化设计完整指南08 · STYLE INTENSITY
风格强度变化
保留 1–2 个主基因
保留响应式网格、清楚层级、稳定导航和以任务为中心的界面区块和 #2E78C7 强调色；继续使用项目原有字体和组件，避免加入完整年代装饰。
联动 3–4 个变量
同时使用响应式网格、清楚层级、稳定导航和以任务为中心的界面区块、简化几何图标、一致轮廓和可辨控件状态，避免把所有元素压成同一平面、有限平涂综合色与足够文字对比，可用受控综合色变化区分状态和清楚矢量边缘、一致图标系统和适配不同屏幕的数字表面，但保留清晰的信息层级。
统一整套视觉语法
构图、比例、轮廓、光线、色彩、字体和材质全部遵循扁平化设计，仅适合主视觉、封面和沉浸式核心场景。
09 · MEDIA TRANSLATION
不同媒介怎样转译
同一种风格进入不同媒介时，应该保留核心基因，同时主动降低与媒介任务冲突的部分。
海报
- 必须保留
- 响应式网格、清楚层级、稳定导航和以任务为中心的界面区块、有限平涂综合色与足够文字对比，可用受控综合色变化区分状态
- 需要调整
- 把风格集中到主图和标题；正文保持高可读性，远距离先读到主题，再读到装饰细节。
品牌视觉
- 必须保留
- 简化几何图标、一致轮廓和可辨控件状态，避免把所有元素压成同一平面、主辅色比例、一个稳定的材质信号
- 需要调整
- 把复杂画面提炼成标志形、色板和版式规则；不要要求每个触点都复刻完整作品。
数字界面
- 必须保留
- 响应式网格、清楚层级、稳定导航和以任务为中心的界面区块的层级逻辑、有限平涂综合色与足够文字对比，可用受控综合色变化区分状态、局部使用清楚矢量边缘、一致图标系统和适配不同屏幕的数字表面
- 需要调整
- 降低装饰密度和纹理强度；正文、按钮、状态色及键盘焦点必须优先满足可读性和一致性。
插画
- 必须保留
- 简化几何图标、一致轮廓和可辨控件状态，避免把所有元素压成同一平面、通常减少装饰高光，必要时以轻微阴影或层级线索支持可用性、清楚矢量边缘、一致图标系统和适配不同屏幕的数字表面
- 需要调整
- 允许风格主导造型与气氛，但主体轮廓、叙事动作和前后景关系必须清楚。
10 · PROMPT RECIPE
Prompt 配方：逐项控制，而不是只写风格名
以扁平化设计作为清晰可识别的整体风格。只改变视觉处理，保持用户主体身份、数量、动作与关键结构。执行：构图采用响应式网格、清楚层级、稳定导航和以任务为中心的界面区块；将用户主体转译为简化几何图标、一致轮廓和可辨控件状态，避免把所有元素压成同一平面，保持身份与关键结构；配色限定为有限平涂综合色与足够文字对比，可用受控综合色变化区分状态；光影采用通常减少装饰高光，必要时以轻微阴影或层级线索支持可用性；材质与表面呈现为清楚矢量边缘、一致图标系统和适配不同屏幕的数字表面；仅在用户要求文字时，使用高可读界面字体；标签、按钮和链接必须保持明确可发现性，并保持原文可读。
Use Flat Design as the clearly recognizable overall style. Change only the visual treatment; preserve the supplied subjects' identity, count, action, and defining structure. Execution: compose with responsive grids, clear hierarchy, stable navigation, and task-centered interface regions; translate the supplied subjects into simplified geometric icons, consistent contours, and distinguishable control states without flattening every element equally while preserving identity and defining structure; limit the palette to limited flat color with sufficient text contrast and controlled color changes for state; use decorative highlights are reduced, while subtle shadow or depth cues may support usability when needed for lighting and tonal rendering; render materials and surfaces as clean vector edges, consistent icon systems, and digital surfaces adapting across screen sizes; only when text is requested, use highly legible interface type; labels, buttons, and links must remain explicit and discoverable, and preserve the exact readable wording.
主体残缺或重复，关键结构丢失，风格混杂，未经请求的文字，乱码，水印，品牌标志
11 · PROMPT ERRORS
常见错误 Prompt：问题在哪里，怎样修正
一个扁平化设计风格的海报，高级感，设计感，氛围感问题：只有风格名和主观形容词，没有告诉模型构图、比例、颜色、光线与材质怎样变化。
修正：至少加入“响应式网格、清楚层级、稳定导航和以任务为中心的界面区块、简化几何图标、一致轮廓和可辨控件状态，避免把所有元素压成同一平面、有限平涂综合色与足够文字对比，可用受控综合色变化区分状态、清楚矢量边缘、一致图标系统和适配不同屏幕的数字表面”。
纯平面语言、同时要求写实 3D 体积和镜面高光问题：同一控制维度出现相反要求，模型只能随机选择或折中，结果通常两边都不像。
修正：先确定扁平化设计为主风格；冲突属性只保留一项，并明确风格强度。
扁平化设计 + 瑞士国际主义 + 赛博朋克 + 极简主义 + 复古未来主义问题：堆叠多个风格名称没有说明谁控制构图、谁控制材质，容易产生拼贴式表面符号。
修正：保留扁平化设计作为结构主导；如需混合，只让瑞士国际主义负责一个明确变量，例如色彩或材质。
12 · HISTORICAL CONTEXT
历史脉络
13 · RELATED & DERIVED STYLES
来源、相邻与衍生风格
国际字体风格、现代图标和信息系统、早期数字界面及对重度拟物装饰的反应
响应式产品界面、图标与品牌插画系统，并推动Material Design等重新引入受控层级
瑞士国际主义International Typographic Style
拟物化设计Skeuomorphism
14 · REFERENCES
参考资料
以下公开资料用于核对本页的年代、概念边界与历史关系；链接指向原始机构或百科条目。