dsh-arknights-splash

dsh-arknights-splash · 方舟开屏

明日方舟（Arknights）PV 视觉语言风格的 DeepSeek 开屏短片 + 全局动态背景，零依赖： 画面全部由 Canvas 2D 实时程序化绘制，音效全部由 WebAudio 实时合成，没有任何视频、图片或音频文件； 唯一的“素材”是内嵌的一段 DeepSeek 官方鲸鱼 SVG path 字符串与 Windows 自带字体。

• 开屏：页面加载时播放约 12 秒的有声短片（黑场 → 启动自检 → 标题砸落 → 干员档案 / 鲸鱼线描 → 信号故障 → 标志锁定 → 链路建立 → CRT 关机），点击画面任意处随时跳过， 片尾（或跳过时）交叉溶解进入界面。
• 背景：同一套视觉语言的无声循环动效层，铺满整个界面，透明度可在设置里实时调整。 内容密度按「黑客仪表盘 × 明日方舟 HUD」做：左右两条数据雨 + 终端滚动日志 + 解码滚字 + 示波器 + 雷达扫描 + 数据包计数 + hex dump + 目标锁定框 + 移动数据流 + 网络拓扑图 + 等高线地图 + 底部跑马灯 + 角标刻度与红色危险条；底色仍保持方舟的黑 / 纸白 / 朱红 / PRTS 青。
• 实用面板（右侧，压在雷达上方）：本地时间 HH:MM:SS（带 60 格秒环）、日期 + 星期、农历日期、 今日/本周/今年进度条、今年剩余天数、UTC 时间与 UNIX 时间戳、页面在线时长、渲染帧率与视口分辨率。
• 设置页：设置 → 方舟开屏。可开关开屏、重播、开关背景、调透明度、开关音效。

---

安装

从 GitHub

在 DSH 里打开 设置 → 插件 → 添加插件，粘贴：

github:18518182595-cell/dsh-arknights-splash#main

装完后完全退出并重新打开 DSH：桌面版的客户端模块注入表是宿主启动时收集一次的快照， 只刷新页面不一定够。

从本地目录（开发）

克隆本仓库后，在 设置 → 插件 → 添加插件 里选择仓库目录（package.json 所在目录）。 修改 parts/ 后执行 node scripts/build.mjs 重新生成 client.js。

使用

位置	行为
页面加载	播放开屏短片（有声）。点任意处 / Esc / Enter / Space 立即跳过
短片结束	最后 1.7 秒与界面交叉溶解；背景动效层同步淡入
设置 → 方舟开屏	开机播放开关（下次打开页面生效）、重新播放、背景开关、不透明度、音效开关

• 背景层默认不透明度 35%。这是叠在界面上的动效层（不修改宿主 DOM / 主题 CSS），用 mix-blend-mode: screen（暗色主题）/ multiply（亮色主题）融入，视觉上等同动态背景， 同时不会遮挡任何控件与文字。0% = 完全隐藏。
• 浏览器/Electron 若阻止自动播放，开屏左下角会出现「开启音效」按钮，点一下即可（绝不打断跳过逻辑）。
• 与 dsh-video-skin 并行时会有两段开机动画。二选一：去 设置 → 视频皮肤 关掉它的「开机动画」， 或禁用那个 bundle。本插件的背景层可以单独开关，不与它抢 DOM。

实现

parts/00-head.js        单文件 Client bundle 的 __ModuleLoader__ 外壳 + React
parts/10-audio.js       WebAudio 合成引擎（14 种音效，无采样）      ← parts/10-audio.notes.md
parts/20-film.js        调色板 / 数学 / Canvas 绘制原语 / 鲸鱼路径 / 精灵缓存
parts/22-splash.js      12 秒开屏分镜（7 幕 + 片尾 CRT）
parts/24-ambient.js     主题自适应的无声循环背景层
parts/30-ui.js          设置存储、播放器（时钟/音效 cue/跳过/溶解/重播）、
                        shell.overlay 全屏层、settings.section 设置页
parts/90-foot.js        导出 apply / inject
client.js               由 scripts/build.mjs 拼装（唯一被宿主加载的文件）

• 客户端 bundle 契约：window.__ModuleLoader__.load({ id: 'dsh-arknights-splash', factory })， id 必须等于包名；factory 内只 require('react')；slot 服务走 ctx.get('slots')。 不要手改 client.js，改 parts/ 后重新构建。
• 样式由 apply 注入一个 <style data-plugin="dsh-arknights-splash">，随插件卸载移除。
• 设置持久化：localStorage['dsh-arknights-splash:v1']（不进 profile 配置，卸载即失效）。
• 渲染：开屏用 1600×900 设计空间做 16:9 letterbox；背景层用整屏坐标、DPR 上限 1.25、结束后 30 fps 节流。切后台暂停绘制，document.hidden 恢复后不跳帧。

开发

node scripts/build.mjs          # parts/*.js → client.js
node test/film.smoke.mjs        # 逻辑冒烟：注册/时间线/生命周期/跳过/重播/透明度（不验证画面）
node test/whale-path.mjs        # 校验内嵌鲸鱼 path 与调研记录逐字节一致

• 修改后生效：向 ~/.dsh/profiles/desktop/cordis.patch.yml 追加一行注释触发 profile 重组合 （需要工作区外写权限），或完全重启 DSH；客户端 bundle 的变化通常要刷新页面才进已打开的页面。
• 右下角小按钮 / 设置页均可调背景透明度；document.hidden 时暂停绘制，背景层 30 fps 节流。
• 排查用 window.__DSH_ARKNIGHTS_SPLASH__（splash / ambient 渲染器、player、settings）。
• Host 半只提供一个本机回环的诊断端点（不涉及任何外部网络）：
  • GET /dsh-arknights-splash/health · GET /dsh-arknights-splash/status（客户端上报的渲染/音频/主题/画布采样）
  • GET /dsh-arknights-splash/graph（客户端 bundle rev）
  • GET|POST /dsh-arknights-splash/rebuild（把刚构建的 client.js 发布到模块图）

设计来源

• 调色板与排版取自明日方舟官方站点 / @yunyoujun/ak-ui 设计 token： 墨黑 #05070A、纸白 #E8ECF0、朱红 #F6540E、金 #F1C644、PRTS 青 #18D1FF、深红 #B0243B。
• 鲸鱼标志：DeepSeek 官方仓库 packages/client/ui-primitives/src/BrandWordmark.tsx 的 24×24 path （与 Simple Icons / LobeHub 图标同一绘制），非重构图形。片尾唯一一处 DeepSeek 蓝 #4D6BFE 只作为极低透明度的辉光。
• 视觉语言为致敬/模仿（扫描线、颗粒、硬切、切片故障、档案排版、角标与刻度），未包含任何 明日方舟素材文件；音效为 WebAudio 合成，非采样。

已知限制

• 作者开发环境没有浏览器截图通道，因此画面与音频的实际观感未做像素级验证；逻辑冒烟测试覆盖 注册、时间线、生命周期、跳过/重播/透明度，以及逐帧 draw 调用不抛错、无 NaN。观感以真机为准。
• 背景层是覆盖层而非 z-order 底层（宿主没有提供背景 slot，也不应改宿主 DOM）， 透明度与混合模式承担“融入”职责。
• 采用系统字体，不同 Windows 版本的 Bahnschrift / Cascadia Mono 字宽略有差异。

License

MIT（见 LICENSE）。DeepSeek 鲸鱼图形取自 DeepSeek 官方仓库，作为指向 DeepSeek 的品牌标识使用； 明日方舟视觉语言为致敬性模仿，本仓库不包含任何明日方舟素材文件。