Coverpage:浏览器内的在线封面制作工具
写公众号、发小红书、传抖音,每次都要为一张封面图发愁:尺寸不对、字体不好看、用别的工具又要把图传到陌生服务器。Coverpage 是为这件事造的工具——一个跑在浏览器里、图片本地处理的封面编辑器,打开就能用,用完即走。
解决什么问题
封面图的痛点不在「设计能力」,而在「场景适配」:每个平台要的尺寸不一样,同一张图裁出来效果天差地别。Coverpage 不追求万能,而是把最常见的几个场景各做一个专门的编辑器,配好默认尺寸、默认字体、安全边距,让用户只需要换文字和图,就能拿到一张「平台原生尺寸」的封面。
更关键的是,用户的图片全程在浏览器本地处理,不上传任何服务器。这是它最早定下的产品边界,也是隐私上的硬约束。
七个场景化编辑器
Coverpage 没有做成一个「万能画布」,而是拆成七个垂直场景,每个针对一个真实的尺寸需求:
- 通用场景:图片封面(覆盖 16:9、4:3、3:2、1:1、2:3、3:4、9:16 七种比例)、纯色封面、渐变封面、多图拼贴。
- 平台特化:抖音封面(舞台 540×720,默认抖音快乐体)、公众号封面(头条 2.35:1、次条 1:1,舞台 1000×562.5)、小红书封面(竖版 3:4 / 方版 1:1 / 横版 4:3,默认优设标题黑)。
七个编辑器共享同一套能力:主标题、副标题、水印三层文字均可拖拽定位;15 种字体(涵盖抖音快乐体、优设标题黑、庞门正道轻松体等中文设计字体,以及 Borel、Pacifico 两种英文手写体);导出 PNG / JPEG 两种格式,支持 2x / 3x 倍率,满足高清输出。
这种「平台特化 + 共享内核」的结构,让每个场景都能开箱即用,又不必为每个编辑器重复造轮子。
一个技术亮点:本地处理的内存治理
「图片不上传」听起来只是一句承诺,背后是一整套 Blob URL 的生命周期管理。浏览器把本地文件转成临时 URL 后,这些 URL 必须在合适时机被显式释放,否则会一直占着内存。
Coverpage 把这件事收敛成一个统一的组合式函数:新图加载成功后才释放旧 URL,加载失败立即回收,组件卸载时统一清理。配合「图片封面适配」的几何纯函数(按比例裁切、cover 适配、遮罩透明度),导出内核也被抽成单一入口——所有编辑器都走同一段「裁切区域 + 格式 + 倍率 + 文件名」的逻辑,避免每个页面各自写一套 toDataURL。这样七个编辑器在导出行为上永远保持一致,不会出现「这个编辑器能导高清、那个不能」的漂移。
把每个尺寸做扎实
Coverpage 不追求功能多,而是相信「从真实需求出发」不是口号——把七个最常见的封面尺寸各做扎实,让每个场景都不用凑合。可安装的 PWA、中英双语、明暗主题、非阻断的匿名统计(默认遵守 DNT),都是围绕「打开就能用、用完即走」这个朴素目标搭的脚手架。