EVA STYLE UI DESIGN SKILL 是一套专为受《新世纪福音战士》(Neon Genesis Evangelion)中监控器、战术屏幕及控制室美学启发的界面设计而开发的工具技能。该技能旨在帮助设计师和开发者快速构建具有强烈赛博朋克与军事工业风格的用户界面,融合高信息密度、硬边框架与动态视觉元素,营造出沉浸式的科幻操作环境。通过系统化的设计原则与组件规则,它支持从前端实现到组件生成的全流程工作流,适用于需要模拟真实作战中心或高科技实验室场景的项目。其核心目标是打破传统 SaaS 界面的柔和与友好感,转而追求一种冷峻、高效且充满未来感的交互体验。 该技能基于一套完整的设计体系构建,包括视觉方向锁定、系统规则定义、动效规范、模式语言以及数据元素库等模块。使用者首先需参考 `style-principles.md` 确立整体视觉基调,再结合 `tokens.md`、`typography.md` 和 `motion.md` 中的色彩、字体与动画规则进行系统化应用。随后,借助 `pattern-language.md` 和 `data-elements.md` 建立非文本的视觉语法结构,如条纹、刻度、网格、括号等元素,强化信息层级而不依赖间距或阴影。最终依据 `component-rules.md` 构建或审查 UI 组件,并利用 `prompt-recipes.md` 自动生成页面或模块原型。同时,必须规避 `anti-patterns.md` 中列出的失败模式,确保输出符合 EVA 风格的一致性标准。 此外,项目提供了 `example-lab/index.html` 作为可运行的示例实验室,供用户直接用于原型开发、演示展示或组件提取。整个技能包强调结构化布局、模块化重复使用以及对装饰性渐变的审慎使用——仅当其能传达状态、热量、扫描或能量行为时才允许出现。这种严谨而富有表现力的设计语言,使得 EVA STYLE UI DESIGN SKILL 成为打造科幻主题产品、游戏 HUD、监控系统或沉浸式数据仪表板的理想选择。
核心功能特点
- 高信息密度布局,避免软卡片与宽松间距,采用硬边框架与密集视觉元素
- 红橙色为主调的状态驱动配色系统,辅以特定数据模式下的其他色调
- 技术向紧凑排版结合条纹、刻度、网格等图形化模式语言强化信息层级
- 仪器风格的运动动画,提升界面动态反馈的真实感与科技感
- 提供完整设计体系文档,涵盖视觉原则、组件规则、动效指南与反模式清单
- 内置示例实验室,支持快速原型搭建与组件提取复用
适用场景
EVA STYLE UI DESIGN SKILL 特别适合那些需要营造高科技、军事化或科幻氛围的界面设计场景。例如,在开发一款以机甲操控为核心的游戏时,该技能可用于构建驾驶舱内的 HUD 界面,通过红色警报条、数字滚动条与校准网格展现实时战斗数据,增强玩家的临场感与紧张情绪。同样,在制作虚拟实验室或科研模拟软件时,其高信息密度的布局与结构化模块能有效呈现复杂实验参数与监测指标,使操作者仿佛置身于真实的控制中心之中。 对于企业级监控平台或运维管理系统而言,该技能同样极具价值。它能够替代传统的仪表盘卡片,转而使用轨道式标签、阈值指示器与条纹背景来组织多维度数据流,提升关键指标的辨识度与响应速度。特别是在网络安全、电力调度或航天控制类应用中,EVA 风格的界面不仅美观独特,更能通过视觉符号传递紧急状态与系统负载,辅助决策者快速判断局势。 此外,该技能也适用于艺术创作与品牌视觉系统开发。无论是独立开发者希望为作品注入强烈的赛博朋克美学,还是设计团队致力于打造差异化品牌形象,EVA STYLE UI 都能提供一套可复用的组件库与设计规范,确保跨平台体验的一致性。只要项目目标包含‘未来感’‘专业性’或‘操作导向’任一特质,这套工具都将显著提升界面的整体质感与功能性。
