--- theme: jzman highlight: a11y-light --- # 引言在AI逐渐成为潮流的现在，各行各业的开发者都在积极探索如何将AI与自身项目有机结合。**LogicFlow** 是一款高度可定制的流程图编辑框架，支持开发者根据具体需求构建专属的流程图编排应用，作为维护者的我们也在思考和探索着流程图在AI领域的可能性。本次，我们将分享近期探索实现的一个“流程编排 × AI生图”的小工具，带大家了解其功能背后 **LogicFlow** 高可定制性所提供的可能性。先一起看看效果： ![demo-preview.gif](https://p3-xtjj-sign.byteimg.com/tos-cn-i-73owjymdk6/f37fdf758678485d9b05d891caa47daa~tplv-73owjymdk6-jj-mark-v1:0:0:0:0:5o6Y6YeR5oqA5pyv56S-5Yy6IEAgTG9naWNGbG93:q75.awebp?rk3s=f64ab15b&x-expires=1760566185&x-signature=%2BAEv0axrrzYgil0i4OQnXlpRTwo%3D) > 项目源码传送门： > 大家克隆下来起本地服务可以直接试用\~ # 一起来实现这个「流程编排 × AI生图」工具 ## 背景说起AI能力，最早出现在我们眼前的除了 ChatGPT 这样沟通工具就是一些 AI 生成的图片了，再加上后面看到了 Open AI 发布的 Sora 的预告，让编者突然产生了个流程图和 AI 结合使用的想法「有没有可能做这样一个工具：用户在它上面像画流程图一样拖拖拽拽，通过画出一个流程图作为一个场景/故事的描述，流程引擎执行这个流程图，把内容转化为prompt，再给到AI，生成一个故事性的图片/视频呢？」于是编者优先尝试了文生视频，去找了市面上的一些可以文生视频且支持API调用的AI服务尝试生成 LogicFlow运行原理为主题的视频，编者接触到的AI文生视频应用大概分成下面这三类，但是结果不是很尽人意： * **文案+固有视频片段生成视频**：表现上像是根据文案描述，从现有视频内容中找到有一些关联的视频片段返回（代表：Pictory和inVideo） * **根据文案创作视频**：根据文案描述生成视频内容，但生成的质量参差不齐，没有办法避免有扭曲的地方（代表：Luma AI、可灵 AI） * **文案+模板生成视频**：需要先选择一个模板，再根据文案描述，生成一个ppt视频（代表：Lumen 5）这里小小地放一个编者耗尽所有力气用Luma + Pictory做出来的一个视频片段： ![LLLLOGICFLOW-smaller-high.gif](https://p3-xtjj-sign.byteimg.com/tos-cn-i-73owjymdk6/fdec2f947f2047f5861dddcd4498c6e4~tplv-73owjymdk6-jj-mark-v1:0:0:0:0:5o6Y6YeR5oqA5pyv56S-5Yy6IEAgTG9naWNGbG93:q75.awebp?rk3s=f64ab15b&x-expires=1760566185&x-signature=FO%2F81OWV3ndsDcd4x0P6DRw05%2BA%3D) 再加上探索视频的过程中看到现在市面上AI图片的质量看起来还不错，所以我们退求其次，有了这次实践。 ## 功能设计 AI生成图片有一个必要条件是 prompt(提示词) 我们都知道，一个句子主要由主语 + 谓语 + 宾语 + 定语/状语/补语/表语组成。那一个prompt都由什么组成呢？chatgpt是这样说的： ![如何写作-11-20-2024\_11\_11\_AM.png](https://p3-xtjj-sign.byteimg.com/tos-cn-i-73owjymdk6/fb86198cd0834e5299c061eec4196c69~tplv-73owjymdk6-jj-mark-v1:0:0:0:0:5o6Y6YeR5oqA5pyv56S-5Yy6IEAgTG9naWNGbG93:q75.awebp?rk3s=f64ab15b&x-expires=1760566185&x-signature=wBWhURIP%2FcrvRe00Ysvq29JTDow%3D) 不同的AI平台提供的prompt使用指南则更具体一些： ![通义万相文字作画—使用指南-·-钉钉文档-11-19-2024\_01\_17\_PM.png](https://p3-xtjj-sign.byteimg.com/tos-cn-i-73owjymdk6/d7cb95f7c9d948a0bc5923122f8e2c15~tplv-73owjymdk6-jj-mark-v1:0:0:0:0:5o6Y6YeR5oqA5pyv56S-5Yy6IEAgTG9naWNGbG93:q75.awebp?rk3s=f64ab15b&x-expires=1760566185&x-signature=iDR5oYZtZFniv8bQU8C3kUTTwcM%3D)

通义万相提示词指南截图

![可灵-AI-使用指南-图片生成-轻雀文档-11-19-2024\_01\_19\_PM.png](https://p3-xtjj-sign.byteimg.com/tos-cn-i-73owjymdk6/a04606a5ac3e4c1992bb9f207dcf8c87~tplv-73owjymdk6-jj-mark-v1:0:0:0:0:5o6Y6YeR5oqA5pyv56S-5Yy6IEAgTG9naWNGbG93:q75.awebp?rk3s=f64ab15b&x-expires=1760566185&x-signature=brPxuNlrZIaagtjizzbuQCvUCnk%3D)

可灵AI提示词指南截图

大概懂了，就是要描述什么人在什么场景下做什么，所以我们要传给AI的内容大概可以符合这个公式：

「某个场景 + 某个主体 + 在做某个动作」