四种 AI 产品的
视觉语法

黑底、薄荷绿、角色阵列

黑底建立技术氛围，绿色承担 CTA 与能力强调；多个 3D 机器人以职业道具区分角色，让“多 Agent”无需解释即可被看见。

能力导航明确，任务入口聚焦

• 左侧列出任务、专家、技能、连接器与资料库。
• 中央用欢迎状态、场景开关和技能标签降低首次使用成本。
• 图标与文字配对，适合能力数量较多的 Agent 产品。

游戏化企业科技

值得学习

用角色、任务和最终文件表达 Agent 的价值；复杂能力使用清晰分组，不把全部入口塞进一个“+”菜单。

注意风险

官网 IP 与霓虹信息量很高，若原样进入工作页面，会压低专业阅读效率；桌面客户端心智也不适用于 PmWork 云端页面。

转译为红圈

保留“Agent 有身份”和“结果可交付”，但 IP 缩成头像、状态和空页面反馈；工作区以任务节点而非角色海报为主。

稳定黑白，发布视觉可变

产品浅色主题以白、黑与低透明度灰构成层级，#1783FF 只做链接、状态和反馈。Kimi Work 把 0、1、K 与箭头排成稀疏点阵，并围出中央留白；K3 的磁场粒子环与研究桌面则属于发布主题，不应被当成常驻 UI 纹理。

系统字体，导航—画布两区

• 官网与产品均使用中性无衬线，依靠字号、粗细和留白建立秩序。
• 约 240px 左侧导航承载会话、任务与能力；中央保持大面积空白画布。
• 研究页窄正文、宽媒体；产品页低密度、主入口居中。

软边界，不靠厚卡片

• Composer 圆角约 24px，能力胶囊约 20px。
• 分隔线使用约 13% 黑，次级填充约 3% 黑。
• 线性图标与文字成对，按钮优先黑白，仅状态使用蓝色。
• 组件层级来自留白与细描边，而非强阴影。

单入口，多能力，渐进披露

Composer 是唯一任务起点；能力先以导航与快捷胶囊出现，模型和思考强度负责表达成本/质量，附件与插件继续收在“+”入口。专业结果以文档、PPT、表格、网站和组件离开聊天文本。

传播层强，工作层弱

K3 发布页以粒子汇聚、循环场线和大媒体切换制造“长程智能”的感受；工作界面只保留悬停、展开、执行状态与结果生成反馈。动效的职责是说明运行与层级，而不是持续制造科技氛围。

选择成本会随能力增长

导航、模型、强度、Agent、插件、技能同时出现，首次决策成本明显上升；匿名首页已经出现能力入口重复。PmWork 应保留任务语义，隐藏模型术语，并避免把 K3 的粒子场和蓝色直接移植进企业工作台。

品牌退后，任务内容上前

产品外壳几乎完全由黑、白、浅灰构成。OpenAI 官方将 OpenAI Sans 定义为“几何精度＋圆润亲和”；真实颜色主要来自文件类型、应用图标、生成图片和用户内容。

一个画布，两种工作意图

• 顶端 Chat / Work 分段控件先定义任务意图，再进入 Composer。
• 超大留白压低首次决策压力；任务参数收在输入框底部和尾端。
• 侧栏负责搜索、Projects、Library、Scheduled 与 Plugins，中心画布保持专注。

同一套软容器，承载不同复杂度

• Composer、分段控件、菜单与目录搜索共用大圆角和 1px 灰边。
• 图标保持单色线性；第三方应用保留各自品牌图标。
• 模型和推理强度压缩为尾端文本参数，不再统治页面标题。
• 重要动作依赖文字、图标和状态，不依赖强品牌色。

把“任务方式”放在模型之前

用普通语言区分即时问答与长任务，让模型、成本和强度成为二级参数；默认路径只暴露完成当前目标所需的最少选择。

展示行动，不展示思维链

Work 允许查看进度、回答问题、改变方向和批准重要动作。值得借鉴的是可操作的执行记录，而不是伪装成透明度的思考动画。

形成红圈四层任务面

顶部选“快速处理 / 深度执行”；项目提供资料和规则；插件变成企业连接器；红线节点承载进度与审批；最终沉淀为可编辑任务单、报告和看板。

暖纸、陶土橙、手绘思考

衬线大标题拉开与科技品牌的距离；不规则手绘图形与太阳/星芒标识强调人的思考，而不是算力和速度。

对话旁边就是作品

• Artifact 让文档、代码、图表与网页成为独立可编辑区域。
• 内容版本、导出、发布与继续修改形成完整产物流。
• 文字行宽、段落节奏和暖色背景服务长时间阅读。

人文编辑＋可编辑产物

值得学习

把长内容当作品设计，而非聊天气泡；右侧产物区清晰区分“AI 过程”和“用户最终要交付的东西”。

注意风险

暖米白、陶土橙、衬线字已经高度属于 Claude；若直接借用会产生明显仿制感，也不匹配红圈品牌。

转译为红圈

借右侧 Artifact 逻辑，不借暖橙视觉。PmWork 产物区使用冷白纸面、红色版本节点和清晰的审批/导出控制。