2025年5月15日星期四

分分钟打造产品宣传网页,别再付费了


图片

点击上方卡片关注 不要错过精彩文章

🎉

读完这篇文章,别忘记给舰长点一个关注!舰长的智能体搭建文章,不仅是节点的构建,也有思路的分享。智能体搭建最重要的就是思路。最希望,能给大家带来不一样的搭建思路和方法。 

点一点上方的🔵蓝色小字关注,你的支持是我最大的动力!🙏谢谢啦!🌟" 


大家好,我是舰长团队的三秦

Image

上面这个个人简介帅不帅啊?

对!就是这个!帅到爆了!

这个简介是从个人网页中截出来的,链接在下面:

https://space.coze.cn/web?uri=7502626526085660681%2F%E8%B5%9B%E5%8D%9A%E6%9C%8B%E5%85%8B%E4%B8%AA%E4%BA%BA%E7%AE%80%E4%BB%8B%E9%A1%B5-81693f03dd.jsx&theme=undefined

至于个人微信放猫咪这件事,实在是因为本人的狂热粉丝太多,不胜其扰,只能用猫图做个示例,懂的都懂。

不开玩笑了。回到正题。

这个人名片,是我用扣子空间做出来的。起因是我最近参加各种活动,加了不少微信,但总是苦于每次都要复制粘贴一大堆自我介绍,太麻烦了,因此起心动念搞了一个个人网页,看起来像是个人简介赛博版。前后用了大约20分钟的时间。

搞完之后,灵感也凑了个热闹。对哦,个人网页,个人形象,个人品牌都是一脉相承的事情。那么,顺路搞一下企业的网页、产品介绍、活动网页是不是也是类似的思路?那上述这些,就统称为

你的专属品牌空间

话不多说,直接从执行开始:

PART 1 扣子空间使用指南

登录扣子,找到左侧边框,根据下图指示找到扣子空间

Image

下面就是扣子空间的主页,点击【快速开始】

Image

好啦,这样就顺利到达扣子空间的对话框界面啦,很干净简练有木有。

Image

到了这里,如果你还没有接触过扣子空间,我就简单念叨一下这个刚出台两周多的产品。(熟悉的大佬请跳到第三章节)

总的来说,扣子空间和3月初爆火的Manus是类似的,他们都被称为

自主规划Agent

也就是说,你只需要

发出一条指令,

按下发送键,

然后倒上一杯咖啡,

给在下点上一根烟,

就可以坐视他把所有的活干完。


底层逻辑也已经被很多AI博主科普过了,就是通过MCP协议的方式,完成多Agent协作。

可以说,这种处理方式,突出的就是四个大字:

Image

运作流程如下图所示,你只需要提供需求,扣子空间就会调用包罗万象的MCP扩展理解、分析、执行各种任务,最终输出结果。




PART 2 核心方案

这么一看,扣子空间是不是很强大?很动人?很像AGI?

也········不是。┓( ´∀` )┏

事实上,扣子空间在技术上也有一定的受限,比如理解意图、任务执行能力受限于大模型能力,生成速度未必达到预期·······等等。

下面是我将扣子空间和智能体/工作流的对比:

扣子空间 VS 扣子(智能体/工作流)

扣子空间智能体/工作流解决方案
底层模型能力通用大模型通用大模型附件
任务理解能力强,但不可定制可定制大模型优化提示词
快速生成能力自主规划,快捷生成设定任务流程,需要搭建尝鲜demo:扣子空间稳定落地:智能体/工作流

各位朋友,

如果你是搞智能体的,大可不必担心自己会丢饭碗;

如果你是学智能体的,多学一个打法多一条路;

如果你是打算用智能体的,也不必一看到扣子空间就扔掉既有的方案。


因为,智能体/工作流相对于扣子空间,还是有4个明显的优势:


稳定地生成

可从各个环节实现控制

高效地执行

批量地生产


不过这也不是说扣子空间在很多场景用不上。比如我做个个人网页,就完全可以摒弃吭哧吭哧搭工作流。我的理解是,

当你想要:

  • 完整保留你想生成的内容
  • 精准理解你的意图
  • 短流程,快节奏生成demo

那么使用扣子空间就是很棒的选择。

我个人理解,使用扣子空间的核心方案


附件解决信息传达的精准问题

优化提示词解决通用大模型的幻觉问题



好,接下来就是今天的主题,如果使用扣子空间完成专属形象空间。

PART 3 两步搞定个性名片(附件)

下列是我的个人网页。

https://space.coze.cn/web?uri=7502626526085660681%2F%E8%B5%9B%E5%8D%9A%E6%9C%8B%E5%85%8B%E4%B8%AA%E4%BA%BA%E7%AE%80%E4%BB%8B%E9%A1%B5-81693f03dd.jsx&theme=undefined

执行流程:

  1. 1. 撰写个人简介,形成Word文档(尽量不要PDF,不好识别)。
  2. 2. 图片解决方案:

由于扣子空间是无法直接识别附件里的图片的,因此各位朋友的帅照美颜可能就没法直接呈现在文档里。

但是!经过几轮测试后,我发现可以通过提交URL的方式让扣子空间识别。比如

Image

下面将提供图片转url的方法:


抓取图片保存,打开扣子,创建工作流。利用"开始""结束"节点转化成链接url

Image
Image
Image

然后就是把url粘贴到文档中的相应位置就好啦,ta~da~

  1. 3. 打开大模型(如Deepseek),指令大模型生成个人名片网页提示词

比如

我想生成一个个人简介的网页,整体为XX风格········

将上述要求优化成一套智能体提示词·········

  1. 4. 将提示词、附件上传至扣子空间。探索模式即可
Image

最终的执行流程就是这样,生成完毕后点击文件就可以预览。


PART 4 精准仿制产品介绍网页(提示词/URL控制)

如果你是企业主,想要做个产品介绍,那扣子空间至少能提供出一个demo出来。

比如,我构思了一个小小的方案,就是用2025年苹果官网的设计,做一下iphone4(2011年)的产品介绍网页。

效果如下:

https://space.coze.cn/web?uri=7502642384652714034%2FiPhone4%E7%BD%91%E9%A1%B5%E4%BC%98%E5%8C%96-301a02864d.jsx&theme=undefined

是不是有那个味儿了,哈哈?

其实我有点偷了个小懒,没有一字一句地告诉扣子空间我的产品内容,而是直接调用其搜索能力为我完成了产品的介绍信息。

关键点在"仿制"。就是你可以给一下你心水的网页设计,让扣子空间仿照这样的设计做一个demo,可以说又好又快。

看看我的执行流程吧

执行流程:

  1. 1. 撰写产品介绍(word最好)
  2. 2. 抓取模仿的产品介绍网页链接url(可选项)
  3. 3. 打开大模型(如Deepseek),指令大模型生成提示词

比如:

我想仿照苹果公司官网做出一个iphone4的产品网页,一定要按照2025年最新版的苹果公司网页。请XXXX进行设计·······

将上述要求转化为智能体提示词,要求简练准确

当我发现提示词中,有些UI还需要调整时,我会给出一些进阶的提示:

1.每一张图片的UI设计,要做到鼠标浮在上方时,图片有轻微的震动、呼吸感······

2.·····

3.·····

4.·····

将上述要求融合到上面提示词中

  1. 4. 将提示词上传至扣子空间。探索模式即可
Image


15分钟速成活动网页(提示词设计)

还有一个场景,就是有些企业会举办一些活动、展会。做一张海报当然必不可少,但做一个网页,是不是更有品格?

对,还是按照前面的思路,咱们设计一套活动网页。

不过,这回不是"仿制"了,而是自己实打实地去给一下指令了。

我呢,整了一个小活,供各位朋友笑一下哈:

https://space.coze.cn/web?uri=7502714704465444916%2F%E8%A5%BF%E8%A1%8C%E5%BF%97%E6%80%AA%E5%B1%95%E4%BC%9A%E9%A1%B5%E9%9D%A2-984d3e2901.jsx&theme=undefined

执行流程:

  1. 1. 撰写网页的需求

一般来说,活动的网页包括以下几个内容:

活动介绍

展区入口

特邀嘉宾

新闻中心

联系方式

每一部分的内容信息都要用双引号("")括起来,这样扣子空间才能准确识别里面的文本

比如,我的就是:

展会标题:"西行志怪特别展"

顶部TAB:"首页""展览入口""特邀嘉宾""新闻中心""联系我们"

········

  1. 2. 抓取模仿的产品介绍网页链接url(可选项)
  2. 3. 打开大模型(如Deepseek),指令大模型生成活动网页提示词

如:

我想做一个展会的网页,XXXX是该网页上的文本,你要负责该网页的UI设计,请深度理解该文本的风格,给出一份可以做成网页的提示词。

网页配色是······

图表风格是······

TAB页在顶端/左侧,锁定·········

  1. 4. 将提示词上传至扣子空间。探索模式即可
Image

总得来看,生成网页的速度很快,大约5分钟内就可以搞定。

用完扣子空间,最后,我想说:

图片



提示词

两步搞定个性名片

提示词已打包,欢迎您一键三连,评论区回复"0515"添加舰长微信发送截图,会给您提供提示词

精准仿制产品介绍网页

提示词领取方式如上

15分钟速成活动网页

  • 设计目标构建符合"西游解构主义"的静态展会页面,100%完整呈现用户提供的文本内容,通过新中式暗黑美学强化志怪氛围,采用最低技术实现成本确保移动/PC端兼容性。标题"西行志怪特别展"背景元素全局浅色《大唐西域记》古籍扫描底纹板块间隔符:简化版风火轮图案模块结构1. 导航区(PC顶部/Mobile汉堡菜单)[ 首页 | 展览入口 | 特邀嘉宾 | 新闻中心 | 联系我们 ]当前页签:红色渐变下划线悬停效果:0.3s金色波纹扩散点击按钮可跳转至相应区域,且这些TAB要永久悬浮、锁定2. 展览入口(垂直按钮组)## 展览入口[ 女儿国 ][ 车迟国 ][ 凤仙郡 ][ 小雷音寺 ][ 灵山 ]按钮样式:黑底烫金边框点击态:按钮凹陷+佛光投影3. 特邀嘉宾(双列栅格布局)## 特邀嘉宾┏ 三秦 ┓AI唯一的怪,主打一个这也奇怪那也奇怪┗━━━━━━┛┏ 四大金刚 ┓魑,魅,魍,魉┗━━━━━━┛┏ 五脊 ┓糖醋里脊,椒盐里脊,软炸里脊,锅塌里脊,羊蝎子┗━━━━━━┛┏ 六兽 ┓666+浑森难兽┗━━━━━━┛┏ 七仙女 ┓五津和六个她的分身┗━━━━━━┛┏ 八仙 ┓舰长,大壮,MS,阿唐,福建,yeadon,明鉴,欧阳┗━━━━━━┛容器:仿炼丹炉浮雕边框标题:朱砂红+阴刻效果4. 新闻中心(时间轴布局)## 新闻中心⚡《来自花果山的野猴擅闯东海强索兵器》⚡《妖猴弼马温盗蟠桃扰乱蟠桃会》⚡《五行山逃犯伪装取经人接近白虎岭》⚡《自称齐天大圣者暴力摧毁五庄观人参果树》⚡《斗战胜佛候选者与牛魔王争夺芭蕉扇》⚡《南无大圣舍利尊王佛肃清六耳余孽驾临灵山》闪电图标:像素化处理文本容器:破损锁妖链悬挂效果5. 联系我们(古籍尾注样式)## 联系我们〓 联系方式:07007(洞拐洞洞拐)〓 联系人:太饿真人〓 展会地点:西贺牛洲稀里糊涂洞符号:青铜器铭文风格地址:毛笔飞白动态渲染开发规范仅允许以下CSS效果:悬停缩放(transform: scale(1.03))下划线过渡(transition: 0.3s ease)背景明暗切换(filter: brightness(1.1))


关注公众号并添加舰长微信,领取智能体学习资料,并参与Coze技术直播讲解

Image

另外非常欢迎大家加入[唐舰长AI落地智能体交流群],主要交流群每周都会进行公益直播教大家搭建AI智能体工作流

Image

没有评论:

发表评论

ComfyUI I 只要两张图,教你1分钟换出高级感背景图!

点击蓝字关注我吧!说到 AI 作图,大家对 ComfyUI 应该早已不陌生。这个基于 Stable Diff 点击蓝字关注我吧! 说到 AI 作图,大家对 ComfyUI 应该早已不陌生。 这个基于 Stable Diffusion 的图形化工作流神器,用"节点搭积...