我见过太多工厂里的真实现状操作员站在触摸屏前手指悬在半空犹豫半天不知道该点哪里或者干脆拿对讲机喊电气工程师过来帮忙操作。HMI人机界面本该是人与设备之间的桥梁结果却成了横在中间的“劝退师”。问题不在设备而在交互体验设计。这篇内容写给所有做自动化项目、画HMI画面的朋友无论是用博图TIA Portal、WinCC还是其他组态软件我希望通过这篇文章帮你把HMI从“能用”做到“好用”甚至让操作员愿意主动用、用得顺手。尤其是那些刚接手HMI项目的工程师或者正在被“画面没人愿意看”困扰的团队这篇内容值得你从头读到尾。1. 先泼盆冷水你的HMI可能正在“劝退”操作员1.1 被忽略的“工业审美疲劳”很多人觉得HMI就是个“工程图”画出来能看就行。但你去车间转一圈就会发现操作员一天八小时盯着的就是那块屏幕。屏幕上的字体大小、颜色对比、按钮位置、弹窗方式直接决定了他今天的心情和工作效率。2014年我做过一个项目给一条汽车轮毂产线做HMI改造。老线用的还是单色屏加物理按钮操作员说“习惯了没啥问题”。换上新触摸屏后画面被工程师塞满了各种数据框和趋势图操作员反而开始抱怨“眼睛累”“找不到按钮”。这就是典型的“技术升级但体验降级”——你把所有信息都堆上去了但操作员真正关心的启动、停止、急停、切换这几个动作反而被淹没在数据海洋里。这个案例给了我一个深刻的教训工业HMI不是给工程师做报表用的是给操作员干活用的。设计的第一原则不是信息密度而是操作的流畅度。1.2 交互体验差的五个典型症状结合我这些年调研和亲自下场改造的十几个项目我把“劝退型HMI”的特征总结为五条你看看自己的项目中了几个第一层级过深。要启动一台泵得先点“主菜单”再点“设备1”再点“控制”再点“启动”中间还要过两次确认弹窗。操作员在紧急情况下根本记不住路径。第二按钮尺寸不符合人体工学。触摸屏不是鼠标手指头不是光标。博图默认的按钮尺寸偏小实际工业触摸屏使用中按钮最小建议做到40×40像素以上否则戴手套或者手上有油的状态下极易误触。第三反馈缺失或者反馈延迟。按了按钮没反应既不闪烁也不变色连声音提示都没有。操作员就会觉得“是不是没按上”于是又补按了一下。这一下可能就触发了两次动作。第四颜色滥用。红绿黄蓝全往上堆报警用红色、正常运行也用红色操作员直接视觉疲劳。国标GB/T 4025中对信号颜色有明确建议红色用于急停和报警黄色用于注意绿色用于正常运行这些颜色语义不能随便乱用。第五文字表达晦涩。满屏幕的PLC变量名、寄存器地址、英文缩写操作员看不懂只能靠死记硬背。真正的好HMI应该让一个第一次接触的人也能在五分钟内搞清楚基本操作。2. 从“能用”到“好用”HMI设计的底层逻辑2.1 信息架构先想清楚操作员要看什么我把HMI画面的角色分成三个层次常驻信息、操作入口、诊断内容。常驻信息是操作员每时每刻都要看到的——设备状态、当前产量、正在运行的工位操作入口是高频动作——启停、复位、切换、模式选择诊断内容才是报警记录、趋势分析、参数设置这些低频但重要的信息。这三个层次对应的画面布局完全不同。常驻信息放在主画面最核心的位置字体要大、颜色要稳操作入口放在边缘容易点击的位置而且高频按钮要固定在同一个位置不能因为页面切换而“跑掉”诊断内容收进二级或三级页面入口放在主画面的固定角落。我见过一个做得特别好的项目人家把启动和停止按钮做成了物理尺寸的两倍大放在画面右下角——因为操作员右手操作居多右下角是最容易够到的位置。这就是信息架构设计不是画完就完事而是顺着人的使用习惯去排布。2.2 色彩与视觉不是越花哨越好工业HMI的画面配色我推荐“低饱和、高对比、少颜色”。背景用浅灰或者深蓝灰色不要用纯白——纯白在车间强光下反光严重长时间盯屏非常刺眼。文字用黑色或者白色与背景保持足够对比度。状态颜色严格遵循语义红色只用于报警和急停黄色用于警告或待确认状态绿色用于运行或正常蓝色或灰色用于停止或不可用状态。如果你把“设备停止”也做成红色那操作员一屏看过去全是红的真正需要他在意的故障反而被淹没了。另外字体选择也很有讲究。中文建议用微软雅黑或者宋体加粗英文字体用Arial字号在运行画面里不要小于16px。行间距要拉开不然多行报警信息挤成一团看起来极其费力。还有一个细节动画不要太花哨。有些工程师喜欢给按钮加“呼吸灯”效果或者让水泵图标旋转。如果是强调运行状态轻微动画可以接受但如果所有东西都在动那就是视觉噪音。人眼对运动物体天生敏感所有元素都在动等于什么都没突出。2.3 反馈与防错让误操作无从下手好的HMI必须给操作员“手感和听觉”。按下按钮后的反馈分三层视觉反馈——按钮变色、按下凹陷状态反馈——设备真实状态变化比如电机图标从灰变绿声音反馈——触摸成功时的短促“滴”声这个可以配合PUSH或Horn输出在博图里可以配置系统报警声音。防错设计更是重头戏。破坏性操作要做二次确认比如“急停”之外的“停止产线”“清空配方”这类动作必须在弹窗里明确显示操作后果并且默认焦点放在“取消”上防止直接敲回车误触发。我还在一些高风险项目里做过“长按三秒启动”防误触设计效果很好。安全联锁的逻辑不要只放PLC里HMI层也要有软联锁提示。比如某台设备不具备启动条件按钮置灰并在旁边显示“条件不满足液压压力低”这样操作员不会一次又一次地按一个没反应的按钮也不会误以为设备坏了。3. 实操用虚拟HMI把设计跑起来3.1 为什么我推荐“虚拟HMI”先行很多自动化项目里HMI画面往往等PLC程序写完、甚至现场调试时才开始做。这时候出了问题只能现场改耗时费力还容易引入新bug。我的建议是画面设计和PLC程序同步开展用虚拟HMI在电脑上先跑起来。所谓虚拟HMI就是把触摸屏的程序在PC上用一个仿真窗口运行通过模拟PLC或者真实PLC通讯来验证画面的逻辑。博图TIA Portal里集成了一套仿真工具不需要真实触摸屏硬件就能直接模拟运行。如果你用的是威纶通、昆仑通态或者其他第三方触摸屏它们各自的组态软件也基本都有离线仿真功能。虚拟仿真的优势很明显第一开发阶段就能验证按钮逻辑和画面跳转避免写完几百个画面才发现入口链接错了第二可以做“演示模式”给客户或者领导看方案时直接在笔记本上跑比放PPT有说服力得多第三方便培训操作员——把虚拟画面架在办公室电脑上操作员可以边看边练不用占用产线时间。3.2 博图仿真关键配置步骤我用博图V17做例子说一下虚拟HMI仿真的基本流程。第一步在TIA Portal项目树里创建一个HMI设备选具体型号比如TP900 Comfort或者KTP700 Basic版本要和实际硬件一致。第二步在HMI的“连接”设置里配置与PLC的S7通讯连接填写PLC的IP地址和机架槽位注意和仿真PLC的IP保持一致。第三步编写画面添加IO域、按钮、指示灯这些对象把变量全部关联到PLC符号表里的变量。然后点击仿真按钮博图会自动编译并启动HMI Runtime Simulator。重点来了这里要确保PLC仿真也同时运行否则画面里的变量没有数据源你会看到所有IO域都是“###########”或者显示0。仿真过程中HMI和PLC是走虚拟以太网通讯的不需要额外配置PG/PC接口。但需要注意防火墙——Windows防火墙如果拦截了仿真器的网络通讯会导致连接断开这种情况建议把TIA Portal相关进程加入白名单。3.3 高频坑位博图HMI仿真按钮无反应有网友经常问“博图HMI仿真按钮无反应怎么办”这个我踩过不止一次坑今天把排查思路全部理一遍。第一个排查方向按钮的事件是不是真的配置了。很多人从工具箱拖一个按钮出来就以为它能用了但博图里的按钮只是一个图形元素你得双击它在“事件”选项卡里添加“按下”或“释放”事件并关联一个函数列表比如置位某个变量或者切换画面。如果事件是空的按钮自然没有反应。第二个排查方向变量连接是否正确。按钮关联的程序块变量如果是未连接的或者地址冲突仿真时写入就会失败。建议在PLC符号表里确认变量存在、类型一致、没有重复地址。注意位、字节、字的关键字——置位用“置位位”块写入值用“置位字”块搞错类型也会没反应。第三个排查方向PLC和HMI的地址区。你在HMI里写的变量是PLC地址不是HMI内部地址。如果你把IP、网段设置正确了但还是连不上那可以看看PLC是否处于STOP状态——仿真PLC如果停留在STOP模式不会刷新输出按钮按下去画面里的变量状态也不会变。第四个情况比较诡异按钮有反应但画面里的指示灯不变化。这种多半是变量名称映射错了。博图里HMI变量和PLC变量是两个体系HMI变量需要在“HMI变量”表里新建并关联PLC变量。如果指示灯用的是HMI变量本身而不是PLC变量那它永远不会变化。这些排查点我建议你做成一个检查清单每遇到“按钮无反应”就先按顺序过一遍效率比漫无目的地乱点高很多。4. 场景实战一仓储工位轮毂选择画面4.1 需求分析与画面布局仓储工位轮毂选择这个场景在汽车零部件产线很常见。操作员需要通过HMI选择某个仓储工位并且把对应的轮毂型号、数量、加工状态显示出来。如果做得不好操作员在几十个工位之间找轮毂能找半天我见过最夸张的一个现场操作员拿着一张打印的工位对照表一边看纸一边点屏幕。做这个画面之前先把需求拆清楚。第一操作员需要快速定位几十个工位不可能全部平铺必须提供两种选择方式——直接选择工位号数字键盘输入或按型号筛选下拉列表。第二当前工位状态要一眼可见空位、占用、加工中、完成用颜色区分。第三选定后的操作要清晰选中的工位要有明显的高亮框并且在画面底部显示“当前选定工位12——轮毂A型——库存25件”防止选错。画面布局建议左侧为工位列表用紧凑的网格或者表格形式每个单元格显示工位号和状态颜色右侧为选中工位的详细信息区包括轮毂型号、数量、当前工序、最近操作时间底部为操作按钮区放置“确认选择”“取消”“刷新列表”。这样布局符合从左到右的阅读习惯也适合触屏操作。4.2 数据绑定与脚本实现这个画面的核心变量包括工位号Int、轮毂型号String、数量Int、工位状态Int0空 1占用 2加工中 3完成。这里的关键技巧在于不要给每个工位建一组变量那几十个工位就会爆表。正确做法是建两个数组变量——工位状态数组和工位数据数组HMI画面用一个列表控件把数据源绑定到PLC的数组。在TIA Portal里HMI的“表格视图”支持多行显示数据集合你可以把工位列表控件关联到一个UDT结构数组。这样扩展工位数量时只要修改PLC的数组上限画面自动跟着变不用重新一个个画格子。选择高亮的实现逻辑在工位列表控件的“选择变化”事件里触发一个函数把选中的行号写入“当前选择工位号”变量。PLC收到后根据这个工位号把对应的工件数据写入“选择工位详情”结构回传给HMI显示。这个“先选中—再查询—后回显”的过程比把所有数据都一次性拉到HMI里更高效也避免几十个工位数据同时刷新带来的画面卡顿。这里特别提醒一下模拟量或者字符串回显的时序问题PLC扫描周期是毫秒级HMI画面刷新也是周期性的如果操作员快速切换工位HMI把上一个工位的数据闪一下再变成下一个视觉上就会“跳变”。解决方法在HMI脚本里做“当前选择工位”变量变化时的数据有效性校验或者给详情区加一个短暂的时间戳显示“更新于xx:xx:xx”让操作员知道数据对应的时刻。轮毂型号用字符串变量时注意编码格式。博图HMI默认支持UTF-8和Unicode但如果PLC里用的是String类型长度只有固定字节数。如果你的型号是“WHEEL-A-17寸”超过长度就会截断。稳妥做法是型号统一存成代码表HMI画面上只显示代码需要看完整名称时再通过“翻译”表映射。4.3 “自行设计HMI画面”的落地思路“编写虚拟HMI程序自行设计HMI画面”这个话题涉及一个从零到一的完整过程。以仓储工位选择为例第一步画出线框草图把工位列表、详情、按钮三个区域定下来第二步在TIA Portal里建立HMI项目设置通讯第三步创建画面布局把草图转成实际控件第四步配置数据绑定和事件函数第五步启动仿真验证流程。这里我强调一个阶段容易被忽略的点设计HMI画面之前先和机械、工艺、电气三方面对齐一个东西——操作员到底有哪些“流程动作”。比如仓储工位选择操作员的完整工作流是登录系统→查看工位列表→选择目标工位→确认→扫描轮毂条码→绑定工位→开始加工→标记完成。如果把“选择工位”单独拿出来设计一定做不好。必须把前后动作都画出泳道图你的画面才能贴合真实操作。5. 场景实战二三种液体混合控制5.1 工艺需求与控制逻辑拆解三种液体混合是一个经典的PLC教学项目也是实际生产里常见的配料场景。三种原料液分别由三台泵或三个电磁阀控制注入同一个搅拌罐三种液体的注入量可以按配方设定混合完成后搅拌一段时间然后排出成品。这个场景的HMI设计要点和仓储工位完全不同。情绪上操作员面对的是“过程控制”关注的是实时液位、阀门状态、搅拌状态、配方参数、过程阶段。所以画面要把“流程图”做出来而不是只堆一堆IO点。我建议的画面结构分四块顶部为工艺流程图用一个罐体的示意图形加上三条进料管道、一个搅拌桨动画、一个排料阀中部为阶段状态区用大号文字显示当前阶段——注料A/注料B/注料C/搅拌/排料/完成底部为配方参数区三个流量设定值和总液位上限右侧角落放报警区只显示当前激活的报警。5.2 配方管理、动画反馈与报警逻辑配方管理是这种场景最核心的功能。HMI上的配方功能有两种实现方式第一种用博图自带的配方管理系统把配方数据存储在HMI的存储卡或者PLC的数据块中第二种全部放在PLC的数据块里由HMI写入配方号PLC根据配方号从数据块读取各个注量。我建议中小项目用第二种——数据管理逻辑简单易调试。在PLC里建一个配方数据块结构如下配方编号1注A量5L注B量3L注C量2L搅拌时间60秒。HMI画面做一个配方下拉框操作员选择“配方01”后把对应配方号写入PLCPLC扫描到配方号变化后自动把配方内容送回到HMI显示确认。确认无误后操作员点击“开始混合”PLC控制注入。动画反馈是三种液体混合画面最大的加分项。进料管道里的液体流动可以用一条动态线表示或者用一个“滑块”在管道上来回移动。博图里可以给图形对象添加内部动画也可以在脚本里通过“移动”函数控制运动。搅拌桨做旋转动画用图形对象的旋转角度属性不断递增。液位的反馈用罐体内的填充矩形的尺寸变化来模拟绑定液位计的模拟量值。报警逻辑的痛点在于“重量级报警和轻量级提示要分开”。液位高高限、搅拌电机过载这类必须触发蜂鸣器和弹窗而“配方参数未确认”“注入量偏差较大”这类只需要黄色提示条。如果所有报警都用同一个红色弹窗操作员迟早会麻木。5.3 仿真中的变量同步与“假数据”技巧三种液体混合HMI仿真时如果没有实物PLC最实用的办法是写一个“模拟量发生器”程序在PLC的OB1里用定时器控制几个模拟量——比如液位从0缓慢涨到设定值泵状态按顺序置位复位。然后把HMI绑定的变量全指向这些模拟用的变量。这样你在HMI仿真画面里就能看到液位慢慢上升、搅拌浆旋转、阀门变绿整个动态流程非常真实。做这种模拟的时候注意一个细节模拟程序要单独放在一个FC或FB里用一个“仿真模式”布尔量开关控制是否启用。等到现场调试时把仿真模式关掉HMI画面直接切换到真实I/O不用改任何画面变量。我踩过一个坑仿真程序放到OB300循环中断组织块里中断周期设得太短导致模拟液位变化太快画面上的液位显示“跳变”。后来我把模拟逻辑放到OB1主循环组织块里用一个“模拟加速系数”控制变化速率比如每100毫秒液位加0.1%就能看到平滑的上升效果。模拟数据的平滑度直接影响操作员对画面的信任感跳变的数据会让人觉得HMI卡顿或者计算错误。6. 常见问题与排查技巧实录6.1 “HMI画面显示错乱”的排查思路HMI画面在仿真和实际运行时偶尔会显示错乱——文字变成方框、图形重叠、按钮错位。这类问题的根源往往不是画了错而是字体和分辨率匹配出了问题。中文显示成方框基本就是运行系统缺少中文字库。博图HMI运行时有一个“语言与字体”设置你必须把中文勾选为“可下载语言”并且确保操作系统安装了对应字体包。分辨率错位的典型情况是你在电脑上用了1366×768的画面分辨率但HMI设备实际分辨率是800×480没有启用“自动缩放”功能画面就会被截断。博图设备的“显示设置”里有画面适配选项可以按比例缩放但缩放会导致控件边界模糊。稳妥做法是先确认目标硬件的最终分辨率再按那个分辨率画画面并且把画面网格对齐不要让控件“悬空”在一个非整数坐标上。6.2 “HMI和PLC通讯频繁断线”的排查思路这个现象在工业现场太常见了。先看网线和交换机这是排查的第一优先级——工业现场的环境干扰和网线老化导致的物理层不稳定远比想象中多。再看IP地址和子网掩码HMI和PLC必须在同一网段同时不能有别的设备抢IP。最后检查PLC的通讯负载——如果PLC CPU的通讯利用率长时间超过70%就会出现报文超时。还有一个容易忽略的工具——“在线诊断”视图。TIA Portal的诊断面板里能看到HMI连接的实时状态包括循环次数和错误计数。如果错误计数不断累加说明链路不稳定但还没断这时候可以检查是不是HMI画面里的变量刷新周期设置得过短。把不需要高频刷新的变量改成“按需刷新”或者延长到1秒以上通讯负载就能降下来。6.3 经典误区速查表我把这些年HMI设计踩过的高频坑整理成一张速查表方便你对照自查现象常见原因正确做法画面字体变成方框缺少中文字库勾选下载中文字库确认字体嵌入按钮按了没反应事件未配置/变量未连接按“事件→函数→变量”三步排查画面显示不完整分辨率不匹配按目标硬件分辨率设计启用缩放数据刷新太慢变量刷新周期过长高频变量周期设100~500ms低频变量按需刷新报警一直闪烁不消失报警确认逻辑缺失配置“确认”操作区分激活/已确认状态按钮位置“漂移”画面用绝对定位而非模板布局用固定模板或结构变量统一布局触摸时偏移屏幕校准丢失重新校准触摸屏调整校准参数误触发严重按钮过小/无确认按钮做到40×40以上破坏性动作二次确认这张表我几个项目共用每次设计评审前过一遍能挡掉一大批低级问题。7. 把HMI当“人”来养我的几个实操心得说到这我想分享一点个人体会。HMI的交互体验升级不是一次性画完就完事的“设计”而是持续迭代的“养护”。第一每次现场调试都要留意操作员的真实操作习惯。我看见过有些操作员习惯左手操作有些则戴着湿手套有些人老年眼花。一个HMI设计再好如果和实际使用者的习惯冲突那还是会被“劝退”。我在现场的一个经验是项目上线后的前两周我会每天抽半小时站在操作员身后什么都不说就看着他们操作看他们哪里犹豫、哪里点错、哪里要试两遍。这些观察比任何需求评审会都有价值。第二HMI的画面模板最好版本化管理。我习惯每个项目都维护一套“标准模板库”包括主模板、子画面模板、报警窗口模板。新项目直接在模板上改既保证风格统一又削减了重复劳动。模板库要用WinCC或者博图的“库”功能管理方便团队其他成员调用。第三别怕推翻重来。有一次我做的配方画面彻底推翻了三次才满意。第一次太拥挤第二次功能全但操作路径太长第三次才做到“选配方-确认-启动”三步完成。好HMI是改出来的不是一次画出来的。第四给未来留好扩展。工厂需求永远在变。画面布局要预留空白区域变量表里要保留备用地址配方数据块里宁可多留几组空配方。这样下一次需求来的时候你只需要在原有基础上“加料”而不是推翻重新画。最后说一个真实的小技巧HMI画面的启动画面不要放公司Logo占整屏。启动画面最好放“操作说明”四要素——设备名称、当前日期时间、操作员登录入口、当前画面名称。很多工程师喜欢放一个大的品牌Logo好看但没有用。真正关心效率的操作员开机后第一眼想看到的是“我现在在哪个画面”“现在几点”“我是谁”。做HMI这件事表面上是在画画面实际上是在替设备“表达”。设备不会说话HMI就是它的嘴和表情。你要是把它做成一堆冷冰冰的按钮和数据框设备再先进也显得笨拙你要是把它的交互设计做好了操作员会感觉自己是在开一辆顺手的好车而不是在跟一个坏脾气的机器较劲。希望这篇内容能让你下次打开TIA Portal时有一点点不一样的想法。