我是一个独立开发者，每次做完一个新功能或者上线一个小产品，都绕不开同一个关卡：  
**“好，现在得录一个像样的 demo 了……”**  
然后流程大概是这样：

- 再去装一个新的录屏软件  
- 调半天音频输入 / 系统声音  
- 不小心录进一堆乱七八糟的标签页、通知  
- 录完才发现有敏感信息没遮住，只能重录  
- 就为了裁一下画面、加个箭头、高亮一下，还得开一个单独的视频编辑器

做多了几次以后我发现：  
我花在“跟工具搏斗”上的时间，已经快赶上做功能本身了。  
但我真正的需求其实挺朴素的：  
就想搞定几件事—— **产品演示、简单教程、发社交媒体的短视频**，干净、清晰、好看一点就行。

于是我做了一个很多开发者都会做的“不太理智”的决定：  
在很忙的情况下，自己又造了一个轮子。😅

这个工具叫 **Screentell**，核心想法就是：  
> 用浏览器就能完成录制 + 简单编辑，搞定 90% 的 demo 需求。  
> 不追求专业剪辑，追求“够用”和“省心”。

不用安装软件，不用开桌面应用，直接浏览器搞定。

---

### 它大概能做些什么？（以及我为什么这样做）

#### 🎥 录制  
我最想要的是：点一下“开始”，不要想太多设置。

- 可以同时录 **屏幕 + 摄像头**  
- 支持 **系统声音 + 麦克风** 一起录（比如你讲解的时候，软件的声音也能进）

#### ✂️ 编辑（直接在浏览器里）  
我平时需要的编辑，其实更偏“演示展示”而不是剪电影，所以主要做了这几类：

- **裁剪录制区域**：  
录完后可以把浏览器标签栏、任务栏、乱七八糟的边边角角裁掉，只留下真正的内容区域，也顺手避开敏感信息。  
- **聚焦放大**：  
比如点击某个按钮的时候，镜头会平滑放大到那个区域，让观众知道“此刻该看哪儿”。

#### 🎨 贴纸和标注  
实际录 demo 的时候，基本都会想加一点“这里很重要”的强调，所以我做了：

- **手绘风格贴纸**：  
箭头、下划线、对话气泡、各种形状和文字，还可以贴图片。适合做那种 “点这里”、“这个地方有更新”、“看这个细节”的标注，不用再去开别的设计工具。

#### 🖼️ 布局和整体观感  
我也挺在意视频整体看起来是不是“顺眼”的，尤其是发到社交媒体或做产品更新的时候：

- 可以选择 **背景**：纯色、渐变或者一些壁纸风格的背景  
- 屏幕画面可以做成一个有 **内边距 + 阴影** 的卡片，整体看起来比较现代一点  
- **人脸摄像头** 是一个独立图层：  
想开就开，想关就关，位置、大小、形状都可以调整（左下角讲解框那种效果）

总之目标就是：  
**做出一个你愿意放在 landing page、推特 / 小红书 / B 站、产品更新里的视频，但又不需要去学专业剪辑软件。**

---

### 适合谁？  
大概是这些场景：

- 录 **产品演示 / 功能发布**  
- 做 **教程 / Onboarding 小视频**  
- 想为自己的产品或工作流做一点 **轻量的分享内容**

然后你又不太想：  
- 装一堆桌面软件  
- 或者打开复杂的时间轴编辑器

那 Screentell 可能会比较对胃口。

一切都在浏览器里完成： **录制 → 编辑 → 导出**，摸索几分钟就能上手。

这个工具完全是从我自己作为独立开发者的需求出发做的，现在肯定还有很多我没想到的场景和坑。

如果你也经常需要录屏，我其实更好奇的是：

- 你现在录 demo 最烦的步骤是哪一块？  
- 你现在用的工具，有哪件事一直做得不够好？

分享  
最后更新：2025年12月3日