dsh-arknights-splash:方舟风格程序化开屏与全局动态背景

前言

DeepSeek Harness(DSH)的 Web 界面默认偏工具向,开机动画与聊天背景往往要换主题包或挂视频资源。dsh-arknights-splash 走的是另一条路:用 Canvas 2D 实时绘制画面、用 WebAudio 实时合成音效,不附带任何视频、图片或音频文件,只在浏览器里跑一套明日方舟(Arknights)PV 视觉语言风格的开屏短片和全局循环背景。下面介绍它是什么、怎么装、日常怎么用,以及和同类插件并存时要注意什么。

这是什么

  • 名称:dsh-arknights-splash(方舟开屏)
  • 维护者:18518182595-cell
  • 分类:趣味换装(社区目录 SkillHub 插件页)
  • 版本:1.0.0(见仓库 package.json)
  • 许可证:MIT

插件为 DSH Web UI 提供两件事:页面加载时约 12 秒的有声开屏短片,以及铺满界面的无声循环动效层;另有一块压在雷达区域上的实用信息面板。素材层面仅内嵌 DeepSeek 官方鲸鱼 SVG path 与系统字体,零 npm 运行时依赖。

核心功能

开屏短片

页面加载时播放约 12 秒有声短片,分镜大致为:黑场 → 启动自检 → 标题砸落 → 干员档案 / 鲸鱼线描 → 信号故障 → 标志锁定 → 链路建立 → CRT 关机。

  • 点击画面任意处,或按 Esc / Enter / Space,可随时跳过。
  • 片尾(或跳过时)与主界面交叉溶解进入;背景动效层同步淡入。
  • 浏览器或 Electron 若阻止自动播放,开屏左下角会出现「开启音效」按钮,点一下即可,不打断跳过逻辑。

全局背景层

同一套视觉语言的无声循环层,叠在整个界面上,不修改宿主 DOM 或主题 CSS。内容密度按「黑客仪表盘 × 明日方舟 HUD」组织,包括数据雨、终端日志、示波器、雷达、hex dump、跑马灯等元素;底色沿用方舟常用的黑、纸白、朱红、PRTS 青等 token。

  • 默认不透明度 35%;0% 为完全隐藏。
  • 暗色主题用 mix-blend-mode: screen,亮色主题用 multiply,尽量不挡控件与文字。
  • 切到后台(document.hidden)时暂停绘制;结束后背景层以约 30 fps 节流渲染。

实用面板

叠在背景右侧(压在雷达上方),展示:本地时间(带 60 格秒环)、日期与星期、农历、今日/本周/今年进度、今年剩余天数、UTC 与 UNIX 时间戳、页面在线时长、帧率与视口分辨率等。

设置项

路径:设置 → 方舟开屏。可开关开屏(下次打开页面生效)、重播、开关背景、调节透明度、开关音效。配置写在 localStorage['dsh-arknights-splash:v1'],不进 profile;卸载插件后失效。

安装与启用

DSH 采用「一切皆插件」的扩展方式;社区目录在 SkillHub,与 DeepSeek / 幻方无官方从属关系。安装前建议浏览 GitHub 仓库 源码与 LICENSE,插件在当前 dsh 进程权限下运行。

从 GitHub 安装

  1. 在 DSH 中打开 设置 → 插件 → 添加插件。
  2. 粘贴下面这一行(须与官方 README 一致):
github:18518182595-cell/dsh-arknights-splash#main
  1. 装完后完全退出并重新打开 DSH。桌面版客户端模块注入表在宿主启动时收集一次,只刷新页面不一定足够。

本地开发时可在「添加插件」里选择克隆后的仓库目录(package.json 所在目录);改 parts/ 后需执行 node scripts/build.mjs 生成 client.js,该步骤面向维护者,普通用户用 GitHub 引用即可。

典型用法

位置 行为
页面加载 播放开屏短片(有声);点任意处或 Esc / Enter / Space 立即跳过
短片结束 最后约 1.7 秒与界面交叉溶解;背景动效层淡入
设置 → 方舟开屏 开机播放、重播、背景开关、不透明度、音效开关

与 dsh-video-skin 同时启用时,可能出现两段开机动画。二选一:在 设置 → 视频皮肤 关掉对方的「开机动画」,或禁用该 bundle;本插件背景可单独开关,不与对方抢 DOM。

排查时可在控制台使用 window.__DSH_ARKNIGHTS_SPLASH__(含 splash、ambient 渲染器、player、settings)。宿主还提供本机回环诊断路由(不涉及外网),例如 GET /dsh-arknights-splash/health、GET /dsh-arknights-splash/status 等,详见仓库 README。

实现要点(了解即可)

客户端以单文件 bundle client.js 由 scripts/build.mjs 从 parts/ 拼装;契约为 window.__ModuleLoader__.load({ id: 'dsh-arknights-splash', factory }),id 须与包名一致。开屏在 1600×900 设计空间做 16:9 letterbox;音效为 14 种 WebAudio 合成,无采样。视觉为对明日方舟官方站点与社区设计 token 的致敬性模仿,仓库内不含明日方舟素材文件;鲸鱼图形取自 DeepSeek 官方 UI primitives。

作者说明:开发环境缺少浏览器截图通道,画面与音频未做像素级验证;逻辑冒烟测试覆盖注册、时间线、跳过/重播/透明度等。观感以真机为准。背景层是覆盖层而非底层 slot,依赖透明度与混合模式融入界面;系统字体在不同 Windows 版本上字宽可能略有差异。

结尾

dsh-arknights-splash 适合想在 DSH 里获得一套零媒体文件、可跳过、可调的方舟风开屏与 HUD 背景的用户。安装命令以 README 为准,装后建议全量重启 DSH。

羽毛球分组比赛记分
小程序二维码

欢迎使用《羽毛球分组比赛记分》微信小程序

小夜