电商智能体开发与应用（智能伴学版）课件 项目四 电商视觉设计智能体

电商视觉设计智能体电商智能体开发与应用（智能伴学版）项目四设计“店铺首页视觉设计”智能体设计“商品详情页视觉设计”智能体任务一任务二设计“新媒体平台推广图设计”智能体任务三目录/CONTENTS创建并使用“图片编辑助手”智能体处理图片AI助训任务描述Taskdescription在本任务中，小赵将在老李的指导下，按照下表所示的任务单，独立设计与创建一个名称为“店铺首页视觉设计”的智能体，该智能体扮演“资深店铺视觉设计师”的角色，专注于电商店铺首页的视觉构建工作，完成布局规划、店标设计、海报生成和商品图编辑等任务。一、定位“店铺首页视觉设计”智能体的功能风格定位是首页视觉设计的起点，决定店铺的视觉基调和用户体验。智能体应能够根据用户输入的店铺类型、目标用户和品牌调性，推荐合适的视觉风格。例如，针对年轻女性用户的美妆店铺，可选择清新简约、甜美梦幻风格；针对科技产品爱好者的店铺，可选择简洁科技感或未来感风格。（一）首页风格定位布局规划是首页视觉设计的核心，决定用户浏览体验和信息传递效率。智能体应能够根据店铺类型和商品特点，提供合理的布局建议。例如，对于主打商品推广的店铺，建议采用“商品展示区+促销活动区+品牌故事区”的布局；对于多品类店铺，建议采用“分类导航+热卖商品+推荐商品”的布局。（二）首页布局规划一、定位“店铺首页视觉设计”智能体的功能店标是店铺的视觉标识，是用户识别店铺的第一印象。智能体应能结合店铺类型与品牌调性，提供店标设计方案，并直接生成可用的店标图像。例如，某美妆店将根据智能体生成的首页设计方案，以及店铺类型、行业属性、目标用户与品牌调性，明确店标设计方案。（三）店标设计活动海报是店铺首页的视觉焦点，可以吸引用户注意力并传递核心信息。例如，某店铺将根据“6·18”活动制作该主题的活动海报，在海报中要体现活动内容。基于这些设计要求，可利用智能体的图像生成插件，通过输入活动要求进行活动海报的生成。（四）活动海报设计一、定位“店铺首页视觉设计”智能体的功能商品图是店铺展示商品的视觉载体，直接影响用户的购买决策，此时可使用智能体的图像生成能力直接生成商品图，也可提供商品图片，让智能体根据需求对商品图的背景、角度等进行修改。例如，某店铺准备对护手霜进行商品图片处理，设计时可根据提供的素材，进行商品图的生成，并根据效果生成不同角度的图片，其效果要简洁、美观、突出商品细节。（五）商品图设计智能体须具备灵活的图片编辑与优化能力，可对生成的图片或用户上传的素材进行精细化调整，如将商品图片的背景替换为更适合的背景、优化布局等。（六）图片编辑与优化二、设计“店铺首页视觉设计”智能体的具体构架为确保“店铺首页视觉设计”智能体能够专业、稳定地实现其核心功能，可以按照下图所示的思路展开构思。三、明确“店铺首页视觉设计”智能体的人设与回复逻辑扣子中提供自动优化人设与回复逻辑的功能，因此，在前期设定人设与回复逻辑时，可以主要针对智能体的角色和主要功能进行定位，具体内容如下。四、在扣子中创建“店铺首页视觉设计”智能体下面在扣子中，按照前期的规划创建“店铺首页视觉设计”智能体。其具体操作如下。01手动优化后的人设与回复逻辑02添加的插件03添加开场白五、调试和使用“店铺首页视觉设计”智能体设计网店首页创建好智能体后，调试智能体。下面以梦兮美妆店首页设计为例，先对店铺进行风格定位，然后规划首页布局，再依次设计店标、活动海报、商品图。其具体操作如下。01生成设计结果02生成详细设计方案03店标效果五、调试和使用“店铺首页视觉设计”智能体设计网店首页04活动海报效果05为商品图片替换背景五、调试和使用“店铺首页视觉设计”智能体设计网店首页06生成侧面图07生成背面图设计“店铺首页视觉设计”智能体设计“商品详情页视觉设计”智能体任务一任务二设计“新媒体平台推广图设计”智能体任务三目录/CONTENTS创建并使用“图片编辑助手”智能体处理图片AI助训任务描述Taskdescription在本任务中，小赵将在老李的指导下，按照下表所示的任务单，设计“商品详情页视觉设计”智能体，快速生成符合需求的商品详情页。一、定位“商品详情页视觉设计”智能体的功能“商品详情页视觉设计”智能体要能够根据用户输入的商品、品牌等信息，详细列出商品的功能、成分、使用方法等，然后通过对比分析，找出商品的独特之处和竞争优势，最终凝练成几个简洁有力、直击用户痛点的核心卖点，为后续生成商品卖点图提供依据。（一）提炼商品卖点“商品详情页视觉设计”智能体要能根据生成的商品卖点生成商品卖点图。商品卖点图应采用商品图片+卖点文字+图标或插图的方式进行体现。商品卖点图需主体清晰，文字或图标需置于显眼位置，能直观突出商品的核心卖点，并使用高质量的图片和吸引人的色彩搭配提升视觉吸引力。（二）生成商品卖点图一、定位“商品详情页视觉设计”智能体的功能“商品详情页视觉设计”智能体要能根据提炼的卖点生成可细腻、清晰地呈现商品细节的细节图，如商品的材质、工艺、尺寸等关键信息。其细节图要从不同角度展示商品的全貌与特点，确保消费者能够全面了解商品外观。（三）生成商品细节图“商品详情页视觉设计”智能体要能根据提示词精准生成商品的具体使用场景图。以羊绒大衣为例，该智能体可生成家庭环境或办公场景中的真实穿搭效果图，直观呈现消费者拥有商品后的生活想象空间。（四）生成商品场景图二、设计“商品详情页视觉设计”智能体的具体构架为确保“商品详情页视觉设计”智能体能够快速、批量生成商品详情图片，该智能体将以工作流的方式进行构建，工作流可按照下图所示的思路展开构思。三、明确“商品详情页视觉设计”智能体的人设与回复逻辑结合任务单和“商品详情页视觉设计”智能体的功能定位，其人设与回复逻辑主要在工作流的详情页框架、分类优化和进一步优化3个环节中体现。详情页框架提示词设定如下。（1）目标

（2）输入

（3）输出分类优化提示词设定如下四、在扣子中创建“商品详情页视觉设计”智能体下面在扣子中，按照前期的规划创建“商品详情页视觉设计”智能体。具体操作如下。01创建工作流02设置“开始”节点参数03设置“详情页框架提示词”节点参数四、在扣子中创建“商品详情页视觉设计”智能体04完成第1个大模型制作05设置“分类优化提示词”节点参数06完成第2个大模型制作四、在扣子中创建“商品详情页视觉设计”智能体07设置变量值08完成第3个大模型制作09设置循环数组变量值四、在扣子中创建“商品详情页视觉设计”智能体10设置“图像生成”节点参数11设置“图像生成”节点其他参数12连接循环四、在扣子中创建“商品详情页视觉设计”智能体13修改输出参数14设置“结束”节点参数15整个工作流五、调试和使用“商品详情页视觉设计”智能体生成商品详情页下面在扣子中，以羊绒大衣的详情页图片生成为例，调试和使用智能体。其具体操作如下。01上传图片并发送指令五、调试和使用“商品详情页视觉设计”智能体生成商品详情页02羊绒大衣详情页效果设计“店铺首页视觉设计”智能体设计“商品详情页视觉设计”智能体任务一任务二设计“新媒体平台推广图设计”智能体任务三目录/CONTENTS创建并使用“图片编辑助手”智能体处理图片AI助训任务描述Taskdescription为适应不同新媒体平台的推广需求，老李让小赵创建“新媒体平台推广图设计”智能体，小赵需要填写下表所示的任务单，以设计出适配不同平台的推广图。一、定位“新媒体平台推广图设计”智能体的功能在进行推广图设计前，需要进行品牌定位、目标市场分析、核心卖点提炼。品牌定位需要结合市场需求、竞争环境、用户画像确定。在智能体的辅助下，推广图主题提炼实现了从人工经验向数据驱动的转型，智能体通过抓取全网市场数据、竞品动态及用户画像，利用自然语言处理技术分析消费者情感倾向，自动输出精准的品牌定位建议。（一）提炼推广图主题商品宣传海报是以推广特定商品为核心目标的视觉载体，通过直观展示商品特性、优势及品牌价值，吸引潜在用户关注并激发其购买欲望。在生成时需要明确商品名称、核心功能、使用场景、价格区间及品牌标识。（二）商品宣传海报一、定位“新媒体平台推广图设计”智能体的功能促销广告是以短期销售转化为目标的广告形式，通过价格刺激、优惠活动、赠品策略等手段直接推动购买行为。。（三）促销广告活动宣传海报是用于推广特定活动，如庆典、展览、演出、促销等，通过信息整合与氛围营造吸引目标用户参与。针对活动宣传，智能体具备强大的信息整合能力与氛围营造能力，能自动提取活动名称、时间、地点等关键要素，采用“模块化布局”算法将核心信息置于视觉重心（如居中或顶部），并利用图标与对比色自动标注时间与地点。（四）活动宣传海报二、设计“新媒体平台推广图设计”智能体的具体构架为确保“新媒体平台推广图设计”智能体能够一键生成推广图，该智能体将以工作流的方式进行构建，工作可按照下图所示的思路展开构思。三、明确“新媒体平台推广图设计”智能体的提示词结合任务单和“新媒体平台推广图设计”智能体的功能定位，其提示词可分为整理用户需求提示词、生成提示词两个部分。考虑到海报凭借其图文并茂、传播力强的特性，已成为新媒体平台推广图中应用较广的视觉形式，因此，下面将以海报设计为例，深入解析该智能体的提示词构建逻辑。整理用户需求提示词设定如下。四、在扣子中创建“新媒体平台推广图设计”智能体下面在扣子中，按照前期的规划创建“新媒体平台推广图设计”智能体。其具体操作如下。01设置变量值02输入提示词四、在扣子中创建“新媒体平台推广图设计”智能体03设置变量值04输入提示词05设置“意图识别”节点参数四、在扣子中创建“新媒体平台推广图设计”智能体06设置“图像生成9:16”节点参数07其他比例“图像生成”节点参数四、在扣子中创建“新媒体平台推广图设计”智能体08设置“变量聚合”节点09设置“结束”节点参数10完成后的工作流效果四、在扣子中创建“新媒体平台推广图设计”智能体11添加工作流12设置开场白五、调试和使用“新媒体平台推广图设计”智能体生成新媒体平台推广图下面在扣子中，以七夕活动海报生成为例，调试和使用智能体。其具体操作如下。生成海报效果（1）在智能体“预览与调试”栏的文本框中输入“帮我生成一张充满童趣的七夕主题海报，背景凸显七夕元素，画面整体明亮温暖，字体要求圆润可爱。尺寸比例：9:16”指令，单击“发送”按钮。（2）智能体将生成活动海报，可通过单击超链接查看海报效果。设计“店铺首页视觉设计”智能体设计“商品详情页视觉设计”智能体任务一任务二设计“新媒体平台推广图设计”智能体任务三目录/CONTENTS创建并使用“图片编辑助手”智能体处理图片AI助训AssistanttrainingAI助训——创建并使用“图片编辑助手”智能体处理图片AI助训实训目的：掌握“图片编辑助手”智能体的搭建方法，能够使用该智能体处理图片。实训思路：（1）在扣子中新建一个名称为“图片编辑助手”的智能体，人设与回复逻辑需遵循其角色