计算机图像处理技术在UI设计中的应用

耿甜 胡垂立

摘   要：图像数字化时代，计算机图像处理技术广泛应用于各行各业。计算机图像处理技术主要是在Photoshop软件基础上实现的，作为当前设计领域必备的主流软件，Photoshop软件的应用基础比较广泛，在不断改进和完善的过程中，软件的功能也更趋向于实用性和人性化，UI设计主要用到图像处理软件Photoshop，文章通过Photoshop在UI设计中的应用来研究计算机图像处理技术在UI设计中的应用。

关键词：图像处理;用户界面设计;图形图像;图标设计;界面设计

在计算机领域，图像数字化是指利用数字对图像进行记录、处理和保存。数字化图像有两种，一种是矢量图形，一种是位图图像。图形是对场景空间位置、颜色等的描述和定义，通过专门的软件，将人们描述的图形指令变成计算机屏幕上的形状和颜色，形成图形，适用于色彩不丰富、描述轮廓不复杂的对象。图像是通过矩阵表示场景的结构、外观，对画面或者场景投影进行数字化处理。在矩阵中，每个元素都表示画面里的1个像素灰度值，图像不仅能够表达真实照片，还能表达小细节。图像由多个像素排列而成，具有较强的创造力。图像和图形的主要区别是图形可以任意缩放，并且不会变形，但是图像如果变大，就会变形、失真。

1    计算机图像处理

计算机图像处理是对图像进行分析、加工和处理，使其满足视觉、心理以及其他要求的技术。图像处理是信号处理在图像域上的一个应用。大多数的图像是以数字形式存储，因而图像处理很多情况下指的是数字图像处理。计算机图像处理的主要内容包括大小的调整、亮度和色彩的调整、图片优化、抠图、文字编排、保存图片和输出图片。

2    Photoshop软件相关介绍

Photoshop，简称“PS”，是由Adobe Systems开发和发行的图像处理软件。Photoshop是一款位图处理软件。使用其众多的编修与绘图工具，可以有效地进行图片编辑工作，功能强大，在图像、图形、文字、视频、出版、界面设计等各方面都有涉及。该软件可分为图像编辑、图像合成、校色调色及特效制作等。图像编辑是图像处理的基础，可以对图像做各种变换如放大、缩小、旋转、倾斜、镜像、透视等，也可进行复制、去除斑点、修补、修饰图像的残损等。图像合成则是将几幅图像通过图层操作、工具应用，合成完整的、传达明确意义的图像。该软件提供的绘图工具让外来图像与创意很好地融合。校色调色可方便、快捷地对图像的颜色进行明暗、色偏的调整和校正。特效制作在该软件中主要由滤镜、通道及工具综合应用完成，包括图像的特效创意和特效字的制作，常用的传统美术技巧都可借由该软件特效完成。界面设计是一个新兴的领域，由于Photoshop的功能可以满足界面设计的需要，绝大多数设计者都使用该软件进行界面的设计与制作。

3    UI设计的相关介绍

用户界面（User Interface，UI），是系统和用户之间进行交互和信息交换的媒介。界面被设计者设计制作出来，利用它将计算機的内部信息转换成普通用户可以接受的信息形式，是硬件和用户之间的桥梁。用户界面定义广泛，包含了人机交互与图形用户接口，凡参与人类与机械信息交流的领域都存在着用户界面。

界面的设计大致包括图形用户界面（Graphical User Interface，GUI）交互设计和视觉设计，这里讨论的是计算机图像处理技术在UI设计中的应用，所以只讨论界面视觉设计的范畴，主要包括图标（icon）设计、界面编排、插图设计、切图输出这4个部分。

4    计算机图像处理技术在UI设计中的应用

4.1  图标设计与制作

图标设计是界面设计中一个重要的组成部分，图标除了是一种图形，它还是一种标识，如同交通指示牌具有指示的作用。在开启软件和使用软件过程中发挥着巨大的作用。图标主要有应用图标和功能图标两类：（1）应用图标，有展示软件形象，功能以及开启软件的功能。（2）功能图标，在使用软件的过程中有交互、指引、入口等功能。可以对图标进行设计和绘制的软件很多，应用最为广泛的是Photoshop和illustrate，Photoshop是位图软件，illustrate是矢量软件，两个软件在绘制图标上各有优势，都拥有数量庞大的使用者。

图标本身偏图形一些，所以，作为矢量软件的illustrate有天然的优势，使用illustrate绘制的图标，放大、缩小都不会影响图标的清晰度和造形。在对线条进行删除、扭曲、规律行的变形等处理时非常方便。经过产品的不断优化，illustrate CC以上的版本将以前处理圆角的外部插件内化进软件自身，使绘制图标时重要的圆角处理过程变得更加有效率。illustrate中设置的一些专门对形状进行造形的工具如形状生成器、效果器、极坐标等可以轻松获得漂亮的图形。

Photoshop是一个位图软件，Photoshop中也设置了一些矢量工具：钢笔工具的形状模式、工具栏上矩形工具按钮下的一组工具（椭圆工具、圆角矩形工具、直线工具、多边形工具、自定义形状工具）、直接选择工具、路径工具。这些工具都可以让我们绘制出一个矢量图标。在图形造形上确实不如illustrate便利，当然，有经验的设计师会用自己的经验和技巧尽量地弥补这个缺陷，但是造形的效率缺陷仍然存在。即便如此仍有数量不少的设计师使用Photoshop设计制作图标，因为Photoshop有强大的图像处理功能、丰富的图层混合模式、调色功能以及便捷的图层管理功能，可以得到细腻的图像，在绘制图标色彩、图标肌理、图标光影的时候非常方便。

4.2  界面设计与制作

Photoshop是目前主流的界面设计工具之一，主要运行终端是PC机。苹果电脑用户主要使用Sketch软件进行界面编排与设计。