银海：用百宝箱3分钟做个会说话的网页

银海：用百宝箱3分钟做个会说话的网页 银海：用百宝箱3分钟做个会说话的网页 Modified June 30, 2025 No access 1 00:00 接下来是关键词提取和图像生成节点。大模型会从你输入的内容里抓取关键主题，然后调用图像生成接口，自动合成出一张张与内容匹配的视觉图，让网页看起来更“有感觉”。 然后是最关键的部分：生成网页结构。我们选用的是通义千问3的模型，配套的提示词也已经调好。模型会把你的个人信息转化成一套完整的网页HTML结构，自动排版、模块划分、颜色搭配，全部搞定。 提示词是： Code block Plain Text Copy 根据下面内容生成一个 HTML 动态网页。 1. 使用Bento Grid风格的视觉设计，找到合适的配色风格去生成，另外需要适配中英文的的UTF 8编码正常显示 2. 强调超大字体或数字突出核心要点，画面中有超大视觉元素强调重点，与小元素的比例形成反差 3. 中英文混用，中文大字体粗体，英文小字作为点缀 4. 简洁的勾线图形化作为数据可视化或者配图元素 5. 运用高亮色自身透明度渐变制造科技感，但是不同高亮色不要互相渐变 6. 模仿 apple 官网的动效，向下滚动鼠标配合动效 8. 数据可以引用在线的图表组件，样式需要跟主题一致 9. 使用 Framer Motion （通过CDN引入） 10. 使用HTML5、TailwindCSS 3.0+（通过CDN引入）和必要的JavaScript 11. 使用专业图标库如Font Awesome或Material Icons（通过CDN引入） 12. 避免使用emoji作为主要图标 13. 不要省略内容要点 14. 直接输出代码块即可，不要有其他任何的解释信息，代码块需要以不要以 的形式结尾，直接把代码块输出。 15. 音频模块需要固定在底部，样式半透明磨砂风格，自适应宽度 下面是相关内容数据： 1.文本信息： 2.音频链接： 3.图片信息： 最后一步，通过百宝箱官方提供网站部署服务MCP服务直接上线，你甚至连“服务器”这词都不用理解，就能拿到一个可以分享给朋友的网页链接，完整可访问，不限平台，点开即看。 更妙的是，这个方案不是只能生成「个人说明书网页」。你换一个Prompt，它就能变成：产品介绍页、求职简历页、作品集展示页、营销活动落地页、报名表单 / 问卷页... 你掌握的，其实是一整套“AI快速搭建网站”的底层能力。 大模型负责生成内容、设计结构，MCP负责部署和上线——你只需要动动嘴，有非常多的 MCP 工具能力等你去排列组合。 甚至，如果你愿意，还可以把这个流程继续拓展下去，比如加一个收集用户反馈的表单，加一个短视频生成模块，加一个内容自动同步的小程序……一整个“低门槛建站+AI内容生成”的链条就跑通了。 现在百宝箱正办着一个创作挑战活动，只要你提交一个应用，就有机会拿奖励、上推荐。 活动链接：https://alipaytbox.yuque.com/sxs0ba/doc/bgea72b73educds4 像我这套「AI生成个人网页」也会投进去，你完全可以基于它再去修改一下提示词、换个风格，就能变成你自己的小作品。 在AI时代，表达自己从来不是“写一篇自我介绍”这么简单，而是用声音、图像、结构、动态内容，做出一份真正属于你、讲述你的网页。 你不再只是一个写文档的人，而是一个用AI搭建作品世界的创作者。 所以别等灵感过期，也别等别人先发了。 就今天，打开百宝箱，试着把你脑子里的那个想法，变成一个真正可以点开、可以播放、可以转发的AI网页。 你会发现，一旦它成形，比你想象的还要打动人。 用 AI 做出自己的第一份“线上人格名片”，这个夏天就从它开始。 我是银海，你身边的AI产品经理，陪你解决每一个真实问题，我们下次再见 👋 © THE END 觉得我的内容还不错， 顺 手点个赞、分享、在看 都是对我最好的认可！ 🔗 原文链接： https://mp.weixin.qq.com/s/vEsKIp95... 原创 银海inhai AI产品银海2025年06月29日 15:10 浙江 https://mp.weixin.qq.com/s/vEsKIp95... No access 1 00:00 No access 1 00:00 接下来是关键词提取和图像生成节点。大模型会从你输入的内容里抓取关键主题，然后调用图像生成接口，自动合成出一张张与内容匹配的视觉图，让网页看起来更“有感觉”。 然后是最关键的部分：生成网页结构。我们选用的是通义千问3的模型，配套的提示词也已经调好。模型会把你的个人信息转化成一套完整的网页HTML结构，自动排版、模块划分、颜色搭配，全部搞定。 提示词是： html </html 最后一步，通过百宝箱官方提供网站部署服务MCP服务直接上线，你甚至连“服务器”这词都不用理解，就能拿到一个可以分享给朋友的网页链接，完整可访问，不限平台，点开即看。 更妙的是，这个方案不是只能生成「个人说明书网页」。你换一个Prompt，它就能变成：产品介绍页、求职简历页、作品集展示页、营销活动落地页、报名表单 / 问卷页... 你掌握的，其实是一整套“AI快速搭建网站”的底层能力。 大模型负责生成内容、设计结构，MCP负责部署和上线——你只需要动动嘴，有非常多的 MCP 工具能力等你去排列组合。 甚至，如果你愿意，还可以把这个流程继续拓展下去，比如加一个收集用户反馈的表单，加一个短视频生成模块，加一个内容自动同步的小程序……一整个“低门槛建站+AI内容生成”的链条就跑通了。 现在百宝箱正办着一个创作挑战活动，只要你提交一个应用，就有机会拿奖励、上推荐。 活动链接：https://alipaytbox.yuque.com/sxs0ba/doc/bgea72b73educds4 像我这套「AI生成个人网页」也会投进去，你完全可以基于它再去修改一下提示词、换个风格，就能变成你自己的小作品。 在AI时代，表达自己从来不是“写一篇自我介绍”这么简单，而是用声音、图像、结构、动态内容，做出一份真正属于你、讲述你的网页。 你不再只是一个写文档的人，而是一个用AI搭建作品世界的创作者。 所以别等灵感过期，也别等别人先发了。 就今天，打开百宝箱，试着把你脑子里的那个想法，变成一个真正可以点开、可以播放、可以转发的AI网页。 你会发现，一旦它成形，比你想象的还要打动人。 用 AI 做出自己的第一份“线上人格名片”，这个夏天就从它开始。 我是银海，你身边的AI产品经理，陪你解决每一个真实问题，我们下次再见 👋 © THE END 觉得我的内容还不错， 顺 手点个赞、分享、在看 都是对我最好的认可！ 🔗 原文链接： https://mp.weixin.qq.com/s/vEsKIp95... https://mp.weixin.qq.com/s/vEsKIp95... 原创 银海inhai AI产品银海2025年06月29日 15:10 浙江 Hi，我是银海。 你身边的AI产品经理，陪你解决每一个真实问题。 上次我们聊到「AI时代的个人说明书」时 太卷了！被AI做的「个人说明书」惊艳 ，没想到后台一下子收到了那么多条私信。 太卷了！被AI做的「个人说明书」惊艳 最多的问题是： “这个网站要怎么部署啊？”、“有没有不写代码、国内可用的方案？” 今天就来给你安排一个 彻底不写代码 、 几分钟搞定 的方式。你只需要用嘴说几句简单的自我介绍，剩下的事，交给AI和百宝箱搞定： 自动解析内容 → 自动生成网页 → 自动部署上线，全程连代码长啥样都不用看。 而且这次的玩法升级了：不仅仅是生成一堆文字，而是可以 带音频、配图像 ，最后生成一个真正“绘声绘色”的网页，发给朋友看超有沉浸感！ 用到的关键能力就是百宝箱工作流配合最新上线的MCP服务，简单来说，它相当于给每个人配了一个「会写代码、会部署网站」的AI助手。 你要做的就是把想法说出来，剩下的交给它。 比如我自己搭的这个体验页面，连代码都没摸就上线了，点击下面的链接就可以直接打开体验： https://www.tbox.cn/share/202506APQfmk00453535?platform=WebService 接下来我们一起手把手看看，这个网页背后到底是怎么生成的。 先到百宝箱的社区页面（https://www.tbox.cn/community），点击新建一个应用。 你会看到一个预设好的工作流界面，乍一看节点有点多，其实核心思路特别简单： 我们把输入的信息交给大模型，它会根据内容自动拆解关键词、写文案、生成图像和音频，然后拼成一个网页，最后一键部署上线。 第一个节点是生成自我介绍的文字，并且自动润色优化。用的模型服务是Minimax，通过MCP插件的方式直接生成音频链接，后续会嵌入到网页里，效果很自然，就像你站在网页上讲述自己一样。