产品体验

B 端产品信息密度高、界面易显厚重。从图形层面做减法，以少量元素配合文字传达核心含义，降低视觉负担，让界面回归内容呈现。

去繁化简

应用

智能云浅色与深色基于 HSB 色彩模型构建，色彩梯度更规律，便于设计师掌握与扩展，并保持色相、饱和度和亮度的一致性。

HSB色彩模型

颜色以 H（色相）、S（饱和度）、B（亮度）数值规律性递增或递减，保证品牌色、功能色等颜色的整体色调更加统一。

平台产品 控制颜色过多使用，降低视觉干扰，以使用高效为先。

应用产品 用色营造更多活泼丰富的氛围感，提升愉悦感。

平台产品应用产品

智能云深色色彩模型基于浅色色彩算法，对饱和度与明度进行运算，并以 HSB 模型制定色阶，保证色彩变化与多色亮度更加均匀。

HSB深色色彩模型

深色色彩模型针对 S（饱和度）值进行控制，避免过高饱和度的颜色在深色背景下产生光学抖动，降低眼睛疲劳。

为保证深色模式下文字、元素与背景具备足够区分度，前景色与背景色对比度需高于 WCAG 2.0 最低标准 4.5:1，确保浏览清晰可读。

临洮水利大屏项目

大屏组件模块

秉持简洁设计原则，以色彩渐变替代厚重投影与高光质感，让界面更清爽，并在高密度 B 端场景下降低视觉干扰。

渐变运用

以品牌蓝为基础向相邻色扩展，控制色彩距离，使渐变呈现干净柔和、明亮纯净的视觉效果。

根据不同业务特点，规范划定对应的渐变强度。

基础云、平台产品：收敛、克制的渐变，保证信息密度大的 B 端界面不受过多视觉干扰。

应用产品：更加开放、力度更强的渐变，为偏 C 端的产品营造活泼、年轻、亲和的氛围。

平台产品应用产品

智能云设计语言通过规律化间距与精简文字梯度，营造舒适排版节奏与清晰信息层级，帮助用户高效浏览和获取信息。

丰富且有韵律性的间距

以 4px 为最小间距单位，适配复杂 B 端界面的精密布局，并通过规律化疏密间距提升排版韵律与一致性。

页面元素的布局遵循格式塔的接近性、相似性等原则，让页面主次内容逻辑清晰、层级明确。

简洁清晰的文字梯度与对比

在界面中收敛标题字号，去掉不必要的字号，让界面的信息元素更简洁。

在界面中加大标题与常规文案字号对比，通过字号梯度对比加大，让信息层级更清晰，阅读更高效。

智能云设计语言系统化构建动效库，帮助用户快速聚焦内容重点，明确感知界面元素层级与空间关系，让交互过程更加自然愉悦。

动效设计原则

应用产品运动效果符合物理世界的真实客观运动。

灵敏交互反应灵敏，避免反应弧过长造成迟钝感。

克制动效使用恰到好处，避免过度炫技造成使用困扰。

动态时间与速度：符合人眼每次眨眼最小运动时间，元素越小运动时间越短，元素越大运动时间越长。

规范动态曲线：保证智能云全产品动效一致性。

动效库将日常产品中的动效梳理并收敛至五大类场景，全方位覆盖智能云产品场景。

大模型动效

包括对话框激活、内容进场、吐出打字机效果等场景。

元素动效

包括点赞、收藏、展开收起箭头的变化等。

运营 Banner 动效

Banner 内容进场、轮播效果。

卡片动效

产品数据卡片、基础信息卡片等场景。

加载动效

包含页面级加载、模块加载、元素加载等。