我用「扣子空间」做了个AI穿搭毒舌网站，快被自己骂哭了～
原创 花叔 花叔 2025-07-24 15:33
互动数据
- 阅读：1660
- 点赞：24
- 转发：96
- 喜欢：2
- 留言：未知
👆这是我把文章丢给扣子空间后，一键生成的短播客，你可以试听感受下
没写一行代码，我用「扣子空间」搭了个用AI进行穿搭锐评的网站。下面这效果，快把我骂哭了😂
一边是为网站效果还不错高兴，另外也是觉得我对自己够狠的。
而这个AI网站的生成过程，我其实就发了几句提示词而已，没有写任何的代码，也不需要我自己经历繁琐的项目打包、部署、买域名之类的操作。我觉得很适合不会写代码的同学开始尝试实现自己脑中的想法，去试试创造一个小产品一个小网站的快乐。
效率奇高，过程还毫无障碍。
接下来，给大家介绍下我用「扣子空间」开发这个网站的过程。
如果你还没用过「扣子空间」的话，他们的官网地址在这：https://space.coze.cn/?from=landingpage&skill=website
第一步：选择「网页」模式
目前扣子空间提供通用agent的能力，你完全可以不做选择直接布置一个任务。但是除了通用能力外，我觉得扣子空间比较有特点的是他们在「写作」「PPT」「播客」「网页」这四个场景下做了专项优化。所以，当你的需求很明确，就是要开发一个小网站的时候，可以先选择「网页」，再表述需求，会获得更专业化的体验。
第二步：表述想法/初步测试
因为我想做的是AI网站，涉及到AI能力的调用，现在很多agent产品所使用的网页开发技术框架是html/css/js，不容易实现API的调用，所以我想先试试扣子空间调用API的能力，所以，我先输入了一个简单的需求做测试：
帮我开发一个可以进行图像AI理解的网站，用户上传图片后，返回关于这个图片的所有信息。
这里我要调用的AI模型是Doubao-1.5-thinking-vision-pro这个视觉理解模型（后来我发现豆包1.6模型其实也有图像理解能力），你可以通过字节的火山方舟平台获取这个API调用方式的信息：https://console.volcengine.com/ark/region:ark+cn-beijing/model/detail?Id=doubao-1-5-thinking-vision-pro
点击「立即体验」，然后按着指引，获取到以下这段API调用代码并复制使用即可（你自己的API KEY注意做好保密）。
接下来，通过这段提示词，我一次性就获得了下面这个可以进行图像理解的网站👇
试着上传一张图片测试，发现成功了。
第三步：网站优化、测试&改造
想实现的核心能力没问题后，我开始尝试要求扣子空间对网站进行改造，这一步我的提示词是：
非常棒，接下来我想调整这个网站的定位，请保留现在的图像理解API的调用逻辑，为我开发一个名为「花叔穿搭锐评」的网站，用户上传自己的穿搭照片后，系统将调用图像理解模型返回Roast店铺。
扣子空间帮我完成了网站风格的改造，除了核心调用AI的逻辑没变之外，可以说完全不是一个网站了。接下来下一步就是尝试继续体验，测试。
比如我发现AI生成的锐评很长，虽然评价效果还不错，但返回的内容是markdown格式的，这么多#和*不太符合我的预期。
但是没关系，你依然可以让AI去调整，我要求如下：
AI返回的评价是markdown格式的，请支持和优化markdown文本的展示效果
以及，我发现扣子空间为AI调用做了个超时取消的机制，导致有时候上传图片等待一段时间后，会出现没有结果就取消了任务的情况。但其实这种情况你也可以简单的用自然语言做如下要求：
去掉超时取消机制，尽可能多等待。
以及，其实除了用自然语言的方式要求AI去修复bug或者更改设计之外，如果你要改的内容就在界面元素上，你也完全可以点击右上角的「编辑」功能，然后选择任何你想要调整的元素进行修改。这种方式下你对细节调整的掌控度会高不少。
如你所见，这么个AI网站就这么水灵灵的在几句自然语言的要求之下完成了。
而且，完成之后，它不止你自己可用，也是可以通过右上角的分享按钮，直接在浏览器中打开这个已经完成部署上线，公网可以访问的链接🔗
比如我这个「花叔穿搭锐评」网站，你就可以现在尝试下…
👉https://space.coze.cn/coding-expert-runtime/136000180482
简单总结下我这个过程的体验，如果你是个新手的话，我确实不建议你想通过一段「魔法」提示词就一次性生成一个超绝的网站。你也不需要这么做，你只需要一步步清晰阐述你的想法，先让「扣子空间」跑一跑代码，等你看到了它为你提供的雏形之后，你再在雏形基础上完善自己的想法， 进一步提要求即可。
我自己做了几次测试后，发现「扣子空间」这个编程搭子的特点是很克制和严谨，它会尽量实现，同时仅实现你表述的需求，可控性很强。但同时这也是要求你要对自己想要实现的网站功能、结构、界面风格等有比较清晰的想法和表达能力。对于设计师和产品经理来说，有扣子空间的帮助去实现自己的设计初稿或产品原型会是如虎添翼的。
不过，如果你不太擅长表达自己对网站界面的要求怎么办？
这又要来说一个「扣子空间」我觉得很绝的功能，就是截图复刻。
在网站开发模式下，你完全可以找一个你想模仿搭建或者学习的网站界面，然后截图让「扣子空间」帮你复刻即可。
比如我截了个图片比较多，很考验AI能力的YouTube首页来给AI上点强度。
而提示词，我只是简单发了个：请帮我生成一个和截图一样的网站
然后，「扣子空间」就帮我把YouTube首页给复刻出来了，实现程度大概80%吧。
让我觉得比较惊讶的是，「扣子空间」甚至把我提供的截图里的视频封面的截图再次给截取下来，作为模仿网站的素材了，真就有点6…
而且，我发现这个上传图片的功能不止可以用来让AI模仿，你也可以把它作为提供素材的方式，比如我给扣子空间传了张我的照片作为头图，它就这么给放上去了
说实话，这个能力可太重要了。
比如，你需要做一个自己的简历页面，或者你要帮公司做一个企业品牌官方、活动官网等等，你总不能让AI随意生图，或者从开源网站找跟你完全无关的照片吧？
通过这种方式，你完全可以控制你要生成的网站上的图片素材资源了，而且，还真就是所见即所得，如此的简单，不需要碰一点代码，纯自然语言实现。
以及，顺便提一嘴，除了使用图片外，设计师完全可以导入Figma设计稿，让扣子空间一次性复刻你的设计。
通过上面两个任务，你大概对「扣子空间」的0代码开发网站的能力有了初步理解，你可以通过自然语言表达你的需求，也可以通过截图，自己画图等方式表达你对网站设计的要求和想法。扣子空间相比很多别的AI编程工具来说，它帮你省了很多工具学习和代码学习的过程，很适合新手上路。
最后再给大家提供个小彩蛋🥚
前几天写的文章里我提到也演示过我自己开发的「打字练习」的网站，但，我确实是有点懒，一直都今天都没把这个本地html网页部署上线。
我觉得让「扣子空间」帮我，从头开始做一个，省去我部署的麻烦，提示词如下：
请为我开发一个支持打字练习与游戏化功能的现代网页应用，网站主题为「打字闯关王」。用户可以通过输入英文句子进行打字练习，并在闯关中逐步提升难度、获得分数、升级角色，提升打字速度与准确率。
你可以通过这个链接去试试：https://space.coze.cn/coding-expert-runtime/63682560514
所以，如果你最近脑子里也冒出一个“想做个小网站玩玩”的想法，但又因为不会写代码而打住，不如先试试这个AI搭子。
你可以从一个很轻很简单的想法开始，也可以像我一样，搞点离谱的创意先试试它的极限。
别担心写不来代码，别焦虑从哪开始。
现在是想法落地最容易的时代之一，你要做的，就是开个口，让AI来帮你把那扇门推开🚪
接下来我还打算用「扣子空间」做点别的实验：
比如用它搭一个工具类网站，再比如试试看它能不能搞点更复杂的AI交互流程……等我玩明白了再来更新进度。
如果你也试出来什么好玩的，评论区见～👀🪄
都看到这了，还不关注、点赞、转发一波😉～