
关注我公众号的可能会发现我最近发借助AI进行SVG绘图的文章比较多。实际对于AI绘图不是重点,而是我一直在验证和测试各种可视化的建模方法,特别是基于模型驱动的可视化建模方法。
包括我前面分享过的基于系统思维+逻辑学的思路整理的绘图提示词。这个提示词的核心还是在于任何一个系统的运行,基于系统思维都是内部多个组件之间的相互影响和相互制约,让事物体现出了外在的行为或运动状态。
什么是逻辑?
逻辑的核心实际包括了两个方面,一个是静态关系逻辑,一个是动态行为逻辑。静态关系包括了关联,依赖,因果,分类,归属,相关等。而动态的行为逻辑则体现在归纳逻辑,演绎逻辑和辩证法的对立统一。
就任何一个可视化建模来说,核心是组件的拆分和组件关系的识别,而真正影响一个模型图好坏的则是底层逻辑是否清晰。
今天翻看我个人历史文章,刚好又看到MBSE基于模型的系统工程,而MBSE不也正是一套基于模型的建模方法论吗?其核心仍然是体现了系统工程和系统思维。那么是否可以基于MBSE来进行可视化建模输出。
要做这个事情,首先还是要看下MBSE核心元素和相互之间的关系:
在基于模型的系统工程(MBSE)中,可视化建模是核心环节,其通过图形化符号和元素来表达系统的需求、结构、行为和参数等。以下是MBSE模型工程中进行可视化建模的核心元素、符号及其关系。
那基于以上核心组件和关系逻辑,我们可以让AI先帮我们输出一段完整的MBSE进行可视化图形建模输出的提示词,具体如下:
# 模型驱动构图提示语模板
## 基于MDA思想与康德哲学十二范畴的可视化建模方法
---
## 一、理论基础
### 1.1 MDA模型驱动架构思想
模型驱动架构(Model-Driven Architecture)是一种通过模型来描述、理解和解决现实世界问题的方法论。在本构图体系中,我们将任何复杂问题或事物都视为可以拆分为多个组件的系统,通过识别组件间的关系来实现整体理解。
### 1.2 康德哲学十二范畴在构图中的应用
基于康德哲学的十二范畴,我们将组件间的关系归纳为以下核心类型:
#### 量的关系(Quantity Relations)
-
**单一性关系**
:一对一的直接关系
-
**复多性关系**
:一对多或多对多的复合关系
-
**全体性关系**
:整体与部分的包含关系
#### 质的关系(Quality Relations)
-
**实在性关系**
:正向促进、支持关系
-
**否定性关系**
:负向阻碍、冲突关系
-
**限制性关系**
:条件约束、边界限定关系
#### 关系的关系(Relation Relations)
-
**实体偶性关系**
:主体与属性的依附关系
-
**因果关系**
:原因与结果的推导关系
-
**相互作用关系**
:双向影响、协同关系
#### 样态关系(Modality Relations)
-
**可能性关系**
:潜在的、或然的关系
-
**存在性关系**
:现实的、确定的关系
-
**必然性关系**
:逻辑必需的、不可避免的关系
---
## 二、组件类型定义与视觉规范
### 2.1 核心组件类型
#### 实体组件(Entity Components)
-
**形状**
:矩形(圆角)
-
**填充色**
:#e3f2fd(浅蓝色)
-
**边框**
:2px solid #1976d2
-
**用途**
:表示具体的事物、概念、系统等
#### 过程组件(Process Components)
-
**形状**
:椭圆形
-
**填充色**
:#f1f8e9(浅绿色)
-
**边框**
:2px solid #388e3c
-
**用途**
:表示动作、流程、变化等
#### 决策组件(Decision Components)
-
**形状**
:六边形(矩形形状,不使用三角形)
-
**填充色**
:#fff3e0(浅橙色)
-
**边框**
:2px solid #f57c00
-
**用途**
:表示判断、选择、分支等
#### 属性组件(Attribute Components)
-
**形状**
:圆形
-
**填充色**
:#f3e5f5(浅紫色)
-
**边框**
:2px solid #7b1fa2
-
**用途**
:表示特征、属性、参数等
#### 结果组件(Result Components)
-
**形状**
:六边形
-
**填充色**
:#e8f5e8(浅绿色)
-
**边框**
:2px solid #2e7d32
-
**用途**
:表示输出、结果、目标等
#### 环境组件(Context Components)
-
**形状**
:圆角矩形(大圆角)
-
**填充色**
:#fce4ec(浅粉色)
-
**边框**
:2px dashed #c2185b
-
**用途**
:表示环境、背景、约束等
---
## 三、关系连接线规范
### 3.1 线条类型定义
#### 实线连接(Solid Lines)
-
**用途**
:表示确定的、强关系
-
**样式**
:stroke-width: 2px, stroke: #424242
-
**适用关系**
:因果关系、实在性关系、必然性关系
#### 虚线连接(Dashed Lines)
-
**用途**
:表示不确定的、弱关系
-
**样式**
:stroke-width: 2px, stroke-dasharray: "5,5", stroke: #757575
-
**适用关系**
:可能性关系、限制性关系、否定性关系
#### 点线连接(Dotted Lines)
-
**用途**
:表示潜在的、隐含关系
-
**样式**
:stroke-width: 1px, stroke-dasharray: "2,3", stroke: #9e9e9e
-
**适用关系**
:实体偶性关系、复多性关系
### 3.2 箭头类型定义
#### 单向箭头(→)
-
**用途**
:表示单向影响、流向
-
**marker-end**
:arrowhead
-
**适用**
:因果关系、时间顺序关系
#### 双向箭头(↔)
-
**用途**
:表示相互影响、双向关系
-
**marker-start & marker-end**
:arrowhead
-
**适用**
:相互作用关系、协同关系
#### 无箭头(—)
-
**用途**
:表示关联、连接,无方向性
-
**适用**
:包含关系、分类关系、全体性关系
### 3.3 连接线样式增强
#### 粗细变化
-
**粗线**
(stroke-width: 3px):强关系、主要关系
-
**中线**
(stroke-width: 2px):一般关系
-
**细线**
(stroke-width: 1px):弱关系、次要关系
#### 颜色编码
-
**蓝色**
(#1976d2):逻辑关系、推理关系
-
**绿色**
(#388e3c):正向关系、促进关系
-
**红色**
(#d32f2f):负向关系、冲突关系
-
**橙色**
(#f57c00):条件关系、约束关系
-
**紫色**
(#7b1fa2):依赖关系、从属关系
#### 曲线设计
-
**使用贝塞尔曲线**
:增加视觉美感和动态感
-
**曲线控制点**
:避免直线连接的生硬感
-
**路径优化**
:避免连接线交叉重叠
---
## 四、SVG绘制提示语模板
### 4.1 通用模型构图模板
```
请绘制一个SVG格式的模型构图,要求:
**图表标题**:[模型名称]概念模型图
**画布规格**:
- 尺寸:1200px × 800px(3:2比例)
- 背景:白色(#ffffff)
- 边距:50px
**组件要求**:
- 根据以下组件类型绘制:[列出具体组件及其类型]
* 实体组件:矩形,填充色#e3f2fd,边框2px solid #1976d2
* 过程组件:椭圆形,填充色#f1f8e9,边框2px solid #388e3c
* 决策组件:六边形(矩形形状),填充色#fff3e0,边框2px solid #f57c00
* 属性组件:圆形,填充色#f3e5f5,边框2px solid #7b1fa2
* 结果组件:六边形,填充色#e8f5e8,边框2px solid #2e7d32
* 环境组件:圆角矩形,填充色#fce4ec,边框2px dashed #c2185b
**关系连接**:
- 根据以下关系类型绘制连接线:[列出具体关系]
* 因果关系:实线单向箭头,颜色#1976d2,标注"因果"
* 相互作用关系:实线双向箭头,颜色#388e3c,标注"相互作用"
* 包含关系:无箭头实线,颜色#7b1fa2,标注"包含"
* 依赖关系:虚线单向箭头,颜色#f57c00,标注"依赖"
* 约束关系:点线,颜色#d32f2f,标注"约束"
**连接线规范**:
- 使用贝塞尔曲线,避免直线连接
- **重要**:连接线的起点和终点必须精确连接在组件形状边框的边上的具体点位
- 在连接线中点位置标注关系名称
- 多重关系使用多条连接线
- 线条粗细根据关系强度调整(1-3px)
- 箭头大小设置为标准大小的一半(markerWidth="3" markerHeight="3")
**文字标注**:
- 字体:Arial, sans-serif
- 组件标签:16px, 粗体, 颜色#212121(比原来加大2px)
- 关系标签:14px, 常规, 颜色#424242(比原来加大2px)
- 标题:20px, 粗体, 颜色#1976d2(比原来加大2px)
**布局要求**:
- 核心组件居中放置
- 相关组件按逻辑关系分组
- 保持视觉平衡和层次感
- 避免连接线交叉
**视觉效果**:
- 组件添加轻微阴影效果
- 使用渐变色增强立体感
- 保持整体色彩协调统一
- 添加适当的留白空间
**图例说明**:
- 在右下角添加组件类型图例
- 在左下角添加关系类型图例
- 图例使用小尺寸示例图形
**质量检查**:
绘制完成后,请进行以下详细检查:
1. 检查所有连接线是否精确连接在组件边框上
2. 检查是否有使用三角形形状(应全部避免)
3. 检查决策节点是否使用六边形矩形形状
4. 检查箭头大小是否为标准大小的一半
5. 检查字体大小是否比原来增加2px
6. 检查画布尺寸是否为1200px×800px
7. 检查整体布局是否美观平衡
8. 检查文字标注是否清晰易读
请确保图表清晰易读,逻辑关系明确,视觉效果美观。
```
### 4.2 专项模型构图模板
#### 4.2.1 问题分析模型
```
请绘制一个SVG格式的问题分析模型图,要求:
**分析主题**:[具体问题描述]
**核心组件**:
- 问题核心(实体组件,中心位置)
- 问题表现(属性组件,围绕核心)
- 影响因素(实体组件,外围分布)
- 分析过程(过程组件,连接各要素)
- 解决方案(结果组件,输出位置)
**关系网络**:
- 因果关系:从影响因素指向问题核心
- 表现关系:从问题核心指向问题表现
- 分析关系:从问题表现指向分析过程
- 解决关系:从分析过程指向解决方案
**布局结构**:采用中心辐射式布局,问题核心居中,其他组件按逻辑层次分布
**特殊要求**:
- 使用颜色深浅表示问题严重程度
- 用线条粗细表示影响强度
- 添加时间维度标注(如适用)
```
#### 4.2.2 系统架构模型
```
请绘制一个SVG格式的系统架构模型图,要求:
**系统名称**:[系统名称]
**架构层次**:
- 用户层(环境组件,顶部)
- 应用层(实体组件,中上部)
- 服务层(过程组件,中部)
- 数据层(实体组件,中下部)
- 基础设施层(环境组件,底部)
**组件交互**:
- 调用关系:上层向下层的单向箭头
- 数据流:双向箭头表示数据交换
- 依赖关系:虚线表示依赖
- 接口关系:特殊标记表示API接口
**布局结构**:采用分层架构布局,从上到下展示系统层次
**特殊标注**:
- 标注关键接口和协议
- 标注数据流向和格式
- 标注安全边界和控制点
```
#### 4.2.3 知识体系模型
```
请绘制一个SVG格式的知识体系模型图,要求:
**知识领域**:[具体领域]
**知识组件**:
- 核心概念(实体组件,中心区域)
- 基础理论(实体组件,基础层)
- 方法技能(过程组件,应用层)
- 实践案例(结果组件,实例层)
- 发展趋势(属性组件,扩展层)
**知识关系**:
- 基础关系:理论支撑概念
- 应用关系:概念指导方法
- 实践关系:方法产生案例
- 演进关系:发展趋势影响全局
**布局结构**:采用知识网络布局,体现知识的层次性和关联性
**特殊要求**:
- 用节点大小表示知识重要性
- 用连接密度表示关联强度
- 添加学习路径标注
```
---
## 五、康德十二范畴关系标注规范
### 5.1 关系标注模板
每种关系类型都应在连接线上明确标注,格式为:
`[关系类型]:[具体关系名]`
#### 量的关系标注
-
单一性:
`单一:直接影响`
、
`单一:唯一决定`
-
复多性:
`复多:多重影响`
、
`复多:并行作用`
-
全体性:
`全体:整体包含`
、
`全体:系统构成`
#### 质的关系标注
-
实在性:
`实在:正向促进`
、
`实在:积极支持`
-
否定性:
`否定:负向阻碍`
、
`否定:相互冲突`
-
限制性:
`限制:条件约束`
、
`限制:边界限定`
#### 关系的关系标注
-
实体偶性:
`偶性:属性依附`
、
`偶性:特征表现`
-
因果关系:
`因果:原因导致`
、
`因果:结果产生`
-
相互作用:
`互动:双向影响`
、
`互动:协同作用`
#### 样态关系标注
-
可能性:
`可能:潜在影响`
、
`可能:或然关系`
-
存在性:
`存在:现实关系`
、
`存在:确定联系`
-
必然性:
`必然:逻辑必需`
、
`必然:不可避免`
### 5.2 关系强度表示
使用线条粗细和颜色深浅表示关系强度:
-
**强关系**
:3px粗线,深色(#212121)
-
**中关系**
:2px中线,中色(#424242)
-
**弱关系**
:1px细线,浅色(#757575)
---
## 六、使用指导与最佳实践
### 6.1 模型构图流程
1.
**问题分析**
:明确要建模的问题或系统
2.
**组件识别**
:识别关键组件并确定类型
3.
**关系梳理**
:分析组件间关系并分类
4.
**布局设计**
:选择合适的布局结构
5.
**视觉优化**
:调整颜色、线条、标注
6.
**验证完善**
:检查逻辑完整性和视觉效果
### 6.2 常见布局模式
#### 中心辐射式
-
适用:问题分析、影响因素分析
-
特点:核心组件居中,相关组件围绕分布
#### 分层架构式
-
适用:系统架构、组织结构
-
特点:按层次从上到下或从左到右排列
#### 网络关联式
-
适用:知识体系、复杂关系网络
-
特点:组件分散分布,关系线交织
#### 流程时序式
-
适用:过程分析、时间序列
-
特点:按时间或逻辑顺序线性排列
### 6.3 质量检查清单
-
[ ] 组件类型选择是否准确
-
[ ] 关系类型标注是否清晰
-
[ ] 连接线样式是否符合规范
-
[ ] 布局是否美观平衡
-
[ ] 文字标注是否清晰易读
-
[ ] 颜色搭配是否协调
-
[ ] 逻辑关系是否完整
-
[ ] 图例说明是否完备
---
## 七、扩展应用场景
### 7.1 学术研究应用
-
理论框架构建
-
研究方法设计
-
概念关系梳理
-
文献综述可视化
### 7.2 商业分析应用
-
商业模式分析
-
市场关系梳理
-
竞争格局分析
-
价值链分析
### 7.3 系统设计应用
-
软件架构设计
-
业务流程建模
-
组织架构设计
-
产品功能规划
### 7.4 教育培训应用
-
知识体系构建
-
学习路径设计
-
概念关系教学
-
思维导图制作
---
*本模板基于MDA模型驱动思想和康德哲学十二范畴理论,为复杂问题的可视化建模提供系统性方法指导。*基于这套提示词,我们来做以下简单验证。
首先让其对油电混动汽车的工作原理进行可视化建模,输出独立个svg文件给我。看下输出效果如下:

接着我们再让其输出一个基于激光雷达的汽车高阶自动驾驶系统的MBSE模型驱动的可视化建模,具体输出的图形如下:

具体使用的大模型为Trae+Claude4.0 Sonnet。感兴趣的大家可以用我们上面贴出的提示语自己做下验证。
最后再说下这个AI辅助的图形输出有什么作用?
大家是否还记得我们前面讲学习方法和模式的文章,里面谈到一个重点,就是对于任何一个新知识或新领域的学习,都需要快速的构建一个粗粒度的框架,并快速的了解其核心的概念模型。而要了解这个概念模型,就需要明白这个复杂大系统包括了哪些组件,组件之间有哪些相互依赖和制约关系。而MBSE模型的可视化输出刚好可以解决这个问题。
类似上面的自动驾驶系统,我们可以快速地看到分为了子系统,逻辑组件,物理组件几个关键的层次。同时包括了感知,决策,控制,通信四个核心的子系统,同时也可以看到这四个核心子系统里面核心组件之间的相互关联和制约关系。实际上我们只需要能够将这个模型图讲明白,那么我们对这个复杂系统基本就有了完整概念模型层级的了解。而不是一开始就陷入到细枝末节中而忽视了对事物整体和全局的理解。