- Photoshop CC 移动UI设计案例教程(全彩慕课版)
- 胡金黎 朱海燕
- 1476字
- 2025-02-23 06:15:08
1.1.5 移动UI设计的常用软件
移动UI设计的常用软件可以分为界面设计、动效设计、网页设计、3D渲染、思维导图设计和交互原型设计6种类型。
1. 界面设计类软件
(1)Photoshop
Photoshop简称“PS”,是由Adobe公司开发和发行的图像处理软件,截至2018年10月,其版本已经更新到CC 2019,如图1-15所示。在Sketch出现之前,PS是大部分UI设计师进行界面设计的首选工具。

图1-15 Photoshop工作区界面截图
(2)Sketch
Sketch是基于苹果计算机系统的一款收费型专业制作UI的工具,如图1-16所示。相较于PS,它是一款可以迅速上手的轻量级矢量设计工具。不仅UI设计师常用它,就连产品经理和前端开发人员都能够迅速掌握其功能,大大减少了沟通合作中的问题。

图1-16 Sketch工作区界面截图
(3)Illustrator
Illustrator常被称为“AI”,是由Adobe公司开发和发行的矢量图处理软件,截至2018年10月,其版本已经更新到CC 2019,如图1-17所示。AI在UI设计中除了被广泛应用于插画设计之外,在图标制作中也显示了超凡的性能。

图1-17 Illustrator工作区界面截图
(4)Experience Design
Experience Design简称“XD”,是由Adobe公司开发和发行的集原型、设计和交互于一体的软件,并于2016年3月发布了正式预览版本,如图1-18所示。XD的“简洁”弥补了PS在制作UI方面的“臃肿”,同时它免费并兼容Windows和Mac双平台的平民化特点又是Sketch无法比拟的。

图1-18 Experience Design工作区界面截图
2. 动效设计类软件
(1)After Effects
After Effects简称“AE”,是由Adobe公司开发和发行的图形视频处理软件,截至2018年10月,其版本已经更新到CC 2019,如图1-19所示。无论是After Effects软件中经典的插件还是强大的表达式,都使AE制作出来的动效变得更加细腻入微。

图1-19 After Effects工作区界面截图
(2)Principle
Principle是基于苹果计算机系统的一款收费型专业制作动效的工具,如图1-20所示。相较于AE的性能综合、体量较大,Principle的优势在于上手容易、操作简单,还能在计算机上实时预览,并在手机上进行交互,而不像AE只能导出GIF动画和MP4视频,无法与手机交互。

图1-20 Principle工作区界面截图
3. 网页设计类软件
(1)Dreamweaver
Dreamweaver简称“DW”,开始由美国Macromedia公司开发,2005年被Adobe公司收购。DW是一款集网页制作和管理网站于一身的网页代码编辑器,拥有所见即所得的功能特点,如图1-21所示。

图1-21 Dreamweaver工作区界面截图
(2)Hype3
Hype3是基于苹果计算机系统的一款收费型专业制作网页的工具,它的主要优势体现在能帮助不会编程的设计师轻松创建HTML5页面,并制作复杂的动画效果,如图1-22所示。在响应式方面,Hype3有着特别优秀的表现。

图1-22 Hype3工作区界面截图
4. 3D渲染类软件
CINEMA 4D简称“C4D”,是德国Maxon公司开发的一款能够进行顶级建模、动画和渲染的3D动画软件,如图1-23所示。其功能非常强大,更能和PS、AI、AE等各类软件进行无缝结合,近年来受到大量UI设计师的追捧。通过C4D设计出来的作品被广泛运用到Banner、专题页及活动页等。

图1-23 CINEMA 4D工作区界面截图
5. 思维导图设计类软件
(1)Mindjet MindManager
Mindjet MindManager俗称“脑图”,又叫“心智图”,由美国Mindjet公司开发,是一款可以创造、管理和交流思想的绘图软件,也是一款项目管理软件,如图1-24所示。

图1-24 Mindjet MindManager工作区界面截图
(2)XMind
XMind是一款非常实用的商业思维导图软件,如图1-25所示。思维导图类软件在UI设计方面没有太大的区别,可根据个人喜好来选用。

图1-25 XMind工作区界面截图
6. 交互原型设计类软件
(1)Axure RP
Axure RP通常称为“Axure”,是一款专业的快速原型设计工具,于2018年9月开放了9.0 Beta的下载。在9.0的更新版本中,Axure对设计架构进行了颠覆式的改变,令软件的使用效率及体验友好度都大大增加,如图1-26所示。

图1-26 Axure 9.0工作区界面
(2)墨刀
墨刀是国内开发的一款在线型原型设计工具,于2017年6月开放了V3版本的下载。在V3版本中,墨刀进行了全面更新,除了品牌和组件的升级优化外,还支持了Sketch文件的导入并加入了工作流的功能,这使得墨刀的功能更加强大,如图1-27所示。

图1-27 墨刀工作区界面截图