设计建模工具实战：Axure / PowerDesigner / VSCode 全攻略

Wed, 15 Oct 2014 00:00:00 +0800

一、Windows 设计与建模工具全景

2014 年的 Windows 设计与开发工具链呈"专业分工"格局——没有一款 IDE 能通吃所有场景。本文整理：

Axure RP —— 交互原型
PowerDesigner —— 数据库建模
VSCode —— 轻量代码编辑器
Trae —— AI 辅助编程
Notepad++ —— 文本编辑瑞士军刀
Android Studio —— 移动开发

这套组合至今仍是"前端 + 后端 + 数据 + 移动"团队的标配。

二、Axure RP：交互原型的事实标准

2.1 定位

Axure RP（Rapid Prototyping）2003 年起源，是产品经理 + UX 设计师的"画图工具"。2014 年 Axure 7 已成熟，2017 年 Axure 8 加了 Team Project。

2.2 安装

官方 https://www.axure.com/。Windows 版 + Mac 版。安装时注意：

64 位系统 装 64 位（默认）
首次启动 要登录 Axure 账户激活
字体选 Microsoft YaHei / 思源黑体（比系统默认宋体好看 10 倍）

2.3 核心功能

页面与母版（Master）：

页面：每个独立屏
母版：复用元素（导航栏/页脚）
母版拖到页面就是占位，双击进入母版修改会全站联动

交互面板（Interactions）：

1
2
3
4
5


用例 1：登录失败弹窗
- 触发：点击登录按钮
- 条件：用户名 == "" OR 密码 == ""
- 动作：显示 Toast → 红色文字 "请输入用户名密码"
- 动作：聚焦到第一个空输入框

动态面板（Dynamic Panel）：

状态 A：未登录（头像占位 + 登录按钮）
状态 B：已登录（用户头像 + 退出按钮）
状态切换：交互中 Set Panel state to B

2.4 团队协作

Axure Share：上传 RP 文件到云 → 团队成员在线查看
链接预览：https://share.axure.com/XXXXX
导出 HTML 包：菜单 Publish → Generate HTML Files，双击 index.html 离线预览

2.5 与现代工具对比

工具	强项
Axure RP	逻辑交互最完整、逻辑面板最丰富
Figma	多人实时协作、组件库生态
Sketch	Mac 生态、矢量
墨刀 / 即时设计	国产、轻量
draw.io	流程图 + ER 图免费

经验法则：复杂逻辑交互用 Axure，简单 mockup 用 Figma。

三、PowerDesigner：数据库建模的老牌强者

3.1 定位

PowerDesigner 1989 年起源 Powersoft，SAP 收购 Sybase 后纳入麾下。2014 年是 16.5/16.6 版本。两套核心能力：

CDN/PDM：概念数据模型 / 物理数据模型
OOM/BPM：面向对象模型 / 业务流程模型

3.2 安装

16.5/16.6 SP06 兼容 Windows 7/8/10
16.7 是民间对 16.6 升级包的称呼
需要 JDK 1.6+（是的 2014 时代需要 Java）

3.3 CDM → PDM → SQL 三件套

1
2
3
4
5


概念模型（CDM）
 ↓ 自动转换
物理模型（PDM）
 ↓ 生成 SQL
数据库（MySQL/Oracle/PostgreSQL/...）

为什么需要 CDM：

CDM 关注业务实体（客户、订单、商品）
PDM 关注数据库细节（字段类型、索引、约束）
业务变了只改 CDM，PDM 自动重生成

3.4 名称转注释

PDM 里 Name 是逻辑名（中文友好），Code 是物理名（英文/SQL 字段）。批量把 Name 复制到 Comment：

Tools → Execute Commands → Edit/Run Scripts：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10


' Name → Comment
Dim model
Set model = ActiveModel

For Each tbl In model.Tables
 tbl.Comment = tbl.Name
 For Each col In tbl.Columns
 col.Comment = col.Name
 Next
Next

执行后所有字段 Comment 都是 Name 中文，DDL 导出时自动带 COMMENT。

3.5 全局通用字段

每个表都加：create_by / create_time / update_by / update_time / sys_org_code。

两种做法：

PDM 全局模板：Tools → Model Options → Naming Convention → Default Field 添加
复制粘贴：先建一个表，右键 → Copy → Paste 保留字段

3.6 导出 DDL

Database → Generate Database：

Directory: 输出目录
File name: 默认 Script.sql
Generation options：勾选 Check model、Generate name in comment

导出的 SQL 直接 Navicat 执行。

3.7 PDMReader：免费 PDM 查看器

PDM 文件是 PowerDesigner 私有格式，没有 PD 看不了。PDMReader 是国产开源 PDM 浏览器：

装好后直接 .pdm 文件 → 自动生成 HTML 报告
免费导出 Word / Excel 数据字典

下载地址 http://www.pdmreader.com/（小众，但好用）。

四、VSCode：轻量编辑器的王者

4.1 定位

VSCode 2015-04 发布，4 年时间击败 Sublime、Atom。2014 时代它还是个"新生儿"——本文以 2024 视角写"VSCode 在 2014 之后的崛起"。

4.2 必备扩展（按场景）

通用：

扩展	用途
`Chinese (Simplified) Language Pack`	中文菜单
`Atom One Dark Theme`	经典暗色
`Markdown PDF`	MD 转 PDF
`IntelliJ IDEA Keybindings`	IDEA 快捷键习惯

Java 开发：

扩展	用途
`Extension Pack for Java`	微软官方全家桶
`Spring Boot Extension Pack`	Spring 全家桶
`Maven for Java`	Maven 集成
`Debugger for Java`	调试

4.3 配置代理

VSCode 启动可能需要代理（如果插件下载慢）：

File → Preferences → Settings → 搜 proxy：

1
2
3
4


{
 "http.proxy": "http://127.0.0.1:1081",
 "http.proxyStrictSSL": false
}

或者给 git 单独设代理：

1

git config --global http.https://github.com.proxy socks5://127.0.0.1:1080

4.4 常用快捷键

快捷键	作用
`Ctrl + P`	快速打开文件
`Ctrl + Shift + P`	命令面板
`Ctrl + B`	切换侧边栏
`Ctrl +` `	切换终端
`Ctrl + Shift + F`	全项目搜索
`F12`	跳转到定义
`Alt + F12`	查看定义（侧边）
`Ctrl + K Ctrl + C`	注释
`Shift + Alt + F`	格式化
`Ctrl + /`	行注释

五、Trae：AI 辅助编程的新时代

5.1 定位

Trae（2024）是字节跳动推出的 AI Native IDE，深度集成 Claude 3.5/GPT-4o。对标 Cursor。

5.2 核心能力

AI Chat 侧栏：写需求 → AI 自动改多文件
Inline Edit：Ctrl+K 在光标处改写代码
Agent Mode：写任务 → AI 拆解 → 自动执行 + 自我测试
上下文感知：自动读光标所在文件 + 关联文件

5.3 适用场景

新项目从 0 到 1：Agent 模式一键生成脚手架
老项目重构：AI 全项目扫描 → 出重构方案
Bug 定位：贴错误堆栈 → AI 给出最小复现 + 修复建议
单元测试生成：选中方法 → AI 自动生成 JUnit 5 / pytest 用例

六、Notepad++：Windows 文本编辑器之王

6.1 定位

Notepad++ 2003 年由 Don Ho 开发，基于 Scintilla 编辑组件。2014 时代是程序员最常用的"非 IDE"文本编辑器。

6.2 安装与配置

官方 https://notepad-plus-plus.org/downloads/
32 位版兼容更多插件
首次启动：Settings → Preferences → General → Language → 中文（界面中文化）
字体：Consolas 10pt（等宽字体之首）

6.3 必备插件

插件	用途
`Compare`	文件差异对比
`Explorer`	文件浏览器侧栏
`NppFTP`	内置 FTP/SFTP
`JSTool`	JSON 格式化
`XML Tools`	XML 美化
`MIME Tools`	Base64 编解码
`Markdown Panel`	MD 实时预览

6.4 杀手锏功能

列编辑：Alt + 鼠标拖动（多光标同时输入）
正则替换：Ctrl+H 勾选 Regular expression
多文件搜索：Ctrl+Shift+F
宏录制：Macro → Start Recording（重复操作自动化）

6.5 与 VSCode 对比

维度	Notepad++	VSCode
启动速度	★★★★★	★★★
内存	★★★★★	★★
插件生态	★★	★★★★★
大文件（>1 GB）	★★★★	★★（会卡）
多语言	★★★	★★★★★

经验法则：大文件 / 临时查看 → Notepad++，项目开发 → VSCode。

七、Android Studio：移动开发官方 IDE

7.1 定位

2013-12 Google 发布 Android Studio 1.0，正式取代 Eclipse ADT。基于 IntelliJ IDEA 社区版——前文提到的 IDEA 快捷键、插件全部通用。

7.2 安装与 SDK

官方 https://developer.android.com/studio。

安装时选 Android SDK + Android Virtual Device (AVD)
首次启动自动下载 SDK 平台工具 + Build Tools，强烈建议配置代理（详见 IDEA 章节）

7.3 Gradle 配置

gradle-wrapper.properties：

1
2
3
4
5


distributionBase=GRADLE_USER_HOME
distributionPath=wrapper/dists
distributionUrl=https\://services.gradle.org/distributions/gradle-8.5-bin.zip
zipStoreBase=GRADLE_USER_HOME
zipStorePath=wrapper/dists

国内加速：用阿里云镜像：

1

distributionUrl=https\://mirrors.aliyun.com/macports/distfiles/gradle/gradle-8.5-bin.zip

7.4 模拟器选型

Android Studio 自带 AVD Manager：

x86_64 Image：Intel CPU 加速（推荐）
ARM Image：兼容性好但慢
物理机调试：开发者选项 → USB 调试 → adb devices 看

7.5 关键快捷键

快捷键	作用
`Alt + Enter`	导包 / 修复
`Ctrl + O`	重写方法
`Ctrl + I`	实现方法
`Ctrl + Shift + A`	找动作
`Ctrl + Alt + L`	格式化
`Alt + Insert`	生成代码

八、组合实战：产品→设计→开发→发布

8.1 完整工作流

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12


产品经理（Axure）
 ↓ 输出原型 + 交互文档
UX 设计师（Figma/Axure）
 ↓ 输出 UI 设计稿
前端（VSCode + Trae AI）
 ↓ 输出静态页面
后端（IntelliJ IDEA）
 ↓ 输出 API + 业务
数据库（PowerDesigner）
 ↓ 输出 PDM + DDL
运维（Navicat + 服务器）
 ↓ 部署 + 监控

8.2 移动端

1
2
3
4
5
6
7
8


产品（Axure）
 ↓
UI 设计师（Figma）
 ↓
Android 端（Android Studio）
iOS 端（Xcode）
 ↓
测试（Android Studio AVD + 真机）

九、常见问题

9.1 Axure 启动慢

关掉"自动保存"
减少页面数量
升级 SSD

9.2 PowerDesigner 反向工程（从数据库生成 PDM）

File → Reverse Engineer → Database：

选择 ODBC 数据源或自定义 JDBC
选表 → 生成 PDM
注意：需要先在 Windows 装好 ODBC 驱动

9.3 VSCode 插件装不上

Extensions → Search → Install 失败通常因为插件市场被墙。对策：

1
2


# 离线安装
code --install-extension /path/to/extension.vsix

或配置国内镜像：编辑 argv.json 替换 marketplace。

9.4 Notepad++ 大文件卡

Settings → Preferences → Editing → 取消 Enable large file detection（超过 100MB 自动关掉语法高亮）。

9.5 Android Studio Gradle 同步慢

~/.gradle/init.gradle：

1
2
3
4
5
6
7


allprojects {
 repositories {
 maven { url 'https://maven.aliyun.com/repository/public' }
 maven { url 'https://maven.aliyun.com/repository/google' }
 maven { url 'https://maven.aliyun.com/repository/gradle-plugin' }
 }
}

十、下一步

想看 IDEA 深度：[2014-04-15 IntelliJ IDEA 全攻略]
想看版本控制：[2014-11-15 Git 与版本控制]
想看数据库建模输出：[2016-11-15 数据库客户端实战]

本文写于 2014 年，回看当时：Axure 7 是产品经理标配，Figma 直到 2016 年才发布；PowerDesigner 至今仍是金融/电信/制造行业的"老牌"；VSCode 2015 年发布后 4 年击败 Sublime 创下编辑器神话——这些工具的演化史就是一部 Web 开发演进史。

Notepad++ on Liangweidong's blog