我是怎么用Codex三天做出一个微信小程序的?

我是怎么用Codex三天做出一个微信小程序的?

今天给大家介绍下,我是怎么用 Codex 三天 Vibe Coding 出一个微信小程序的?全程没有手写一行代码。

它叫「模拟手写排版助手」。

输入一段文字,或者直接导入文档,选择字体、纸张和排版效果,稍等片刻,就能生成一张自然的手写图片。

对于学生、教师等文职群里,这个工具还挺有用的,感兴趣的可以自行体验一下网页版。

https://handwrite.com.cn

什么是 Vibe Coding ?

最近 Vibe Coding 很火。

很多人对它的理解是:把需求说给 AI,等一会儿,产品就自己出来了。

真正做过完整项目后,我的感受是:它确实能大幅加快试错,但绝不是“一句话生成产品”。

这个小程序大致经历了这样一条开发链路:

产品需求↓
微信原生小程序↓
Python API 服务↓
文档解析与分页↓
Pillow 手写图片渲染↓
真机预览、保存与部署

前端使用微信原生小程序完成输入、参数选择、任务状态和结果预览。

后端没有堆很重的框架,而是使用 Python 标准库实现 HTTP API,通过 Pillow 完成纸张和文字渲染,通过 pypdf 处理文本型 PDF,并用 SQLite 保存任务和作品记录。

这个架构不算复杂,但从输入到最终图片,每一层都有不少细节。

手写效果不是“换个字体”

如果只是把一整段文字统一套上手写字体,效果通常还是太整齐。

每个字都在同一条基线上,大小完全一致,墨色没有变化,一眼就能看出是电脑排出来的。

所以在渲染阶段,我给每个字符增加了受控的随机变化:

  • 轻微的位置偏移
  • 小幅度旋转和字形变形
  • 笔画墨色变化
  • 不同字体的书写节奏
  • 可配置的随机涂改
  • 可复现的随机种子

这里最难的不是“把效果加上去”,而是控制程度。

变化太小,看起来像印刷体;变化太大,又会变得凌乱难读。

为了找到这个平衡,我反复生成了很多版,再一点点调整字体大小、行距、扰动范围和纸张参数。

下面这张《滕王阁序》,就是小程序实际生成的效果,不是后期制作的概念图。

长文本分页比想象中麻烦

短句生成一张图很容易,长文档就完全不同了。

系统需要同时考虑:

  • 当前纸张能够放多少行
  • 每行能够容纳多少字
  • 标题、署名和日期占用的高度
  • 段落缩进与换行
  • 横向与纵向纸张尺寸
  • 字体变化后宽度是否溢出

所以我单独做了页数预估与多页排版逻辑。

输入内容后,小程序会先估算页数;真正生成时,再按照同一套参数完成分页,避免预估一页、结果却突然变成三页。

Vibe Coding 给我最大的启发

以前做一个完整产品,最容易卡住的不是某一行代码,而是环节太多。

前端、后端、数据库、图片处理、部署、真机测试,每一项都不算特别难,但一个人把它们串起来,需要投入很多时间。

Vibe Coding 的价值,是把很多原本需要查资料、写样板代码和反复试验的环节压缩了。

但产品做什么、功能取舍、效果是否合格、风险边界在哪里,依然需要开发者自己判断。

所以这次项目给我的结论不是“以后不用写代码了”,而是:

一个人把想法做成产品的门槛,确实比以前低了很多。

最后

想做小程序,或者做小程序的过程中有遇到什么问题的,欢迎随时找我交流。

最后如果你有文字转手写图片、制作手写风格素材或者尝试不同纸张排版的需求,可以点击下面的小程序卡片体验一下。

https://handwrite.com.cn