摘要：图像数字化时代，计算机图像处理技术广泛应用于各行各业。计算机图像处理技术主要是在Photoshop软件基础上实现的，作为当前设计领域必备的主流软件，Photoshop软件的应用基础比较广泛，在不断改进和完善的过程中，软件的功能也更趋向于实用性和人性化，UI设计主要用到图像处理软件Photoshop，文章通过Photoshop在UI设计中的应用来研究计算机图像处理技术在UI设计中的应用。
关键词：图像处理；用户界面设计；图形图像；图标设计；界面设计
在计算机领域，图像数字化是指利用数字对图像进行记录、处理和保存。数字化图像有两种，一种是矢量图形，一种是位图图像。图形是对场景空间位置、颜色等的描述和定义，通过专门的软件，将人们描述的图形指令变成计算机屏幕上的形状和颜色，形成图形，适用于色彩不丰富、描述轮廓不复杂的对象。图像是通过矩阵表示场景的结构、外观，对画面或者场景投影进行数字化处理。在矩阵中，每个元素都表示画面里的1个像素灰度值，图像不仅能够表达真实照片，还能表达小细节。图像由多个像素排列而成，具有较强的创造力。图像和图形的主要区别是图形可以任意缩放，并且不会变形，但是图像如果变大，就会变形、失真。
1计算机图像处理
计算机图像处理是对图像进行分析、加工和处理，使其满足视觉、心理以及其他要求的技术。图像处理是信号处理在图像域上的一个应用。大多数的图像是以数字形式存储，因而图像处理很多情况下指的是数字图像处理。计算机图像处理的主要内容包括大小的调整、亮度和色彩的调整、图片优化、抠图、文字编排、保存图片和输出图片。
2Photoshop软件相关介绍
Photoshop，简称“PS”，是由AdobeSystems开发和发行的图像处理软件。Photoshop是一款位图处理软件。使用其众多的编修与绘图工具，可以有效地进行图片编辑工作，功能强大，在图像、图形、文字、视频、出版、界面设计等各方面都有涉及。该软件可分为图像编辑、图像合成、校色调色及特效制作等。图像编辑是图像处理的基础，可以对图像做各种变换如放大、缩小、旋转、倾斜、镜像、透视等，也可进行复制、去除斑点、修补、修饰图像的残损等。图像合成则是将几幅图像通过图层操作、工具应用，合成完整的、传达明确意义的图像。该软件提供的绘图工具让外来图像与创意很好地融合。校色调色可方便、快捷地对图像的颜色进行明暗、色偏的调整和校正。特效制作在该软件中主要由滤镜、通道及工具综合应用完成，包括图像的特效创意和特效字的制作，常用的传统美术技巧都可借由该软件特效完成。界面设计是一个新兴的领域，由于Photoshop的功能可以满足界面设计的需要，绝大多数设计者都使用该软件进行界面的设计与制作。
3UI设计的相关介绍
用户界面（UserInterface，UI），是系统和用户之间进行交互和信息交换的媒介。界面被设计者设计制作出来，利用它将计算机的内部信息转换成普通用户可以接受的信息形式，是硬件和用户之间的桥梁。用户界面定义广泛，包含了人机交互与图形用户接口，凡参与人类与机械信息交流的领域都存在着用户界面。界面的设计大致包括图形用户界面（GraphicalUserInterface，GUI）交互设计和视觉设计，这里讨论的是计算机图像处理技术在UI设计中的应用，所以只讨论界面视觉设计的范畴，主要包括图标（icon）设计、界面编排、插图设计、切图输出这4个部分。
4计算机图像处理技术在UI设计中的应用
4.1图标设计与制作
图标设计是界面设计中一个重要的组成部分，图标除了是一种图形，它还是一种标识，如同交通指示牌具有指示的作用。在开启软件和使用软件过程中发挥着巨大的作用。图标主要有应用图标和功能图标两类：（1）应用图标，有展示软件形象，功能以及开启软件的功能。（2）功能图标，在使用软件的过程中有交互、指引、入口等功能。可以对图标进行设计和绘制的软件很多，应用最为广泛的是Photoshop和illustrate，Photoshop是位图软件，illustrate是矢量软件，两个软件在绘制图标上各有优势，都拥有数量庞大的使用者。图标本身偏图形一些，所以，作为矢量软件的illustrate有天然的优势，使用illustrate绘制的图标，放大、缩小都不会影响图标的清晰度和造形。在对线条进行删除、扭曲、规律行的变形等处理时非常方便。经过产品的不断优化，illustrateCC以上的版本将以前处理圆角的外部插件内化进软件自身，使绘制图标时重要的圆角处理过程变得更加有效率。illustrate中设置的一些专门对形状进行造形的工具如形状生成器、效果器、极坐标等可以轻松获得漂亮的图形。Photoshop是一个位图软件，Photoshop中也设置了一些矢量工具：钢笔工具的形状模式、工具栏上矩形工具按钮下的一组工具（椭圆工具、圆角矩形工具、直线工具、多边形工具、自定义形状工具）、直接选择工具、路径工具。这些工具都可以让我们绘制出一个矢量图标。在图形造形上确实不如illustrate便利，当然，有经验的设计师会用自己的经验和技巧尽量地弥补这个缺陷，但是造形的效率缺陷仍然存在。即便如此仍有数量不少的设计师使用Photoshop设计制作图标，因为Photoshop有强大的图像处理功能、丰富的图层混合模式、调色功能以及便捷的图层管理功能，可以得到细腻的图像，在绘制图标色彩、图标肌理、图标光影的时候非常方便。
4.2界面设计与制作
Photoshop是目前主流的界面设计工具之一，主要运行终端是PC机。苹果电脑用户主要使用Sketch软件进行界面编排与设计。界面设计主要是图文编排和一些界面的绘制。对于图文编排，Photoshop拥有完善的对齐辅助功能，可以帮助设计者进行准确的对齐操作。Photoshop有齐全的字库，有文字形状化编辑功能。设计者可以使用图层管理不同的界面图形。
4.3插图设计与制作
由于互联网文化的发展，插图被频繁地使用，在进行界面设计时，会涉及不少插图的设计与制作：引导页插图、运营插图、节日插图、活动插图等。或优美、或亲切、或时尚、或温馨的插图，会增加软件的友好度，增加用户黏性。绘制插图时需要较强的图像创作能力和图像处理能力。绘制插图的软件同样很多：Photoshop，illustrate（擅长矢量插图的创作）、专项绘图软件SAI（软件体量轻盈，对计算机的资源占用小）。计算机图像处理使用的Photoshop软件在绘图功能上不输上述软件，有数量可观的用户使用它创作绘制插画。
4.4切图输出
UI设计输出的界面和图标，最终由编程人员应用到软件中。在进行编程之前，需要将界面和图标进行切图。切图的作用主要是两个：（1）使界面中的各个元素独立，便于写入程序。（2）配适各种尺寸的终端以及操作系统。目前，主流的操作系统有苹果系统和安卓系统，每一个操作系统有不同的设计规范。这两大系统下的移动产品终端尺寸也是多种多样，通常需要将设计原图切成2倍大、3倍大的切图来配适各种尺寸的终端。
5在教学实践中的“UI设计”课程教学改革
基于多年的“UI设计”课程教学实践，以及多年对该领域的研究，笔者认为在课程内容上，应改变以往的以视觉设计为主，单纯将图标绘制和界面设计作为主要教学重点的课程内容，增加产品创意、UI交互设计、用户体验设计、图标动效设计与制作、界面动效设计与制作、插图绘制等内容。在课程设置上，应根据专业和学校的实际情况选择性增设“UI交互设计”“插图设计”“动效设计”“游戏UI设计”课程。在教学评价方面，改变单一的评价方式，除了将UI设计作品作为评价主体外，增加对小组报告形式、讨论形式、论文形式的教学成果评价，将学习成果评价与学习过程评价相结合。
作者:耿甜 胡垂立 单位:广州工商学院
