把自己的喜好，变成电子闺蜜，随时记录

用 WorkBuddy 从零搭一个「个人配方记录 App」——业余烘焙爱好者的实操记录

标签：#WorkBuddy #效率工具 #无代码 #个人项目

一、为什么做这个

我业余自学做面包，从吐司、欧包到小甜点都折腾过。时间一长发现一个毛病：成功的配方散落在各处——笔记本里几张、和朋友的聊天记录里几张、脑子里还记着几张。每次想复刻一个做过的款，都要翻半天。

于是想做个小东西，叫「阿麦的面包房」。核心诉求很简单：

• 按系列管理配方：吐司系列、咸口面包、甜口面包、蛋糕系列
• 每个系列从一个空货架开始，随时往里加自己实践过的新配方
• 一个配方要能记：展示图、产品名、食材清单、烘焙时长/温度/份量、制作步骤（可配图）、烘焙小笔记
• 一个轻量的「烘焙打卡」页，记当日心情和作品照片
• 底部导航：首页 / 打卡 / 知识

视觉上我喜欢明亮、温馨、浅色、大气的暖色调——像面包店橱窗那种感觉。

我不是程序员，也写不动复杂代码。这事我交给 WorkBuddy 来干。

二、第一步：把需求一次说清楚

需求越清楚，来回越少，越省积分。我新建一个任务，切到 Craft 模式（你说我做的那种），把需求整段贴进去：

把字段、导航、视觉风格一次性交代清楚，比挤牙膏式提问省一大笔积分。

三、第二步：先出信息架构和数据模型

我没急着要界面，而是让它先把数据结构理出来。因为后面所有页面都围着这个转，结构对了，迭代就顺。

这一步把「食材清单、烘焙参数、步骤可配图、小笔记」这些字段定下来，正好对应我列的需求。

四、第三步：生成原型 + 本地预览

结构定了，我让它直接出可运行原型。起手用单文件 HTML + CSS + JS（好预览、好迭代），先生成首页和配方详情页。

📸 截图：WorkBuddy 生成代码 + 右侧预览

生成完，它在右侧结果区直接给我预览——暖色调、卡片式配方货架、底部三个 tab。当场就能看效果，不用切到别的工具。

五、第四步：迭代细节

第一版肯定不完美。我盯着预览，挑刺让它改：

• 配方卡片想更大、留白多一点（要"大气"）
• 系列切换做成顶部横滑的标签
• 打卡页的心情想用表情图标，不要文字单选
• 配色再暖一点，底色从纯白改成奶油色

📸 截图：第一版 vs 调整后版本对比

每一条都指到具体位置，它改得快。关键是一次说清要改什么，别「再好看点」「再大气点」这种模糊话——模糊话最容易反复来回、反复烧积分。

六、第五步：用图片生成补展示图

配方卡片要有展示图才像橱窗。我用 WorkBuddy 的图片生成，按系列批量出占位展示图：

• 吐司系列：刚出炉的切片吐司，暖光
• 咸口面包：表面撒料的咸口欧包
• 甜口面包：淋了糖霜的小餐包
• 蛋糕系列：戚风切面，奶油色背景

提示词里把「暖色调、明亮、橱窗感」这些风格词带上，出图风格就统一了。生成时记得先确认 prompt 再批量出图，省积分。

📸 截图：按系列生成的一组配方展示图

七、成品效果

搭完大概是这么个样子：

📸 截图：首页货架 / 配方详情 / 打卡页 三张拼图

• 首页：四列系列货架，点进去看配方
• 配方详情：展示图、食材、烘焙参数、可配图的步骤、小笔记
• 打卡页：选心情、传当天作品照、记几句感想

八、几条掏心窝的经验

1. 身份文件先配好。三份小文件，换来 AI 每次开机就懂你和项目，性价比极高。
2. 需求一次说全。字段、导航、视觉风格列清楚，比挤牙膏省一大笔积分。
3. 先定数据结构再出界面。结构对了，后面改动都是顺的。
4. 迭代要指到具体位置。「第三张卡片留白加大」比「再大气点」有效十倍。
5. 图片生成先定风格词。统一风格词，批量出图才和谐，也省得反复重出。
6. 简单查询用 Ask 模式。只想问个思路、不改文件，用 Ask 不烧那么多积分。

九、小结

我不是程序员，这套东西如果让我自己从写代码开始，估计拖到放弃。但用 WorkBuddy，一个下午，从需求到能跑的原型就出来了。后面就是不断往里填配方、迭代细节的事。

如果你也有什么一直想做但不会做的小工具——记账、读书笔记、宠物档案——其实都一个套路：配身份文件 → 一次说清需求 → 先定结构 → 出原型 → 迭代 → 补图。照着做，基本都能成。

配方面包这事儿，配方记下来，下次才能复刻。App 也是，记下来了，就不用从头搭。

本文记录的是真实搭建过程，步骤可复现。如果你也用 WorkBuddy 做了什么有意思的东西，欢迎评论区交流。

生成图片

生成图片