📖 新手教程

零基础也能做工具

不需要懂编程,跟着步骤走,5 分钟做出你的第一个小工具

去创作页面

跟着做,一共 8 步

每一步都有提示,别着急,慢慢来

1
💡

想好做什么工具

先想一个需求:倒计时、记账、计算器……都可以。

💡没想法?看看首页别人的工具找灵感
2
🤖

和 AI 对话生成

在创作页直接描述你的想法,点发送,AI 会边聊边生成代码。

💡可继续对话调整:「换个配色」「加个历史记录」。平台支持白名单联网和内置 AI,超出沙盒范围 AI 会说明并给替代方案
💡 展开示例提示词(长按可复制)

下面这些话可以直接发给 AI(长按可以复制),都已按微坞的要求写好(手机适配 + localStorage 记忆),照用就能做出功能完整的工具。也可以先复制下面的「微坞通用创作要求」,再随意组合你的想法:

📋 微坞通用创作要求(建议每条都加上)

移动端优先,适配 375px 宽度,按钮和输入框至少 44px;界面简洁现代、颜色柔和;完全自包含,不引用外部 CDN 或图片,不使用裸网络请求(fetch/XHR/WebSocket)、cookie、弹窗、跳转、外部链接;需要公开数据(汇率/天气/词典等)时用平台白名单联网 __wewoo.fetch,需要 AI 问答/总结/建议时用 __wewoo.ai.chat;需要记住用户数据时用 localStorage 保存和读取(微坞会自动持久化,刷新/全屏/重进都能恢复);用户输入无效时给出友好提示;把完整代码放在一个 HTML 文件里,用 ```html 代码块输出。

BMI 计算器

帮我写一个 BMI 计算器:输入身高(cm)和体重(kg),点计算显示 BMI 值和健康等级(偏瘦/正常/超重/肥胖)并用不同颜色区分。把最近一次输入用 localStorage 保存,下次打开自动回填。界面用渐变背景和圆角卡片,按钮和输入框至少 44px,适配 375px 手机。完全自包含,不引用外部资源、不使用裸网络请求。把完整代码放在 ```html 代码块里。

倒计时器

帮我写一个倒计时器:可以设置时长(分/秒)和提示文字,开始后显示剩余时间(带圆形进度动画),结束时动画提醒。把上次设置的时长和文字用 localStorage 保存,下次打开自动恢复。界面漂亮,按钮至少 44px,适配 375px 手机。完全自包含、不使用裸网络请求。把完整代码放在 ```html 代码块里。

随机点名器

帮我写一个随机点名器:输入一串名字(用逗号或换行分隔),点开始名字快速滚动,再点一下停在随机一个名字上并高亮,记录最近抽中的名字。把名单和记录用 localStorage 保存,下次打开还在。要有动画效果,按钮至少 44px,适配 375px 手机。完全自包含、不使用裸网络请求。把完整代码放在 ```html 代码块里。

颜色选择器

帮我写一个颜色选择器:点击或输入选择颜色,显示 HEX 和 RGB 值并一键复制,保存最近用过的颜色列表(点一下可再次使用)。用 localStorage 保存最近颜色,刷新不丢。界面简洁好看,按钮至少 44px,适配 375px 手机。完全自包含、不使用裸网络请求。把完整代码放在 ```html 代码块里。

喝水打卡

帮我写一个喝水打卡记录器:每喝一杯点一下按钮,显示今天喝了几杯、目标进度和连续打卡天数;用 localStorage 保存数据,跨天自动归零但保留连续天数。界面可爱一点,按钮至少 44px,适配 375px 手机。完全自包含、不使用裸网络请求。把完整代码放在 ```html 代码块里。

记账本

帮我写一个简单的记账本:可以添加收入和支出(金额+备注),显示总余额和最近的账单列表,可以删除单条记录;用 localStorage 保存账目,刷新不丢。界面简洁、适配 375px 手机,按钮至少 44px。完全自包含、不使用裸网络请求。把完整代码放在 ```html 代码块里。

汇率换算(联网)

帮我写一个汇率换算器:输入金额、选择或输入两个币种,点换算显示实时汇率和换算结果。用平台白名单联网 __wewoo.fetch 获取汇率:__wewoo.fetch('https://open.er-api.com/v6/latest/CNY', function(err, res){ var data = JSON.parse(res.data); })(调用前用 if (window.__wewoo && __wewoo.fetch) 检测,失败时提示在微坞内打开)。界面简洁,按钮至少 44px,适配 375px 手机。完全自包含、不使用裸 fetch。把完整代码放在 ```html 代码块里。

天气查询(联网)

帮我写一个天气查询工具:输入城市名,显示当前温度、湿度和天气描述。用平台白名单联网 __wewoo.fetch('https://wttr.in/城市名?format=j1', function(err, res){ var w = res.json.current_condition[0]; w.temp_C 是温度、w.humidity 是湿度、w.weatherDesc[0].value 是天气描述 })(调用前特性检测 if (window.__wewoo && __wewoo.fetch),失败时友好提示在微坞内打开)。界面漂亮,按钮至少 44px,适配 375px 手机。完全自包含、不使用裸 fetch。把完整代码放在 ```html 代码块里。

AI 账单整理

帮我写一个 AI 记账整理工具:可以添加日常开销条目(金额+备注),点「AI 整理」后把账单按类别汇总并给出省钱建议。用平台内置 AI __wewoo.ai.chat({ prompt: '把以下开销分类汇总…', json: true }, function(err, res){ res.json 是分类好的对象 }) 获取结构化结果,再用 localStorage 保存账单。按钮至少 44px,适配 375px 手机。完全自包含。把完整代码放在 ```html 代码块里。

3
📋

载入代码

点版本按钮(V1、V2…),完整代码会自动填入编辑器。

💡多轮对话产生多个版本,可来回切换对比
4
📋

外部 AI(可选)

想用 ChatGPT、Kimi 等外部 AI,就把提示词复制过去,再把代码粘贴回来。

💡编辑器里有旧代码就先清空再粘贴

编辑器长这样 👇

HTML

<!DOCTYPE html>

<html>

...你的代码...

</html>

← 把代码粘贴到这里

5
👁️

预览效果

右侧手机框实时显示效果,可以直接点击试用。

💡数据用 localStorage 保存,刷新也不会丢
📱

左边:写代码

右边:看效果

6
💾

保存快照

满意就点「保存快照」,关掉页面也不丢。

💡可保存多个版本,随时切换
7
🚀

发布

点「发布」,填名称、简介、选分类,即可生成分享链接和二维码。

💡需要先登录
8
🎉

分享给朋友

把链接或二维码发给朋友,用手机浏览器打开就能用。

💡微信里打开可能受限,建议引导朋友用浏览器打开

平台能做什么 / 不能做什么

先说清楚边界,避免你做了半天发现跑不起来

✅ 能做

  • 纯前端工具:计算器、换算、小游戏、记账、打卡等
  • 本地记忆:用 localStorage 保存,刷新 / 重进不丢
  • 云记忆:登录后数据跨设备同步
  • 白名单联网:汇率、天气、词典、翻译等公开数据
  • 内置 AI:问答、总结、分类(每天 1000 次)
  • 视觉 AI:上传图片做识别 / OCR
  • 一键复制、导出文件(CSV / 图片)、分享
  • 语音朗读、音效(WebAudio)

❌ 不能做

  • 任意联网(只能访问白名单公开 API)
  • 服务器 / 数据库(后端逻辑)
  • 工具内登录注册、支付
  • 麦克风录音、摄像头拍照
  • 系统通知推送、定位
  • 弹窗、跳转、外部链接
  • 读取剪贴板(只能写入,不能读)
  • 读取用户邮箱 / ID(只提供昵称头像)

常见问题

我完全不会编程,真的能做吗?

能。告诉 AI 你想要什么工具,它会帮你写全部代码。

用哪个 AI 比较好?

直接用微坞内置 AI 就行;也可以把提示词复制到 ChatGPT、Kimi 等外部 AI。

发布需要注册账号吗?

发布要登录,邮箱注册即可;不登录也能写代码和预览。

代码粘贴进去后预览是空白的?

多半是代码不完整或出错。让 AI 检查一下,或从场景模板生成一个能跑的示例。

可以修改别人发布的工具吗?

可以。详情页点「改编」,代码会复制到你的编辑器,改完发布自己的版本。

发布的工具别人怎么看到?

发布后出现在首页广场;把链接或二维码发给朋友,手机浏览器打开即用。

工具能记住用户的数据吗?比如打卡记录、游戏进度

能。代码里用 localStorage 保存,刷新、重进都能恢复;登录后同步到云端。

工具能联网获取数据吗?

能,但仅限白名单公开数据(汇率、天气、词典等),用 __wewoo.fetch 调用。

工具能使用 AI 吗?

能。用 __wewoo.ai.chat 做问答、总结、分类,每天 1000 次。

准备好了吗?

跟着教程做,你也可以做出好用的工具!