一文介绍我用过的设计工具

一文介绍我用过的设计工具

前言

虽然题目要求只是原型设计工具，但实际上做起来时什么都会用一点，因此本文将简述软件工程入学两年来笔者自己用过的设计工具。

*另叠甲： 纯个人观点，在笔者看来工具始终是工具，关键在于人怎么使用。尤其现在有image2了，对我们这种非专业设计师，原型设计很多时候真不如image2随手画两笔。

正篇

① 原型设计 & UI/UX 设计工具

这一块都是一些便捷的小工具，它们更适合在早期工程开展前进行迅速的设计、交流并快速迭代。当这一部分工具完成后，有时会进入第二步进行更繁杂的设计，也有时直接进入第三步进入工程设计工具。

Figma

最符合题目要求的工具。
Figma官方强调的就是协作式设计、原型、反馈、设计系统和产品开发流程。
它适合做App、网页、小程序界面，交互原型，组件库，设计系统等等，但对精细图片、矢量图的支持就差一些——这也是与Illustrator比起来是这样的，其自身已经足够强大可以满足95%设计使用了

能用、好用、够用，这就是Figma。
另外Figma总是推荐它的多人协作功能，看起来还是很好用的，不过笔者没用过，就不多评价了。

---

Canva 可画

更便捷、非专业的设计工具。
它的特点是模板多、使用快捷方便，可以迅速做出来第一版能用且非常好看的原型设计。但问题在于其更注重美观而不是实用性，毕竟其并不专门为UI / UX设计考虑。
所以更多时候还是用于海报 / Logo这种的绘制。

---

Drawio / Diagrams

比起设计工具，drawio应该被认为是图表工具，做设计并算很好用。
但它的优点实在是太多了：

• 免费、开源。因此也常常被嵌入到其他平台作为图表工具使用。
• 多平台，包括Web端、桌面端、移动端、甚至是VSCode插件端。
• 支持本地 / 云端保存。
• 基于xml，可以导出svg。
• ‌仅官方就支持流程图‌、‌UML图‌、‌ER图‌、‌网络拓扑图‌、‌思维导图‌及组织结构图等20余种图表，更别提还有第三方插件、还可以自己设计样式。

作为这个专业的学生，很难离得开它是真的。

---

墨刀 / Axure

这两个笔者没有实际用过，因此只能由LLM简单介绍一下。
墨刀作为国内在线原型工具，主打快速拖拽和实时协作，适合产品经理快速构建页面原型并进行团队评审。它可以直接在浏览器中使用，不依赖复杂安装，支持扫码预览、多人评论和版本管理，便于跨部门沟通和早期迭代。墨刀的优势在于上手成本低，即便没有专业设计基础，也能快速搭建页面结构、模拟简单交互，并能通过模板和组件库提高效率。适用于移动端App、网页端原型和小型后台系统的初期设计。

Axure 则更偏向高保真、功能型原型，能够处理复杂业务逻辑，包括动态面板、条件交互、表单验证、权限控制和复杂的工作流。学习曲线相对较陡，但它的逻辑表达能力极强，可以模拟大部分真实产品交互，尤其适合B端系统和企业级后台管理系统。使用 Axure，设计者可以在原型阶段就清晰表达异常状态、权限差异和操作反馈，为后续开发和测试提供高保真参考。

总体来说，墨刀适合快速原型和沟通，Axure适合复杂交互和精细逻辑，两者可以在不同项目阶段互为补充。

---

② 专业视觉设计工具

这一部分相比其前面，都更加专业，也更加笨重，它们的特点是支持更复杂、更专业的操作、通常会输出各自私有的文件格式。

Adobe Illustrator

大号Figma。
它非常适合制作Logo、图标、插画、包装和品牌视觉系统设计，输出高精度矢量图的场景。

相比Figma，它更强调图形的可控性和专业性。

---

Adobe Photoshop

万能工具。设计上并不专业，但就是好用。
哪里有什么小问题，总能放到PS里这里修修那里改改，不管做什么设计最后都很容易落回倒PS里。
总之是万能，不用不行啊。

---

③ 工程设计工具

这一部分都是实际工程设计工具，它们的特点是常常根据设计生成文本标记语言，包括xml、xml变体、html等等，主要用于工程落地实现阶段，由它们生成的图片通常可以被对应的开发工具直接调用，所见即所得，可以方便快捷地完成设计到工程落地的转换。

Qt Designer

本项目所采用的设计工具，其特点是其有容器的概念，根据父控件的layout，子控件的flag来完成布局。

---

Android Studio Designer

和Qt Designer类似，其也是根据父控件容器的概念、子根据父控件的layout，子控件的flag来完成布局，甚至连文件格式两者都是采取的xml。

在我看来二者有两个主要区别：

• 安卓的设计思路跟前端设计类似，更强调margin的概念，而Qt Designer把容器和Spacer用好就几乎不需要关注margin了。
• 此外就是毕竟是针对安卓的设计软件，对Google的东西适配性更强，更专业，也可以直接被Android Studio直接使用。同理，Qt的东西对Qt C++/py适配性就更强。

---

游戏引擎编辑器-Unity

这部分属于个人私货。
由于游戏天生就有更强的交互性，因此游戏引擎们在UI / UX设计上的能力，包括功能、性能乃至于体验，都是远超一般原型工具的。通常也都可以直接生成可运行的可交互界面。
例如Unity，它不仅支持拖拽式UI构建，还允许设计者直接绑定交互事件、动画、物理行为和脚本逻辑。Unity的Canvas系统和UI组件，设计者可以在编辑器中实时预览界面效果，同时还可以模拟复杂的交互逻辑。

Unity并非原生开发，它支持包括桌面、移动和Web等多端，因此设计出来的UI不仅可视化，还可以直接投入各个不同的运行环境进行测试和演示。

---

游戏引擎编辑器-Godot

依旧私货。
再如Godot，其设计理念和Qt非常相似，都是容器+父控件layout+子控件的flag完成布局，甚至是Singal的概念都是和Qt非常相像。

不过相比之下，笔者认为Godot的编辑器显然更加成熟更好用，因为：

• 其和Unity一样，并非原生开发，需要对多端包括桌面、移动乃至Web进行兼容。
• 其用自己的一套标记语言而非xml。
• 其编辑器是其主打的功能，自身足够强悍。

总结

最后用一张表总结本文提到的设计工具吧。

工具	核心定位	典型使用人群	主要特点
Figma	UI/UX 设计与原型	产品经理、UI/UX设计师	页面原型、组件库、交互模拟、多人协作
Canva 可画	模板化平面设计	非专业设计者、营销人员、学生	模板丰富、拖拽操作简单、快速出图
墨刀	在线快速原型	产品经理、团队协作	拖拽式原型、扫码预览、团队评审
Axure	高保真功能型原型	产品经理、交互设计师、B端系统	条件逻辑、动态面板、表单、复杂业务流程
draw.io	流程图 / 架构图	产品/工程/管理	流程图、泳道图、系统架构、ER图
Adobe Illustrator	矢量图形设计	平面设计师、插画师	Logo、图标、插画、可缩放矢量图
Adobe Photoshop	栅格图 / 图片处理	平面设计师	修图、素材整合、UI素材修改、通用设计
Qt Designer	桌面 GUI 构建	C++/Python开发者	所见即所得布局，可生成可运行代码
Android Studio Designer	移动端 GUI 构建	Android 开发者	所见即所得布局，生成 XML 文件
Unity / Godot	游戏 UI 与交互构建	游戏开发者、互动媒体开发	所见即所得 UI 构建，可生成可运行交互界面

再叠甲：以上均是个人心得观点，读者认为哪种好用就用哪种才对。
实际上，笔者还是认为：产品永远优先于工具，最终效果是好的便是好的。😋