很火爆！小白用AI制作SBTI人格测试网站（附全教程）

今早，

我打开手机，

刷朋友圈的时候，

发现很多朋友都在测SBTI人格测试。

这火爆程度，

直接把我两三页朋友圈给霸屏了。

我看着，这熟悉又陌生的名词有点呆住了。

猛的才想起来，

之前好像也测过，不过它叫的是MBTI人格测试。

SBTI？？

emm，和MBTI有什么关系，

为什么朋友圈大家测试出来的人格都这么癫，进化不带我是吧哈哈。

深入了解事情的缘由之后，

才知道，

这个是B站一位有才的作者，

为了劝诫一位爱喝酒的朋友戒酒，手搓的一个与MBTI毫无相干纯粹好玩的SBTI。

这种现象级，人传人的网站。

也不只是出现了这一次，

之前也出现过，“羊了个羊”、“跳一跳”、“死了吗”等APP。

这些产品的技术实现放在以前，

都是清一色的掌握在懂得代码的那群人手上，

像不懂代码，

但是对产品嗅觉极高的那群人来说，就难受了。

但，

咱今天就想跟这群人说

Vibe coding 来了，

你的创意在以后的日子里非常值钱，

技术实现的路径，你甩手交给Agent即可。

它能手把手让你想要什么就有什么，让你搭建出属于自己的SBTI网站。

Agent自动化搭建SBTI网站

是的，

小标题姑且就取的这么狂，

接下来，跟随我的脚步进入coze编程当中，

链接：

https://www.coze.cn/studio?invite_code=bd8b00c60a054b5c8d845b942c9c867a

进入到界面之中，我们依旧是选择网页应用。

准备一张，B站作者测试SBTI入口的首页图片，进去SBTI测试的过程中也要把测试题的截图丢给Agent让它去理解。

接下来，只需要输入下面这串代码，让Agent自动的给你吭哧吭哧跑个3分钟，初版网站就搞定了。

（图1）（图2）参考这两张图，帮我设计一个具有随机性的MBTI恶搞发疯版测试（测试题20道即可），测试的结果需要有28种人格，标题全程是名称是（Sha Bro Text Ikun），缩写是SBTI，是一份严肃中带着幽默的非正式性格测试。它并非心理学上的标准工具（如MBTI），作者是AI设计小华，基于娱乐和自我探索为目的创作而成。

在生成的过程中，右侧就相当于视觉交互界面，左侧是你和Agent直接沟通的终端入口。

不一会儿，

很快就把网页生成好了。

页面是比较干净的，和我给他参考的原创B站博主测试SBTI的页面基本上大差不差，甚至我的背景还会动。

界面是挺好看的，点进去发现版式很差劲，序号很乱。

说实在的，有点难蹦。

然后我就跟Agent说，我发现一个不美观的地方，测试题的界面请你参考（SBTI答题的参考界面），把答题的内容居中，请你优化。

这下勉强好一点了，但是序号好像又有点多显得很凌乱。

直接把问题描述给Agent，让它去解决掉。

序号不要显示这么多出来，可以通过设置快速跳转的按钮在打开选页面的序号。单个页面只显示当前页面的序号。

接下来，发现的问题是，字体和边缘，没什么边界感。感觉设计的答题测试有一种说不上来的人机感。

于是跟Agent说，字体比例要均衡，不要沿着边缘，边缘需要有一点留白。上一题和下一题的这两个按钮也需要有边缘的留白。

就这样，你一问，我一答的。

就把自创的SBTI测试网站搞定了，小图标什么的都可以进行简单的设计。

然后和Agent说，

把对应测试结果的人格图标都替换上去即可。

调试完之后，右上角点击部署即可。

做出的成品，

链接：https://3hxnqw6yng.coze.site/

可以自己购买域名，也可以直接用扣子官方自带的，我用于教学演示所以选择后者啦。

最后

今天的技术拆解就到这里儿，

生成的内容纯属娱乐，专业的心理测评还是交给专业的人去做，咱就专注小白对话式的建站就行。

其实重点在于，

这些有趣的爆品，

是一个普通人基于已有的权威的MBTI测试结合自己的生活场景用自然语言描述给了Agent，

进而打造出了一个和MBTI完全反差的一个东西，

而反差的东西恰巧就符合互联网传播的逻辑。

所以现在你有什么想法，

可不要藏着掖着了大胆的show出来，

技术不是问题，就怕你没想法。

对于本期内容有不了解的地方可以在评论区留言，

辛苦大家看到最后，欢迎大家推荐、点赞、关注、点⭐推荐给更多人，在此感谢每一位读者！！！