【中秋国庆 VibeCoding】白剪纸风中秋贺卡生成器

一个中秋贺卡生成器。输入收件人名字、祝福语、署名,选一种剪纸图案。

它解决了什么假期问题

中秋想给亲友发祝福,但群发显得敷衍,自己做又不会设计。这个工具让不会 PS 的人,也能做出一张有剪纸质感的中秋贺卡。

作品截图 / 体验链接

体验链接:

中秋贺卡生成器 · 剪一张窗花,寄一份心意.html (136.1 KB)

使用 TraeCode 创作的过程截图

然后就是无休止的修改

创作分享

最费劲的是剪纸的质感。

一开始做出来就是普通的红色图案,没有剪纸的感觉。后来跟 TraeCode 说「要像真的剪纸窗花,有镂空、有毛边、有层叠感、有投影」,它帮我用 SVG 的 path 重新画了图案,加了镂空和轻微的边缘不规则。

配色也调了好几次。一开始想用红金配色,但金色太抢眼,压不住。后来改成正红 + 米白,对比强烈,更像剪纸。金色只用在印章和描边上,做点缀。

保存图片偏灰是个坑。html2canvas 对 CSS 渐变支持不好,截图出来灰蒙蒙的。后来换成 html-to-image,问题解决了。动图用的是 MediaRecorder 录制 Canvas 流,录出来是 MP4,文件比 GIF 小很多。

四种剪纸图案(玉兔望月、桂花开、双喜临门、团圆月)都是用 SVG 手画的 path,前后调了十几版。最难的是让图案对称但不呆板,像手工剪出来的。

6 个赞

这个和我的好像噢 但是你的分格是剪纸的 有新意

5 个赞