Skip to content

Souls-R/GetDeck

Repository files navigation

GetDeck

Bilibili Discord

GetDeck 是一个 Master Duel 卡组截图识别,卡组码生成以及分享的工具。

上传卡组截图后GetDeck 会自动识别每张卡片以供查看,还可以一键生成卡组码,方便导入游戏使用,也能生成带二维码与卡组码的分享截图。

你可以在这里直接使用: https://get-deck.com

主要功能

  • 所有识别和处理均在本地浏览器完成,不上传图片
  • 识别准确率高,速度快,支持桌面和移动端
  • 支持 Master Duel 卡组码导出与分享

技术栈包括 Next.js、React、Tailwind CSS、ONNX Runtime Web、Rust WebAssembly、pHash 等。

识别流程:上传截图后,先进行图像预处理,再用 YOLO 检测卡片位置,裁剪卡图并提取感知哈希,最后与本地数据库比对,输出识别结果。

卡片哈希数据通过 CI/CD 自动生成,保证数据库及时更新。卡片图片直接从游戏资源获取,保证与游戏一致。

体验优化

性能加载

  • 通过资源预加载、并行下载和动态CDN选择,显著提升应用的初始加载速度。
  • 首屏加载优化,允许用户在模型没有完全加载时就开始上传图片和查看结果,减少等待时间。
  • 在下载模型文件过久时显示进度条,以提供及时的用户反馈。

交互与操作

  • 优化了画布的拖拽与缩放操作,并为移动端提供了专门的手势支持,方便查看截图细节。
  • 支持使用键盘方向键在识别的卡片间快速导航,提升桌面端操作效率。
  • 记忆用户在卡片列表中的滚动位置,无需在返回时重新寻找。
  • 自动判断是否需要裁剪,引导用户更精确地选择识别区域,提高识别成功率。

自行部署:

  1. 安装依赖:npm install
  2. 启动开发:npm run dev
  3. 构建生产:npm run build

所有处理均在本地完成,图片不会被收集。

致谢

About

Master Duel 卡组截图识别&卡组码生成&分享工具

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors