Recordly 是一款开源桌面屏幕录制 + 演示视频编辑器，目标是在本地一站式做出类似 Screen Studio 的精致 Demo 视频（自动缩放、光标美化、画框背景、摄像头气泡、时间线剪辑），无需专业剪辑技能。
- 官网：https://recordly.dev
- 当前版本：v1.3.3（2026-05-28）
- 热度：约 1.62 万 Star、约 1.15k Fork、102 Issues、36 PR、1525+ commits
产品价值与对标
| 维度 | 说明 |
|---|---|
| 对标产品 | Screen Studio 等「演示向录屏」工具 |
| 差异化 | 完全开源、AGPL 3.0、跨 macOS / Windows / Linux |
| 用户场景 | 产品 Demo、操作讲解、教程、营销短片 |
| 工作流 | 录屏 → 内置编辑器润色 → 导出 MP4/GIF，中间用 .recordly 项目文件保存状态 |
README 写明：项目最初 fork 自 OpenScreen，但超过 80% 代码已分叉演进，缩放动画等能力来自早期版本迁移。
技术架构
捕获层编辑层渲染/导出Electron 主流程macOS ScreenCaptureKitWindows WGC + WASAPILinux Electron API时间线: 缩放/裁剪/变速/注释光标 + 摄像头样式PixiJS 场景合成MP4 / GIF 导出
技术栈（来自 package.json 与语言统计）
| 层级 | 技术 |
|---|---|
| 桌面壳 | Electron 39 + electron-builder |
| 前端 UI | React 18 + Vite 5 + TypeScript |
| 样式 | Tailwind CSS + Radix UI |
| 场景渲染 | PixiJS 8（预览与导出共用同一套场景逻辑） |
| 动画 | GSAP、Motion |
| 时间线 | dnd-timeline |
| 音视频 | ffmpeg-static、mediabunny、mp4box、web-demuxer |
| 原生能力 | C++/Swift/CUDA 辅助模块（约 83% TS + 7% C++ + 4% JS + 4% CUDA 等） |
| 质量工具 | Biome、Vitest |
平台原生捕获策略
| 平台 | 最低版本 | 捕获方式 |
|---|---|---|
| macOS | 14.0 (Sonoma) | ScreenCaptureKit（含系统/麦克风音频） |
| Windows | Build 19041+ | Windows Graphics Capture (WGC) + WASAPI |
| Linux | 现代发行版 | Electron 捕获；系统音频通常需 PipeWire |
构建时会编译多类 native helpers（Windows 捕获、GPU 导出、NVIDIA CUDA compositor、光标监控、Whisper runtime 等），说明导出性能是重点投入方向。
核心功能拆解
1. 录制
- 全屏或单窗口
- 麦克风 + 系统音频（平台能力不同）
- 录完直接进入编辑器
- 可打开已有录像或
.recordly项目
2. 演示向编辑（区别于普通录屏）
- 自动/手动缩放：根据光标活动建议 zoom 区域
- 光标叠加：平滑、运动模糊、点击弹跳、摆动、循环模式、macOS 风格光标素材
- 摄像头气泡：预设/自定义位置、镜像、圆角、阴影、可随 zoom 联动
- 画面样式：壁纸、纯色、渐变、留白、圆角、模糊、阴影、宽高比预设
- 时间线：裁剪、变速、注释（文字/图/形）、额外音轨、裁切
3. 导出
- MP4、GIF（质量、帧率、循环、尺寸可调）
- 导出后可在系统文件管理器中定位文件
4. 扩展生态（重要差异化）
- 社区 Extension API：在渲染管线注册 hook、光标效果、壁纸、设备边框、设置面板等
- 扩展市场：Recordly Marketplace
- 本地扩展目录：
userData/extensions，仓库内有extension-examples/ - 权限模型：
render/cursor/audio/timeline/ui/assets/export
仓库结构（主要目录）
| 目录/文件 | 作用 |
|---|---|
src/ |
React 前端与编辑器逻辑 |
electron/ |
Electron 主进程 |
build/、scripts/ |
原生模块与打包脚本 |
branding/、icons/、docs/media/ |
品牌与文档素材 |
extension-examples/ |
扩展示例 |
recordly.rb |
可能用于 Homebrew 等分发 |
README.zh-CN.md |
中文文档 |
安装与开发
用户使用
- Releases：https://github.com/webadderallorg/Recordly/releases
- Arch：
yay -S recordly-bin（维护在独立recordly-aur仓库）
开发者
git clone https://github.com/webadderallorg/Recordly.git recordly
cd recordly
npm install
npm run dev # 开发
npm run build # 全平台打包
npm run build:win # 仅 Windows
Windows 前置：VS 2022 + C++ 工作负载 + CMake
Linux 前置：build-essential、cmake、X11 相关 dev 包
macOS 本地构建：可能需要 xattr -rd com.apple.quarantine 解除隔离
快速上手（Windows 示例）
方式一：直接下 Release（推荐新手）
从 Releases 下载安装包，录屏 → 停止 → 进编辑器 → 导出。
方式二：从源码跑开发环境
git clone https://github.com/webadderallorg/Recordly.git
cd Recordly
npm install
npm run install:electron # 若 Electron 二进制未下载完整
npm run dev
注意：
- 建议使用 Node.js ≥ 22.12（
@electron/rebuild有引擎要求） - 路径尽量不要放在
Program Files等带空格、易锁文件的目录；例如E:\dev\recordly更省心 - 国内网络可配置
.npmrc使用 npmmirror 的 Electron / PhantomJS 镜像
典型工作流：
- 选择显示器或窗口，配置麦克风 / 系统音
- 录制 → 自动进入编辑器
- 调整 zoom、光标、背景、摄像头（可选）
- 导出 MP4 或 GIF
平台限制（选型时要清楚）
| 问题 | macOS | Windows | Linux |
|---|---|---|---|
| 隐藏真实系统光标 | ✅ ScreenCaptureKit | ✅ 需 19041+ 原生 helper | ❌ 不支持 |
| 系统音频 | ✅ 14.0+ SCK | ✅ WASAPI | 通常需 PipeWire |
| 双光标风险 | 低 | 旧系统回退 Electron 时可能可见真光标 | 真光标 + 渲染光标可能同时出现 |
总结评价
优势
- 功能完整度高：录屏 + 时间线 + 演示动效 + 导出，接近商业 Demo 工具闭环
- 跨平台且在各平台尽量用原生捕获（非纯 Electron 录屏）
- PixiJS 统一预览/导出，减少「预览和成片不一致」
- 扩展市场 具备长期生态潜力
- 中文 README、活跃 Issue/PR，社区热度高
需注意
- AGPL：若要把代码嵌进闭源产品或 SaaS，需法务评估
- Linux 光标与捕获仍是短板
- 构建复杂：含 C++/CUDA 原生模块，从源码编译门槛高于普通 Electron 应用
- 仓库体积大（API 显示约 326MB），克隆与 CI 成本较高