1.1 初识UI设计

1.1.1 UI设计行业概述

1.UI设计就业现状

近年来，随着互联网的蓬勃发展，UI设计作为互联网中的新兴行业，在互联网的助力下呈现井喷式的发展态势。拉钩网、智联招聘、Boss直聘等大型招聘平台提供的统计数据显示，截至2019年3月，全国发布UI设计师岗位共计20745个，UI设计行业的人才需求量相当大。

Photoshop就业前景及安装与卸载

另外，UI设计行业薪资待遇的平均水平与增长幅度，相比平面设计、室内设计等设计行业具有更强的竞争力。图1-1所示为职友集于2019年3月公布的统计数据：北京UI设计师的平均月收入为13330元，较2017年增长27.2%，北京70%以上的UI设计师月收入在10000元以上；图1-2所示为北京平面设计师平均月收入，仅为7940元，较2017年同比下降23.2%。

2.UI设计师能力模型

纵观百度（Baidu）、阿里巴巴（Alibaba）、腾讯（Tencent）等大型互联网企业的招聘信息可知：目前国内对UI设计师的能力要求主要体现在视觉设计能力、用户调研能力、持续学习能力、交互设计能力等方面。其中，视觉设计能力被视为UI设计师的核心竞争力，视觉设计工作也是UI设计师日常的主要工作。目前，大部分互联网企业对UI设计师的任职要求主要包括4个方面。

（1）视觉工作。负责UI产品从立项到迭代的整体视觉设计工作，跟踪设计实现效果并提出优化方案，落实日常运营活动的UI设计支持工作，把控UI产品的视觉方向并建立产品设计流程与设计规范。

（2）调研工作。参与UI产品讨论，与产品经理、开发工程师协作，开展具有前瞻性的产品预研设计和用户研究。

（3）学习深造。持续关注与分析设计趋势，分享设计经验，促进团队设计能力提升，扩大团队的行业影响力。

（4）交互工作。梳理UI产品的交互逻辑与操作流程，输出相应的产品原型图。

3.UI设计流行趋势

UI设计受时代变迁、用户审美、地域文化、硬件设备等因素的影响，其流行趋势呈动态变化。所谓动态变化，即设计的流行风格在汲取以往设计风格精华的基础上呈渐进式的优化与演变。

自UI设计行业诞生以来，移动终端的界面风格主要经历了3次大规模的演变：非智能手机时代的像素风格、智能手机刚诞生时的拟物风格和智能手机普及后备受青睐的扁平风格。

（1）像素风格。像素风格的广泛应用主要是因为20世纪末非智能手机屏幕分辨率普遍较低，用户通过肉眼就可以明显看到屏幕中的像素格。图1-3所示为诺基亚开机时的界面，界面中的文字有明显的颗粒感。

（2）拟物风格。拟物风格早在智能手机诞生前就已经存在于各大非智能手机界面，图1-4所示为非智能手机中的拟物风格图标。以iPhone 4为代表的智能手机诞生后，为保证用户能够快速识别不同图标的含义，苹果公司iOS负责人斯科特·福斯特尔（Scott Forstall）将拟物风格发扬光大。图1-5所示为iPhone 4拟物风格界面。

（3）扁平风格。扁平风格的概念于2008年由谷歌公司提出，微软公司将其称为 “authentically digital”。扁平风格最终风靡全球得益于苹果公司的大力推广。苹果公司作为UI设计的时尚风向标，在其iOS 7系统中启用了扁平风格，顺应了越来越多样化的屏幕适配需求。图1-6所示为苹果 iOS 7中的扁平风格界面。

1.1.2 Photoshop在UI设计中的应用

Photoshop由著名桌面软件公司Adobe Systems Incorporated出品。Adobe是著名的图形图像与排版软件生产商，旗下的设计软件还包括Illustrator、InDesign、After Effects、Flash、Experience Design 等。

Photoshop的应用领域

UI设计工作非常庞杂，需要UI设计师掌握全面的技能以满足企业的各类设计需求。一般情况下，UI设计师需要掌握的常用设计软件包括Photoshop、Illustrator、After Effects、Axure、MindManager等。图1-7所示为UI设计中常用的各类软件。

在UI设计工作中，Photoshop是各类设计软件中使用频率较高的工具，作为UI设计师必须掌握的设计软件广泛应用于UI设计的各个领域，如图标与图形设计、原型与界面设计、插画与计算机图形（Computer Graphics,CG）设计、图像合成与精修等。

1.图标与图形设计

在图标与图形基本轮廓的绘制方面，Photoshop中提供了强大的矢量工具与布尔运算功能，UI设计师可根据创作需求，绘制规则或自由形态的图标与图形，如图1-8所示。在图标与图形的光影、质感、纹理设计方面，Photoshop具有丰富的图层样式与图层混合模式，利用它，UI设计师可模拟出现实世界中的各类物体，如图1-9所示。

2.原型与界面设计

在设计网页界面或移动端界面时，UI设计师需要事先规划好界面中各个模块与功能的布局，确保应用的操作流程符合逻辑，这些仅由黑白灰色块构成的简易页面即为原型图，如图1-10所示。UI设计师可借助Photoshop绘制网页及移动端界面的原型图，方便指导后期的视觉设计工作。

3.插画与CG设计

Photoshop支持Wacom、Bamboo等品牌手绘板的应用。Photoshop中形态各异的画笔工具通过压杆可感知设计师运笔的力度，绘制出流畅的线条与形状。UI设计师借助Photoshop中的画笔工具，可自由创作商业插画及CG人物、场景、道具等美术资源，如图1-11所示。

4.图像合成与精修

Photoshop是一款强大的数字图像处理软件，能胜任图像合成、图像精修、图像校色、图像格式转换等图像编辑工作，帮助UI设计师快速实现天马行空的图像创意设计。图1-12所示为精修前后的模特图像，精修后的模特肌肤明显更干净、明亮。