1.1 了解UI界面设计_App+软件+游戏+网站界面设计教程-QQ阅读男生玄幻网

上QQ阅读APP看本书，新人免费读10天

设备和账号都新为新人

1.1　了解UI界面设计

本节将带领大家了解UI界面设计，包括什么是UI界面设计、UI界面设计的发展历史和UI界面设计的分类等。通过知识点的学习，让大家对UI界面设计有一个初步的印象，方便大家之后的学习。

1.1.1　什么是UI界面设计

User Interface 简称“UI”，中文名称为“用户界面”。UI界面设计包括人机交互、操作逻辑和界面美观的整体设计。

UI界面设计是为了满足专业化、标准化需求而对软件界面进行美化、优化和规范化的设计分支，具体包括软件界面设计、按钮设计、面板设计、菜单设计、标签设计、图标设计、滚动条（状态栏设计）、安装过程设计、包装及商品化等，如图1-1所示。

图1-1

1.1.2　UI界面设计的发展历史

UI界面设计在设计行业中一直存在，从最初的广告灯箱、游戏机等电子产品设计，再到网站页面的设计和现在的软件App设计，这些都是UI界面设计。

从使用方式来看，最早的UI界面设计大概要追溯到Windows 1.0的用户界面——游戏《俄罗斯方块》的用户界面，如图1-2所示。

图1-2

21世纪初，随着互联网的发展、计算机的普及促进了网站UI界面设计的快速发展。此时，多种多样的网站UI界面设计席卷了整个UI设计领域，UI界面设计开始蓬勃发展，如图1-3所示为网站UI界面。

图1-3

移动端UI被大众熟知主要是因为iPhone的问世，也就是iOS系统的开发和应用。iPhone手机将硬件和软件UI界面完美地结合起来，再加上优秀的用户体验，创造了一个新时代的开始，如图1-4所示为iOS系统的UI界面。

图1-4

提示

移动端UI 设计的出现时间较早，而且随着移动端设备的快速发展，移动端UI 设计将UI 界面设计推向了鼎盛时期。在这期间，不管是PC 端的网站UI 界面设计还是移动端的UI 界面设计，作品已经逐渐趋于成熟和完整。

手机和计算机界面是现在主流的UI界面体现形式，而且随着审美水平的提高与技术的成熟，大众对UI界面设计的要求也越来越高。同时，大众对用户体验也越来越重视。这就使得UI界面设计逐渐向着更完美的趋势发展，如图1-5所示为最新的手机屏幕界面。

图1-5

从设计风格上来看UI界面设计的发展，主要经历了三个时期——从最初的拟物化风格，到后来的扁平化风格，再到现在流行的极简风格。

●拟物化风格

拟物化设计是指在设计过程中通过添加高光、纹理、材质和阴影等效果，力求实物对象的再现，在设计过程中也可以适当地进行变形和夸张，模拟真实物体。

拟物化设计可以使用户第一眼就能够认出对象是什么，拟物化设计的交互方式也模拟现实生活中的交互方式。如图1-6所示为两个拟物化风格的图标。

图1-6

●扁平化风格

扁平化设计从其字面意义上理解，是指设计的整体效果趋向于扁平，无立体感。扁平化设计的核心是在设计中摒弃高光、阴影、纹理和渐变等装饰性效果，通过符号化或简化的图形设计元素来进行表现。

扁平化设计去除了冗余的效果和交互，其交互核心在于突出功能本身的使用。如图1-7所示为扁平化风格的图标。

图1-7

●极简风格

UI界面设计是一项驱动性很强的工作。随着用户越来越偏好简洁的交互界面，于是去除多余的元素，保留最基础、最重要元素的极简化设计成了UI界面设计的新潮流。

极简设计将内容形式和主要功能进行完美结合，其最大的优点是简单的表现形式、简洁的线条、大方的留白、简约的图形化元素……即使很复杂的内容，在这样的设计下也会显得简洁和干练。如图1-8所示为极简风格的图标。

图1-8

1.1.3　UI界面设计的分类

随着信息技术的飞速发展，人们对信息的需求不断增加，UI界面设计也越来越多样化。UI界面设计主要可以分为移动端界面设计、网站页面设计、软件界面设计、播放器界面设计和游戏界面设计等，不同类型的界面设计风格和特点也各不相同。

●移动端界面设计

如今，手机俨然已经成为大众生活的必需品，而手机的功能也越来越完善，很多高端手机的性能甚至可以与电脑相媲美。移动端UI界面设计最大的要求就是人性化，不仅要美观而且要实用。如图1-9所示为一些成功的移动端UI界面设计作品。

图1-9

●网站页面设计

近年来，随着电子商务的高速发展，国内网站设计行业也在快速崛起。从最初的纯文本网页设计到版式古板、配色拙劣的设计，再到现如今的配色新奇、版式多元化的设计，网站设计得到了长足发展。网站界面设计必须具有独立性和创意性，能够最大限度地方便用户检索信息，从而提升用户的操作体验。如图1-10所示为一些成功的网站页面设计。