# 工业软件的 UI 为什么这么丑

我学了 10 年美术，后来写了 12 年代码。这两个身份，在工业软件里天天打架。

我见过一张截图，某 MES 的界面：宋体小字、二十几个按钮挤在一行、五个弹窗叠在一起，最上面的弹窗还挡住了它自己要填的字段。

配文是：你们做工业软件的，是不是都不在乎好看？

我说：不是不在乎，是从来没人为"好看"付过钱。

一、丑的五个原因，都不在设计师身上

第一，采购打分表里没有"好看"这一项。

功能清单、参数、案例、报价、实施周期——每一项都能打分。UI 打不了分，也没人敢打分。你敢因为"界面丑"废掉一个便宜三十万的标吗？

于是 UI 变成了"送的东西"。送的东西，不会有人投入。

第二，用的人不是买的人。

买的是信息部、采购、老板；用的是班组长、老师傅、操作工。

老板看的是报表能不能出、数据准不准；老师傅看的是"别让我多点两下"。这两个需求，都不会翻译成"把界面做好看"。

第三，现场的物理约束。

工控机 1280×1024，电阻屏，戴手套，手上有机油，车间顶灯刺眼或者背光发暗。有人的机器还是 Windows 7，显卡是集成的，浏览器是 IE 内核。

这些条件，每一条都在杀死"精致"：大留白、微动效、半透明、细字体，在现场全是负分。

第四，历史包袱。

WinForms 控件、DevExpress 默认皮肤、报表工具自带样式、十年前的外包代码。你想改一个按钮的圆角，先得确认三个页面没用同一个类名。

第五，没有正反馈。

没人会因为"这个按钮好看"给你加钱。但一定会因为"我找不到确认键"骂你。

审美的收益是隐性的，成本是显性的。理性的人都会选择不做。

二、但丑分两种

一种丑是合理的：信息密度高。

工业界面要一屏放 20 行数据、8 个指标、3 条告警。留白多了，就得翻页；翻页多了，就出错。这种"挤"，是功能，不是审美事故。

另一种丑是不合理的：

• 同一个页面，三个按钮三种圆角
• 红色既表示报警，又表示"主要按钮"
• 弹窗套弹窗，关掉最上面那个，不知道自己在哪
• 字体回退成宋体，因为 CSS 里一行声明坏了
• 错误提示写着0x80040154，不说人话

第一种我能忍，第二种我忍不了。

说个具体的。有一次全站字体突然变成了宋体，标题、表格、按钮全变。查了半天，原因是一行 CSS：字体栈的声明里混进了一段 GBK 转 UTF-8 的乱码字符，整条font-family声明因此非法，浏览器直接回落到默认衬线字体。

浏览器不报错，构建不报错，页面只是有点怪。这种丑，不是审美问题，是工程问题。

三、我做的十个取舍

这套平台现在 40 多个页面。我没有设计师，只能自己定规则。

1. 基准字号 12.5px。

不是 14，不是 16。工控机上要一屏放下足够多的行。字大了，信息就得翻页；现场最烦翻页。

2. 数字用等宽字体。

JetBrains Mono / Cascadia Code / Consolas。表格里的数字要对齐，扫一眼能比大小。比例字体里的 1 和 8 宽度不一样，一行数字看下来眼睛会累。

3. 三套主题，不是换皮。

默认蓝、意识生长（绿）、深蓝珊瑚。不同车间的光线不一样：白光车间、暖光车间、暗环境。主题是给环境用的，不是给老板换心情用的。

4. 颜色只表达状态。

红=报警，黄=预警，绿=正常。除此之外不用彩色。界面上的每一种颜色，都应该能被解释；解释不了的颜色，就是噪音。

5. 空态不转圈，给下一步。

没有数据的时候，不显示一个转圈的菊花，告诉你"还没配数据源，去这里配"。转圈是在说"我在忙"，空态应该说的是"你该干什么"。

6. 错误翻译成人话。

0x80040154后面跟一句"类未注册，去装 SimaticNET"；0x80131513后面跟一句"走错入口，要用 OPC 自动化接口"。

工业软件的报错，第一读者是现场的电工，不是写这段代码的人。

7. 滚动条在最右边，整页能滚。

听起来是废话。但工控机的屏幕小、鼠标只有一个滚轮，用户的第一反应就是"往下滚"。滚动条藏在某个内部容器里，他就以为页面到底了。

8. 大屏和工位，是两种界面。

大屏是三米外看的：字要大、颜色要少、一屏只放三五个数。工位是五十厘米看的：信息要密、操作要快、键盘能用。把大屏的样式搬到工位，效率会掉；把工位的表格放大到三米外，什么都看不清。

9. AI 干活的过程要看得见。

不是转一个圈等 30 秒，而是"正在查 3 号机的产量 → 正在算 OEE → 正在生成报告"。用户不需要看懂每一步，但他需要知道它没死。

10. 表格才是工业软件的主界面。

一个平台 80% 的时间是在看表。所以：表头必须固定；数字右对齐，单位放表头而不是每个格子里重复；行高 32px 左右，一屏能放 20 行；斑马纹要淡到几乎看不见。

表格做不好，别的都是装饰。

四、一条我坚持的规则：3 秒

任何一个界面，我都会问自己一个问题：

一个 50 岁的老师傅，戴着手套，站在强光下，隔着 50 厘米，能不能在 3 秒内找到他要的那个数？

找不到，再好看也是丑。

这条规则会杀掉很多"设计感"：大标题、插画、渐变、卡片阴影。但它能保住一件事——这个软件是给人干活用的，不是给人看的。

五、所以，工业软件的"好看"到底是什么

不是像互联网产品。

是三条：

不出错。状态清楚，确认到位，危险操作有刹车。把"删除全部数据"做成一个没有二次确认的红色按钮，再美也是灾难。

不费劲。少点击、少记忆、少等待。同一个功能，别人点五下，你点两下，这就是设计。

不吓人。报错说人话，术语有解释，第一次用的人知道从哪里开始。

这三条做到了，界面自然就"顺眼"了。反过来，只把颜色调好看，该找不到的还是找不到。

六、最后

我不追求"像互联网产品"。工业软件有它自己的体面：密度、秩序、可预期。

我只追求一件事：让一个第一次用的老师傅，不骂人。

如果哪天他跟我说"这个界面还行，比我以前用的强"，那比拿什么设计奖都值。

关于作者

在山东一家制造企业做 IT，12 年 IT、10 年艺术。一个人写了 NeoIndustrial——一套能连 30 种工业协议、让 AI 自己动手干活的平台。这个系列写的都是它上线后真实发生的事故。

作者：张成龙
NeoIndustrial 工业数据采集与智能分析平台
2026 年 11 月 4 日