AI产品图片生成

项目访问链接

https://zion.functorz.com/tool/KrABb5Mbe24/WEB?code=4i3fb5jHNGwU9 

场景与目标

• 目标：用户上传产品原图并输入具体场景需求，由 AI 自动生成商品图，并自动回填至数据库展示。
• 适用场景：电商营销、社交媒体内容创作、产品原型快速建模。
• 核心逻辑：UI 输入（图片选择器 + 文本输入框） -> 异步行为流 -> AI Agent -> 数据库存储 -> 列表实时展示（通过订阅机制）。

实现步骤

数据存储

• 数据模型：创建一个名为 产品 的数据表。

逻辑与状态配置

AI Agent 配置

进入 AI 模块，配置用于生成图片的Agent。

1. 输入 (Inputs)：定义两个参数：原图 (图片) 和 需求 (文本)，用于接收原图和需求描述。
2. 提示词 (Prompt Template)：
   • 角色 (Role)：顶尖商业视觉设计师和高级修图师。
   • 目标 (Goals)：根据接收到的图片和需求生成高质量的产品图。使用 \{{Input/requirement\}} 引用用户输入的需求。
   • 限制 (Constraints)：明确“材质锁定”、“视觉融合”及“模型适配”等规则，确保产品不走样，光影自然。
3. 模型选择：选择支持图像生成的模型（如：纳米香蕉 2-4K）。
4. 输出 (Outputs)：类型设为 纯文本 (Plain text)，并关闭“流式输出”。

行为流 (Actionflow) 构建

1. 开始节点 (Input)：定义输入参数 original_image (图片) 和 requirement (文本)。
2. 执行模式：在右侧面板将执行模式设置为 异步 (Async)。
3. AI 节点 (Start Conversation)：选择上一步创建的Agent，并将行为流输入参数绑定至Agent的输入项。
4. 添加数据节点 (Save record)：
   • 目标表：选择 产品 表。
   • 字段绑定：original_image 和 requirement 绑定自行为流输入。
   • 结果图处理：使用公式 GET_ITEM 从 AI 节点的返回数组 images 中提取第一项（索引为 0）。

UI 搭建与交互配置

组件结构

1. 输入区域：拖入一个 图片选择器 (用于上传原图) 和一个 文本输入框 (用于填写需求)。在属性面板为文本输入框开启“多行”模式。
2. 触发动作：放置一个 按钮，重命名为“开始生成”。
3. 展示区域：添加一个 列表 组件用于动态显示生成历史，列表内放置一个 图片 组件显示结果。

交互逻辑设置

• 按钮点击事件：
  1. 调用行为流：选择 AI产品图片生成。将图片选择器和文本输入框的值分别绑定到行为流参数。
  2. 成功时动作：添加两个“重置输入组件值”动作，用于清空图片选择器和输入框，提升用户体验。

• 列表配置：

  • 数据源：选择“远程数据” -> 产品 表。
  • 请求类型：务必选择 订阅 (Subscription)。
  • 数据限额：关闭数据限额。
  订阅模式下，当异步行为流在后台完成数据插入后，列表会自动刷新并显示新生成的图片。

• 结果显示与下载：
  • 在列表项内，将 图片 组件的来源绑定为 当前项.结果图。
  • 点击交互：为该图片添加“下载图片”动作，目标图片同样绑定为 当前项.结果图。

功能验证

1. 预览测试：点击编辑器右上角的预览按钮。
2. 操作流程：上传一张产品图，并在输入框输入需求。
3. 结果确认：点击“开始生成”。稍等片刻（AI 生成时间），生成的图片会自动出现在下方的列表中。点击图片即可下载到本地。
4. 数据校验：进入数据库查看 产品 表，确认原图、需求描述和 AI 生成的结果图已正确保存。

测试用例参考

场景一：腕表九宫格摄影展示

输入原图&输出结果图：

输入需求描述：

展示形式：精致的 3x3 九宫格（共 9 张图）产品摄影展示。每张图均为正方形比例，采用无缝九宫格布局。
视觉质量：超高分辨率 ，极致锐度，完美的摄影棚光影，干净的留白空间。
美学风格：高端腕表及奢侈品广告风，细腻高级的调色，顶级商业摄影美学 。
九宫格具体内容：
1. 核心主图：腕表在极简展台上的高雅构图。
2. 结构角度：侧向视角，强调表壳外形轮廓与比例。
3. 极致微距：表盘 (Dial) 细节的锐利特写。
4. 局部特征：表冠 (Crown)、按键等标志性设计元素的特写。
5. 触感质感：表带材质（如皮革纹理、金属拉丝等）的特写。
6. 环境互动：腕表与自然元素的互动。
7. 柔性背景：以细腻的亚麻或丝绸织物为衬底。
8. 暗调氛围：戏剧性的强光影对比 (Low-key)，增加神秘感。
9. 内刊排版：带有一丝生活方式氛围的精致编辑构图。

场景二：电商模特街拍

输入原图&输出结果图：

输入需求描述：

产品特征：浅蓝色、浅绿色和米色相间的粗线条纹针织冬装帽和围巾套装。（必须100%保留原图纹理和颜色，保持毛线物理交织逻辑。）。 
目标模特：25岁亚洲女性，极具透明感的清透裸妆（伪素颜），面容柔和自然，必须保留真实的皮肤纹理（如微小的毛孔或细碎的胎毛），拒绝过度磨皮。 
穿搭与动作：模特头上戴着这顶针织帽，脖子上随意但舒适地围着这条针织围巾。她正低头看着一旁，呈现自然的抓拍感，双手随意地插在口袋里。 
搭配服装（核心限制）：模特身穿一件【平滑哑光材质】的米白色纯棉风衣或无领呢子大衣。衣服绝对不能是针织或毛线材质，必须极简无图案，以此凸显帽子和围巾的质感。 
场景与光影：背景是一个极简的日式原木风咖啡馆门前，或者干净的白墙背景。使用柔和的自然漫反射光（阴天光线），画面整体呈现低对比度、低饱和度的胶片质感（Fujifilm aesthetic）。 
画面要求：自然的摄影景深（背景轻微虚化），商品细节极其清晰，画面留白，具有日系杂志《FUDGE》或《CLUÉL》的日常松弛感，加入极其轻微的胶片颗粒感以增加真实度。