做一个自己的小工具

这节课你会...

让 AI 给你做出一个真正能用的小网页工具，全程不写一行代码。做完存成文件，双击就能打开。

先挑一个你真用得上的

工具不用做得多酷炫，能省你的事就行。几个特别实用的方向：

• 报价单生成器：填客户名、项目、单价、数量，自动算总额，一键打印成一页纸给客户看
• 排班表：店里几个人的班次排好，能改能存
• 利息计算器：输入金额和年限，立刻看到每月要还多少
• 抽签转盘：班级活动抽人，或者决定今天吃什么
• 单位换算：斤和公斤、摄氏和华氏，做小生意的人常用
• 记账小工具：记录每天的开支，自动算这个月花了多少

挑工具就一条原则：选你下周真的会打开第二次的那个。做一次就再也不用的东西，练手价值有限。你熟悉这个需求，才知道 AI 做出来的对不对。

怎么跟 AI 说，它才做得出来

这一步是成败关键。很多人说"帮我做个计算器"，AI 做出来一个算加减乘除的，然后嫌不好用。问题不在 AI，在你没说清楚自己要算什么。

对比一下。

太笼统：

帮我做一个计算器。

能用：

帮我做一个网页版的蛋糕报价计算器，我要拿它给客户当面报价。

要求：
1. 可以选蛋糕尺寸（6寸、8寸、10寸），不同尺寸价格不同
2. 可以勾选加项：水果夹层、翻糖装饰、定制造型，每项加钱
3. 自动算出总价，显示在页面下方，字要大
4. 下面留一个备注输入框，我可以自己打字
5. 一个打印按钮，点一下能打印成一页 A4 纸，直接给客户看
6. 手机上打开也要好看，我经常拿手机给客户看

价格先随便填几个数，我后面自己改。

请把 HTML、CSS、JavaScript 全部写在一个 HTML 文件里，
我要能直接保存成文件双击打开的那种，不要分成好几个文件。

看出差别了吗？你说了谁用、在哪用、有哪些功能、要交给你什么格式。AI 拿到这些，基本一次就能给出能跑的东西。

"全部写在一个文件里"这句一定要带上。不然它可能给你拆成三四个文件，你就不知道怎么办了。

存成文件，用浏览器打开

AI 把代码给你了，你只需要做三步：

1. 在电脑上新建一个文本文档，把文件名改成 报价单.html。注意后缀是 .html，不是 .txt
2. 用记事本打开它，把 AI 给的整段代码原样粘进去，保存
3. 双击这个文件，它会自动用浏览器打开

如果双击之后弹出来的是记事本而不是浏览器，说明后缀还是 .txt。右键文件，选重命名，把 .txt 删掉改成 .html 就行。

页面出来后，把它加到浏览器书签，以后一点就开。

想改价格、改文字，用记事本打开文件，找到那行字改掉，保存，刷新网页就看到了。真不用懂代码，你改的基本都是中文和数字。

做出来不能用？多半是这几个原因

说得太笼统。"做个记账的"和"做个能记录每天买菜花了多少、月底自动算总额的记账本"，是完全不同的两个东西。你说得越像在跟人交代事情，结果越准。

一次要太多。 一口气提二十个功能，AI 会顾此失彼。先做核心的三四个，能用了再加。

没说在哪儿用。 手机上用还是电脑上用，差别很大。你不说，AI 按电脑设计，手机上点都点不准。

没说数据要不要留。 关掉网页以后，填的东西还在不在？想留就明说"关掉浏览器再打开，之前填的数据还在"。

出错了别自己扛。 页面报错、按钮没反应，直接把现象告诉 AI："我点了打印按钮，什么都没发生。" 有条件的话按 F12 打开控制台，把红色的报错整段复制给它，AI 一看就知道问题在哪。

想改，就一直聊下去

做工具不是一次成型。你打开用两天，自然会冒出"这里该加个字段""这个字太小了"的想法。

别重新做，就在原来那个对话里接着说：

用起来挺好，想改两处：
1. 总价那个数字再大一点，加粗
2. 加一个客户名称输入框，打印的时候显示在最上面

AI 会在原来的基础上改，你重新粘贴保存一次就行。聊得越久，它越懂你要什么。

这套"说需求、拿结果、用一下、提改动"的循环，其实就是程序员每天在做的事。你已经会了，只是不用自己敲代码。

你只需要当一个把需求说清楚的人。说不清楚的地方，就是工具做不出来的地方。