Skip to content

AI Artifacts ​

想做一个小工具(比如内部用的计算器、数据看板),但为它搭一个项目、配一套构建、找地方部署,成本远高于工具本身的价值。

「AI Artifacts」工具页初始界面:描述你想要的网页 / 生成什么 / 网页应用 / 单页 / HTML 幻灯片 / 生成网页 / 网页预览;主按钮「生成网页」;页头标签「AI 模型处理 · 50 积分/次」

打开「AI Artifacts」看到的初始界面。由 AI 模型处理,按次消耗积分(以页面标签为准)。AI 生成的结果请自行核实。

它产出什么 ​

自包含的单个网页——HTML、CSS、JS 全在一个文件里,打开就能用,不依赖任何服务器。

生成后可以直接预览,也可以一键分享成链接发给别人。

三类适合的内容 ​

单页应用 / 小工具——计算器、转换器、表单、简易看板。这类的共同点是逻辑简单但要交互,用文档说明不如直接给个能点的东西。

落地页——产品介绍、活动页。

HTML 幻灯片——用网页做演示,好处是可以嵌入真实的交互组件。

需求描述怎么写 ​

说清楚"输入什么、输出什么、有哪些交互",比描述外观重要得多。

  • 好:「一个房贷计算器,输入本金、年利率、年限,选择等额本息或等额本金,输出月供、总利息,并画一张还款构成的柱状图」
  • 差:「做一个好看的房贷计算器」

外观可以后补,逻辑说不清就得返工。

一次生成不完美是常态 ​

先要一个能跑的最小版本,再逐步加。一上来就描述十个功能,出来的东西哪里不对都不好定位。

顺序:核心逻辑跑通 → 加细节功能 → 最后调样式。

自包含带来的限制 ​

因为是单文件、不依赖后端,所以:

没有数据持久化——刷新页面数据就没了(除非用浏览器本地存储)。

不能调用需要密钥的接口——密钥会暴露在前端代码里。

不适合多人协作的数据——每个人看到的是自己浏览器里的状态。

需要这些能力的,本质上需要一个真正的后端,不是这个工具的场景。

分享出去的注意事项 ​

生成的链接是公开的。不要把敏感数据写进页面——即使你只发给一个人,链接本身可以被转发。

相关工具 ​

最后更新:2026-09-05