DeepSeek+Drawio+SVG绘制架构图-一种真正可行实用的方法和思路

boyanx4个月前技术教程28

Hello,大家好,我是人月聊IT。

今天接着跟大家聊采用DeepSeek工具来绘制软件功能架构图。对于场景的流程图,包括软件设计里面的用例图,序列图讲这块的已经很多了。即通过DeepSeek工具来生成源代码,再配合Mermaid或PlantUML工具来继续图形的生成。

但是实际上这类绘图真正的难点在类似软件功能架构图的绘制。在这之前我试用了类似Draw.io,PlantUML,Mermaid等各种工具。也包括了在线的类似 ProcessOn,亿图等各种绘图工具。也不断的在测试和验证如何绘制功能架构图。

最终的结论就是要绘制出完全符合我们需求的功能架构图,我们仍然需要前期进行足够的提示与约束往往才能够达成。即我们不需要去做大模型的技术参数微调,更多的是应该和AI交互不断调整我们的提示语模板,最终得到我们期望的一个绘图结果。

今天拿Drawio和SVG两种场景来举例说明。

1. DeepSeek+Drawio来生成架构图

首先是Drawio,我们和DeepSeek对话如下:

我现在需要一个标准的CRM系统的功能架构图。请直接帮我用draw.io绘制,输出可以导入到draw.io在线工具的xml源代码文件给我。

基于这个需要返回相关的源代码文件如下:

我们直接将代码文件存储为本地的xml文件,然后再导入到Draw.io在线绘图工具,那么得出的图形如下:

可以看到第一次的输出结果,完全不是我们希望的场景功能架构图。于是我们对提示语模板进行调整,调整后如下:

在新的提示语中我们明确的架构图的分层,核心的应用功能层的模块要求和具体的布局方式等信息。然后AI帮我们重新生成了XML的源代码文件,再一次导入到Draw.io工具后生成的架构图如下:

从上图来看,基本上已经有所模样,但是如果到真正可用还需要做进一步的细化调整。但是基本说明这个思路是可行的。

2. DeepSeek+SVG来生成架构图

接着我们来试验第二种方式,即让DeepSeek直接输出html网页文件给我们,在网页文件中直接给出SVG绘图的源代码文件。

当然我们的思路还是一样,首先只给最简单的提示语,让DeepSeek给我们一个标准的CRM系统功能架构图。

注意在我没有做任何调整的时候,AI绘图结果如下:

这显然跟我们的希望还有明显的差距。第二次我们仍然是加强提示语约束,和前面draw.io绘图采用同样的提示语约束。

有了这个约束后重新绘图如下:

大家注意看,这个和我们希望的功能架构图已经相当类似了。但是我们还希望应用层一级功能模块下的二级功能能否多列出几个核心功能。因此我们用MES系统功能架构绘制进一步测试,希望能够多列出几个二级功能点,还是同样的提示语代码。

我们再次运行AI生成的SVG图,结果如下:

我们还可用再增加一些提示词约束,类似基础层背景色为#A56739,中间层背景色为#00AA48,门户层背景色为#0AFEE1。同时我们对一些边距进行了调整,当然你也可以直接修改生成的SVG源代码。得到最终的架构图如下:

所以从上面的简单提示语微调可以看到。最终输出的架构图基本能够满足我们的需求。真正好用的不是结合什么在线作图工具,而是直接出SVG的可以浏览器直接运行的源代码文件。而且这种源代码文件本身还可以进行修改。

简单总结就是要有最够耐心调整下提示语约束,就可以生成出符合你期望的软件功能架构图,对于其它架构图也是同样的道理。

今天分享就到这里,希望对大家有所启发。



标签: svg 生成

相关文章

还能用 AI 生成 SVG(可缩放矢量图像)?我们来聊聊 SVG

文章链接:https://mp.weixin.qq.com/s/uWu4_yM5wb-eFkBlMBD-TA什么是 SVGSVG(Scalable Vector Graphics,可缩放矢量图形)基于...

Visual Studio Code 扩展介绍 - SVG

前言前几天在电脑上下载了一个开源项目,在通过Visual Studio Code浏览浏览该项目目录结构时,发现项目中有svg格式的文件,打开后只能看到一堆XML格式的内容,无法实时预览最后的显示效果。...

绝了!一键用AI生成高颜值动态PPT(附详细步骤+Prompt)

大家好,我是一名酷爱研究AI的产品经理,最近我有个新发现:那些花了你3天做出来的PPT,现在用AI可以1小时搞定!而且颜值还高! 为什么AI做PPT比传统方式效率高10倍?我用一张图就能告诉你: AI...

5分钟生成!Deepseek让文字“飘”进云朵,设计师集体失业?

【开篇爆点】“设计师小王熬夜3天画的云朵字,被AI5秒搞定!朋友圈晒图后,同行炸锅了……”当Deepseek遇上创意设计,这场“人机协作”的视觉革命正在席卷设计圈。从手写字体到动态云朵字,从LOGO设...

亿图在线怎么制作贺卡?小白也能轻松制作出一张精美的贺卡

贺卡是什么呢?贺卡是人们在喜庆的日期或者事件的时候表示问候的一种卡片。如生日、情人节、结婚结年日、圣诞节、春节等。目前比较流行的是生日贺卡、节日贺卡、纪念日贺卡、结婚贺卡等等。可以在贺卡上,留下祝福的...

DeepSeek生成绘制SVG的H5页面

通过对话,deepseek能辅助完成一个绘图H5页面。如下:完成之后的效果如下:如上咨询步骤给选中的图形加轮廓线选中多线段后出现虚线轮廓移动时,轮廓线没有移动要求轮廓然随拖动移动增加右键菜单,用来删除...

发表评论    

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。