比例与尺度在手机APP界面设计中的应用

摘 要：版式设计的常见布局有十三种：骨骼型，满版型、上下分割型、左右分割型、中轴型、曲线型、倾斜型、对称型、重心型、三角型、并置型、自由型、四角型等。

关鍵词：比例与尺度；手机APP；视觉

一、 手机APP界面的版式设计

移动界面按照其产品功能可以分为两大类：信息展示型界面和功能操作型界面。

（一） 信息展示型界面

我们常见的以阅读和传递信息为主的界面有：新闻、天气、阅读、购物、音乐、食谱、健康等APP的某些界面，另外还有新手引导页也是比较常见的以传递信息为主的页面。

（二） 功能操作型界面

以功能操作为主的界面主要是引导用户操作，所以常见的布局主要有上下分割型、左右分割型、中轴型等。

二、 触屏手机界面的视觉形式研究

随着人们对时尚、趣味、和审美的不断追求，触屏手机界面设计也在探索新的视觉效果。在短短数年间，便有大量精美、新颖、富有创造力和想象力的触屏界面设计展现到了人们的眼前。但并不是每个设计都可以得到用户的认可。就如同花哨并不等于美丽一样，触屏手机界面的美不仅是一种表象，更是一种实质的提现。

触屏手机界面设计是一个年轻又充满活力的设计分支，它需要满足目标用户的审美观、使用目的和心理情感等等。触屏手机界面设计应该为用户创造有价值的、令人注目的信息和交互体验，让用户通过与触屏手机界面的互动达到体验上的满足和心理上的愉悦。为了达到这一点，在设计触屏手机界面的时候，必须充分考虑到各个视觉元素的样式，以及在不同操作状态下它们的视觉效果。

触屏手机界面视觉形式包含的具体内容很多，概括来说主要有文字、色彩、图标、导航、图像和图表、以及版式等。

（一） 文字

科学技术的发展使文字早已不再只局限在某一特定的媒介上。文字作为人类最古老的信息传播载体之一，从最初的甲骨文、活字印刷等发展到现在的信息技术环境下的、以新媒体为媒介的屏幕文字，其漫长的发展演变历史证明了文字的生存能力、实用性和极强的适应力。在移动终端蓬勃发展的今天，触屏手机屏幕中的文字又一次开始适应科技的脚步。

触屏手机界面中的文字是影响触屏手机界面视觉设计的重要视觉元素之一。为了适应以数字技术为基础发展起来的触屏手机界面，达到更好的视觉效果，文字要在不同的传播环境下展现不同的形态。

文字的主要功能是在向用户传达文本的信息和意图。为了达到这一目的，设计师必须考虑文字的整体诉求效果，以给人一种清晰的视觉印象。

和传统按键式手机不同，触屏手机由于显示屏尺寸较大，其界面上的文本大多是可以触摸操作的。在触屏手机界面设计时，要确保用户在操作中对文字的识别性与可理解性，减少用户发生错误操作的几率。

（二） 图标

图标是具有指代意义的具有标识性质的图形。在触屏手机界面中，图标是一种功能标识，扮演着极为重要的角色。它不仅可以代表一个文档、一个应用程序、一个指令，还可以通过点击图标执行一段命令或打开某种类型的文件等。

一个好的图标往往会反映应用程序及其生产商的某些信息，特别是对一个触屏手机的应用程序来说，用户可以从图标的外观基本了解到这个应用的类型或内容。在一个布满各种图标的界面中，只有主题突出的图标才会突显出来。试想一下，一个能让用户轻易看到，并能一眼就确定其类型内容的图标，对置身于庞大市场上的应用程序会有多重要。

（三） 版式

触屏手机界面的版式设计，就是在触屏手机界面上，将有限的视觉元素进行有机的排列组合。触屏手机界面版式设计有着极其重要的地位。虽然基于不同的平台，但报刊、杂志、网站等平面媒体的版式设计有很多共同之处，都是将理性思维个性化地表现出来，在传达信息的同时，也产生感官上的美感，是一种具有个人风格和艺术特色的视觉传送方式。

三、 触屏手机界面的版式设计

（一） 布局要有原则

布局是对事物的全面规划和安排。一个合理的布局对触屏手机界面的版式设计尤为重要。触屏手机显示屏虽然比传统手机的尺寸大了不少，但是设计空间仍有限，在这有限的界面中，合理的布局能增加用户人机互动的流畅度，帮助用户找到自己关注的对象。

一个好的触屏手机界面设计不会把全部的信息都排在同一个模块上，那样会产生信息的积压，容易给用户带来负面的影响和心理上的不适。在设计触屏手机界面的版式时，必须要有一定的主次区别，将主次拉开，有主有次才能给予用户清晰的指导。

基于触屏手机屏幕的大小有限，在设计时，应将最常使用的高度概括的信息、或者一些常规操作（如添加、保存、取消、完成等）置于屏幕顶端，突显主题，便于操作。屏幕的底部一般是辅助性的工具栏，在模块中属于固定的位置固定的存在，一些较重要的操作如果出现在屏幕下半区域的话，要仔细考虑它们的排列设计。界面主次的区分有时候会造成定量的信息无法完全排进模块中，这时候，我们可以把不同的功能分类，然后采取打开链接的方式逐个操作；也可以采用模块大于屏幕大小、用手指拖动模块进行全方位移动的方式来快速阅览。这样可以让用户更简单的获取信息和所需要的功能服务。

（二） 版式设计依赖于点线面的构成

触屏手机界面的版式设计依赖于点线面的构成。由于触屏手机软件所处的运行环境没有电脑空间大，所以控制软件自身的体积大小是十分必要的，有的应用软件因为占用的内存过大，而成为用户优先选择卸载的项目。因此，在将体积较大的信息（如图像、FLASH 等）排进程序的时候，应当根据需要进行适当的筛选和切分。单色的点、线和面是可以由程序自身来呈现的，所以在这个范围内可以节省空间。大块面的色彩和点、线的组合是现代设计的发展趋势，不仅版式时尚大气，且信息传递的精准度也高。所以，结合点线面基本元素的版式设计，不仅有效压缩了应用程序的体积，减小了触屏手机的负担，更凸显了时代感，给用户带来轻松的操作体验。

需要注意的是，在设计触屏手机界面的版式过程中，设计师应当在通过与程序员的密切沟通后再对需要优化的图形图像进行处理，继而交由程序员进行版式的二次组合，以避免失误。

（三） 版式设计要基于应用范畴

触屏手机界面版式的设定，很大程度上需要考虑应用软件的功能范畴。应用软件的应用范畴包括：界面构架的功能操作区、内容显示区、导航控制区以及它所具有的行业标准（如地图类应用软件有其独特的界面特征）。

实用性是应用软件的根本，基于应用软件的版式设计要在软件的应用范畴内进行合理的版式安排，在有限的屏幕上将众多元素整合排列。不同功能的相同操作区域，其设计风格及视觉元素应该一致，以便让用户能够迅速操作不同的功能区域，从而也使整个界面版式统一在一个特有的整体之中。结合应用软件的特性、操作的可用性和可实施性，

对版式进行科学、美观的调整，使版式协调统一、主次得当。如此一来，在确保风格统一的同时，也有利于整合系统和应用程序，以便达到美观与实用兼顾的目的。

作者简介：

周景成，天津市，天津工业大学。