工业粗野主义终端UI设计

问题：高数据密度场景下的界面同质化

现代 Web 界面普遍追求柔和圆润的消费级审美，导致高信息密度场景（如工程仪表盘、监控终端）的视觉表达严重同质化。这类设计不仅削弱了复杂数据的传达效率，也无法传递应有的机械精度与专业感。工程师在构建数据密集型界面时，常需在视觉风格统一与信息清晰度之间反复妥协。

技能如何工作：从视觉原型到工程实现

该技能通过严格的视觉约束与程序化模拟，构建具备机械刚性的数字环境：

• 视觉原型单一化：每个项目必须在“Swiss Industrial Print”（浅色底、巨型粗体无衬线、危险红强调）或“Tactical Telemetry & CRT Terminal”（深色底、等宽字体、扫描线效果）中选择其一，严禁混合。
• 极端的字体架构：宏观标题使用 clamp(4rem, 10vw, 15rem) 等大尺寸流体排版，字间距极紧（-0.03em 至 -0.06em）；遥测数据则固定为 10px-14px 的等宽字体，字间距宽松（0.05em 至 0.1em），且全部大写。
• 不妥协的色彩与布局：仅允许使用单一底色（如 #F4F4F0 或 #0A0A0A），严禁渐变与半透明。布局依赖 CSS Grid 与 1px 实线边框进行刚性区隔，完全拒绝圆角（border-radius）。
• 模拟硬件退化：通过 SVG 滤镜与 CSS（如 repeating-linear-gradient）注入半色调、1位抖动与 CRT 扫描线，消除纯粹的数字感。

适用边界与注意点

设计系统强调绝对的单一性与一致性。严禁在同一界面中混合浅色与深色底色，或交替使用两种视觉原型。模拟退化效果仅用于增强视觉层次，绝不能牺牲核心数据的可读性。