// UI DESIGN KIT · SITE-7█

基金会:深井协议 — UI 设计套件

SCP 机密档案终端 × WH grimdark。一站式入口:规范 / 屏幕 / 动效 / 模板 / 工作流 / 概念锚。新页用 ui-theme.css 起手,进 UE 落 UCSUITheme

规范

设计系统 · StyleGuide

色板/语义/分类色 · 基础尺度 · 全组件 · 表单/反馈 · 无障碍 · 文案语气

预览

屏幕布局 · Screens(12 屏)

主界面/HUD/背包(纸娃娃)/属性/搜刮/合成/档案/死亡归档/合作大厅/设置/地图/对话

交易

S0 请购终端 · Requisition(6 页)

购买(解锁门控)/回收/仓库(个人安全)/保险/升级/状态 · 请购点经济,对齐 SD_49

委托

委托板 · Commission(3 页)

接取/进行中/历史 · 回收/调查/击杀/开启 + 下层随机事件 + 主线小Boss,发请购点,对齐 SD_50

任务

任务 HUD 与日志 · QuestHUD

屏上目标追踪器 + 任务日志(主线/支线/隐藏) + 完成/解锁/奖励 Toast

弹窗

经济/委托 · 弹窗与二级界面

购买/出售/仓库/保险/升级确认 + 接受/交付委托 + 商品/委托详情二级卡 + 各级 Toast/Alert

加载

加载屏 · Loading(下行深度计)

读存档/进游戏/切场景共用:电梯井底图 + 深度轨逐层下降 + 解密日志 + 全套动效/声效

开机

开机屏 · Boot(进入游戏)

正式进入游戏前:基金会终端冷启动 + SCP 旋转徽记 + 站点名 + 系统自检日志 + 拖拽声效

撤离

撤离屏 · Evac(上行/疏散)

脱离收容区回地表:红色警报 + 收容失效 + 逃生倒计时 + 深度计反向上行 + 拖拽声效

动效

动效库 · Motion

6 组 ~26 个可复用动效,点卡片重播,标注时长/缓动

起手

起手模板 · Template

复制即开新屏:已引 ui-theme.css + 16:9 frame + 面板骨架

流程

工作流 · Workflow

美术基调→设计系统→ControlNet 概念锚→屏幕→动效→UE 的可复用流程 + 命令

共享

共享样式 · ui-theme.css

整套 tokens + 组件 + 动效关键帧,<link> 即复用

概念

纸娃娃立绘 · D-Class

ControlNet 出的玩家立绘(兜帽拾荒者),用于背包纸娃娃

相关

宣传站 · PromoSite

对外宣传单页(已上线 scp-abyss.com),同一 grimdark 终端美术

生成管线:本地 ComfyUI + Scripts/ConceptArt/(Z-Image + WH LoRA + ControlNet)。
校验:Scripts/ConceptArt/check_promosite.py(标签/资源/括号/残留词)。
本套为美术基调与布局预览,非最终游戏内 UI;配图为本地 AI 占位。© 项目组 · 开发中。