大家好，我是架构之门！
「你还在做MBTI测试？太out了！」
昨天SBTI人格测试悄悄火了起来。相比MBTI，SBTI更接地气、更搞笑，测试结果从「屌丝」到「小丑」应有尽有，堪称当代打工人的精神状态检测仪。
于是我萌生了一个想法：做一个SBTI测试网站，方便分享给朋友们玩。
但我不会写前端代码啊？没关系，我有智能体。最终效果图如下：
文末附带源码获取方式，可直接部署网站。
🤖 第一次对话：从想法到落地
我打开智能体，说了句：
「帮我找一个SBTI人格测试的网站，然后改一下布局」
智能体立刻开始工作：
-
先搜索拿到测试网站，
-
再去GitHub搜索相关项目，发现是纯前端项目
-
把源码下载到我的云端环境
-
然后问我具体要怎么改
全程不到2分钟，项目已经在我手上了。
🎨 第二次对话：改布局
原版的问卷是所有题目一次性展示，用户得疯狂滚动。我跟智能体说：
「问卷布局可以调整下吗？改成单题卡片滑动的模式」
智能体立刻动手：
-
重新设计了页面结构
-
加了进度条和导航点
-
实现了滑动的答题体验
-
还优化了移动端的适配
改完后发给我看，效果很满意——专注、流畅、有互动感。
🐛 第三次对话：点不动？
我打开网页测试，发现选项点击没反应。
「继续检查下交互有点问题，无法点击」
智能体开始排查：
-
先检查是不是代码没加载完
-
又检查是不是有什么遮挡
-
最后发现是某些样式在特定情况下会导致点击失效
改了一版，还是不行。
又改了一版，还是不行。
...
智能体没有放弃，它创建了一个极简测试版，一点一点定位问题。
终于，在第五次尝试后，点击功能恢复正常。
那一刻我真觉得：这玩意儿比我有耐心多了。
🔧 第四次对话：控制台红字
点是能点了，但控制台一直报错：
plaintext
Uncaught SyntaxError: Unexpected identifier
我截了个图发给智能体：
智能体看了一眼，立刻定位问题：
原来代码里有个地方用了中文双引号 "送钱"，跟代码本身的引号冲突了。改成直角引号 『送钱』 就解决了。
这种细节问题，我自己找可能要找半天，智能体几秒就搞定了。
✅ 最终效果
经过几轮对话，网站终于完成了：
- 📱 单题卡片滑动，像做问卷星一样流畅
- 📊 实时进度条，知道自己做到哪了
- 🔵 导航点，可以随时跳题
- ⚡ 选择后自动跳转，不用手动翻页
- 📱 完美适配手机，分享给朋友直接能玩
💡 几点感受
-
1. 智能体不是魔法，但真的很省心
它不会凭空变出一个完美的产品，但在我和它的对话中，需求一步步被理解、被实现、被修正。这个过程比我一个人摸索快太多了。
-
2. 它比我有耐心
点击问题改了四五次才解决，它一次也没有抱怨。这种"死磕"的能力，说实话很多人（包括我）都做不到。
-
3. 细节问题它能秒发现
那个中文引号的bug，我自己看代码可能要找很久。但智能体一眼就定位到了，这种"代码嗅觉"真的很强。
📂 源码分享
完整源码获取方式：
关注公众号“架构之门” 回复sbti
一个文件，浏览器直接打开就能跑，没有任何依赖。
感兴趣的可以拿去改改，做个自己的版本。
关注我，下次分享更多AI智能体项目~ 🚀
