VibeCoding 下的第一个完整项目 Page-Smith.com

发布于 2026-06-29

产品调研与设计 -> 技术与细节 -> 市场与推广

产品

Page-Smith.com 是一个书籍/报告/论文/漫画/OCR的翻译服务，基本可做到保持布局稳定。

背景

事情起因很简单，我有时候会找些书看，有些是英文版，有些有中文版但阉割严重，所以就想着找到英文版本自己翻成中文读起来更顺畅。我尝试找一些翻译服务，但是看了下价格，感觉不划算太贵，一本书翻译动辄就要几美元，确实太贵了。

于是我做了下市场调研，翻译类产品其实很多，单词、短句、作文翻译比比皆是，但当市场缩小到更垂直的领域，比如书籍翻译或者pdf翻译，竞争者开始变少，有一些比如booktranslator，translateabook，而且在Pdf场景下，不少效果也开始变差。而利润部分，当时我粗算了下，毛利很高，如果只考虑AI翻译费用，可以做到80%甚至更高（这里其实是坑，后面会补充）。而基于SimilarWeb分析粗折算，这些网站的MRR应该有几千美元。

考虑到项目并不复杂(最初！)，用AI来做应该不会太难，所以想着跑个全流程，看看能做到多少收益。

基本上就让Google Stitch 帮我做了多个版本的设计，选中了其中一个后又进行了细节设计 ，于是就有了整个项目的原型。

在项目早期，我只做了图书翻译，支持不同的style参数，通过控制LLM System来让翻译产生不同的风格。但是很快我就发现个问题 - 毫无亮点和难度。我在Example页面也只能做一个多语言的Style List，我自己都觉得乏味。但当我尝试扔进去一篇图表公式论文的时候，渲染全乱了，所以开始开始仔细研究pdf的协议，从而衍生了报告/论文/漫画/OCR等场景的翻译。

技术

技术选型

涉及的技术清单如下：

• 部署 - Vercel
• 技术栈
  • PDF处理：python（负责pdf的解析处理，主要是PyMuPDF用于解析pdf）负责pdf处理的细节
  • 前端+后端：Hono+React，
  • 数据库：Supabase
  • 认证：Supabase auth
• 文件存储 - Cloudflare - R2
• 支付 - Paddle
• OCR - PaddleOCR
• 数据分析 - Posthog

先说说为什么做这些技术选型，我的基本要求很简单：个人友好 + 免费。

其中选择Vercel是因为自己很熟悉，没起量的时候免费很划算。PyMuPDF属于没得选。而后端没选用Nextjs则是因为我有太多项目使用Nextjs，它很方便，但不少时候也很冗杂，所以我选择了轻量的Hono+React。这次新了解到的一个点是Vercel支持Python和Hono的Edge混部，所以用起来很舒服。

数据库选用Supabase，是因为Supabase Auth配合Supabase很方便，基本上主流的Provider它都支持。不过Vercel免费版只支持两个Supabase实例，我另外一个项目不得不采用Neon+Firebase来处理数据库和登录问题。

对于文件存储，最初我选用了Vercel Blob，很不幸，我连测试都没跑多少就超了免费额度，所以干脆迁移到了Cloudflare R2上，免费比较多。

而对于OCR，目前最好的是百度的PaddleOCR，识别效果好，免费额度很高，自己部署也很方便。

支付采用Paddle则有个重要的原因，他对个人开发者友好。Stripe对很多地区需要公司才可以使用。

对于Posthog，我只想说，如果你不知道Posthog，那你肯定需要Posthog！绝对是新手OPC最好的伙伴！

一些难点

在文档翻译中，有两个难处理的事情：

1. PDF协议。主要是它的渲染协议是采用类似画布渲染的方式，很多编码直接指定哪块内容在哪个位置，所以无法按照从上到下的去按顺序解析内容，有可能你早解析的内容，其实是在文档的最底部。所以这个比较有挑战难度。目前的解决逻辑，其实就是by页面识别，遇到文本的就流式向下渲染。遇到部分复杂的，比如文本混合图表，文本block流式渲染，图表采用类似OCR的方式处理。而对于非常复杂的，则采用全页OCR。当然这只是大思路，边界case依然很多。

2. 翻译本身 - 因为问题1中的原因，内容会被拆的很碎然后丢失给大模型，导致无法保证翻译的一致性。比如一会叫章三，一会叫张三。这个解法相对好做，提前解析文档所有文本，让AI理解后产出关键词映射表，做好映射。后面翻译的时候，带着这些映射即可。当然这个会导致token耗费增加。不同的模型在处理这个映射时候存在差别，但整体来说要比单页翻译要好不少。

运营

这部分是我之前不熟悉的，我知道怎么做产品，知道怎么做技术，但是我不知道如何获取用户。目前我走了三个阶段，想分别聊聊。

Step1 发布到 Producthunt

发布到 Producthunt 后，我收到了可能有十几封邮件，有一个用户期望沟通如何实现pdf保持布局渲染的，其他基本都是推销自己的平台，或者是youtuber期望帮助录制宣传视频，不过大都是收费服务，所以我都拒绝了。在 Producthunt 发布后，我又去 X 上做了些发布，收到了一些访问，但无人注册。

Step2 发布到相关产品社区

我基于邮箱收到的发布产品的邀请以及自己找的一些网站，使用 Claude 的浏览器操作能力，让它帮我去做网站的注册、发布。实话说，全自动操作，不过有些网站我提交产品信息，居然要排队到 2027 年才可以发布，但是给 $8 立刻帮你发布，真是神奇。本身这些产品产品的权重就很低，完全不值得这么做。

Step3 Google AD

某天和朋友遛娃，他建议试试 GoogleAD，少投入点钱看看效果，如果收支能打平就可以加大投入。当天晚上我就开通了 GoogleAD 并做了部署。第二天就有流量过来，ctr 1.36%，单次点击 $0.14，并不算贵。通过 Vercel Analytics，我发现用户大多来自移动端且大都在日本，用户在日本大概率是因为 Google 投广告了，但我的产品其实更适合桌面端。基于这个信息，我将广告投放改成桌面端，之后 ctr 降低到0.6%。我怀疑是因为桌面更不容易错触。之后我添加部分相关关键词，优化广告素材后（增加AI视频广告），ctr 隔天来到了 8.5%，我都怀疑有人故意刷广告，简直离谱，CPC是 $0.24！不过之后几天数据慢慢就下来了，ctr 降低到2.29%, CPC变成 $0.28。

很不幸，虽然用户会进入页面，但是没人注册，更无购买。

期间我依然在不停的打磨产品，降低交互门槛，在更明显的位置给出翻译效果，提升用户信任。但是依然看不到用户行为变化。之后我尝试补充打点来丰富信息，不过 Vercel Analytics 的功能我感觉到都不太够。之后就是发现了 Posthog。Posthog 比较有用的是 SessionReplay，这个功能能让我“窥屏”到用户的交互行为，知道他们在哪里停下来，知道用户对什么感兴趣。这对于优化产品有很大的帮助。

继续努力，等待新进展～