界面设计原则

多媒体界面设计的一些原则

将美的原则运用于多媒体应用系统界面设计中,可以帮助初级开发者甚至设计

师创作出具有较高水准的作品。本文将探讨界面设计的基本原则,以及为设计出优

美的、富有吸引力的界面而需要注意的一些基本问题。

界面设计中常遵循的原则有:对比原则、协调原则、平衡原则、乐趣原则等。

运用这些原则可以加强界面的气氛、增加吸引力、突出重心、提高美感。

一、对比原则

1.大小的对比

大小关系是界面布局中最受重视的一项。一个界面中有许多区域,包括文字

区、图像区、控制区等,它们之间的大小关系决定了用户对系统的最基本的印象。

大小差别小,给人的感觉较沉着温和;大小差别大,给人的感觉较鲜明,而且具有震撼

力。例如可通过将最重要的菜单选项设计得大一些,来突出它的地位。

2.明暗的对比

阴与阳、正与反、昼与夜等等的对比可使人感觉到日常生活中的明暗关系。

明暗是色感中最基本的要素。利用这一对比可以通过将界面背景设计得暗一些,把

最重要的菜单选项或图形设计得亮一些,来突出它的地位。明暗逆转时,背景与前景

的关系就会互相变换。例如,一般印刷物都是白纸印黑字,白纸称为背景,黑字称为

前景。相反如果在黑纸上印白字,此时黑底为背景,白字则为前景,这是黑白转换的

现象。

3.粗细的对比

字体越粗,越富有男性的气概;若代表时髦与女性,通常以细表现。细字如果份

量增多,粗字就应该减少,这样的搭配看起来比较明快。重要的信息常用粗体大字、

甚至立体形式表现在画面上,这样再搭配激荡的音乐,就会使用户产生一种气魄感;

而比较柔情的词汇,则选择纤细的斜体或倒影字体出现。

4.曲线和直线的对比

曲线富有柔和感、缓和感,直线则富坚硬感、锐利感。自然界中的线条皆由这

两者协调搭配而成,故如果要加深用户对曲线的意识,就以一些直线来对比,也就是

说,少量的直线会使曲线更引人注目。

5.水平线和垂直线

水平线给人以稳定和平静的感受,垂直线正好和水平线相反。垂直线表示向上

伸展的活动力,具有坚硬和理智的意象,使界面显得冷静又鲜明。如果不合理地强调

垂直性,界面就会变得冷漠僵硬,使人难以接近。将垂直线和水平线作对比处理,可

以使两者的表现更生动,不但使画面产生紧凑感,还能避免冷漠僵硬的情况产生。

6.质感的对比

在日常生活中,也许很少听到有人谈及质感。但是在艺术上,质感却是很重要

的形象要素,譬如弛感、平滑感、湿润感、凸凹感等等。质感不仅表现出情感,而且

与这种情感融为一体。画面上的元素之间,可以采用质感的方式加强对比,例如显示

以大理石为背景或以蓝天为背景所产生的对比,前者给用户以冷静、坚实和拘束之

感,后者给用户以活泼、空间和自由之感。

7.位置的对比

通过位置的不同或变化可以产生对比。例如在画面两侧放置某种物体,不但可

以表示强调,同时也可产生对比。画面的上下左右和对角线上的四隅皆有力点存在,

而在此力点处配置照片、大标题或标识记号等,便可显出隐藏的力量。因此在对立

关系位置上,放置鲜明的造型

要素,可显出对比关系,并使画面具有紧凑感。

8.多重比对

将上述各种对比方法,如曲线与直线、垂直与水平、锐角与钝角等,交叉或混

合使用,进行组合搭配,就能制作出富有变化的画面。

二、协调原则

1.主与从

界面设计和舞台设计有类似的地方,主角和配角的表现关系就是其中一个方

面。当主角和配角关系很明确时,用户便会关注主要信息,心理也会安定下来。在画

面上明确表示出主从关系是很正统的界面构成方法。如果两者的关系模糊,便会令

人无所适从;相反,主角过强就会失去动感,变成庸俗画面。所以主从关系是界面设

计需要考虑的基本因素。

2.动与静

一座庭院中,有假山、池水、草木、瀑布等的配合,同样,在设计上也有动态部

分和静态部分的配合。动态部分包括动态的画面和事物的发展过程,静态部分则常

指界面上的按钮、文字解说、菜单等。扩散或流动的形状即为动,静止不动的形状

则为静。一般说来,动态和静态要配置于相对之处,动态部分占界面的大部分,静态

部分面积小一些,在周边留出适当的空白以强调各自的独立性。这样的安排,较能吸

引用户,便于表现。尽管静态部分只占小面积,却有很强的存在感。

3.入与出

整个界面空间因为各种力的关系而产生动感,进而支配空间。我们要建造假山

庭园时很注意流水的出口,因为流水的出口是动感的出发点,整个庭园都会因它而被

影响。对于界面设计,原理也一样。入点和出点会彼此呼应、协调。两者的距离愈

大,效果愈显著,而且可以充分利用画面的两端。不过入点和出点要特别注重平衡,

必须有适当的强弱变化才好,若有一方太软弱无力就不能引起共鸣。例如设计多媒

体系统总标题的出现,我们可以让它从中心一点逐步放射开来,最终静止在整个画面

上,也可以让它从屏幕的一边推出,移向屏幕的另一边,最终落在画面某处。这两种

方式都有出口和落处,有一定艺术效果。

4.统一与协调

如果过份强调对比关系、空间预留太多或加上太多造形要素,则容易使画面产

生混乱。要协调这种现象,最好加上一些共同的造形要素,使画面产生共同的风格,

具有整体统一和协调的感觉。反复使用同形事物,能使界面产生协调感。若把同形

的事物配置在一起,便能产生连续感。两者相互配合运用,能创造出统一与协调的效

果。

三、平衡原则

画面是否平衡是非常重要的,例如一个介绍音乐的画面上,将一把小提琴斜放

在画面的右边,看起来似乎要倒向左边,但在画面的左边,设计者安排了粗体的标题

和文字,恰好起到了支撑作用,使人感觉十分平稳。这就是画面平衡带来的艺术效

果。达到平衡的一种作法是将画面在高度上分为三等分,图形的中轴落在下三分之

一划分线上,这样可保持空间上的平衡。平衡并不是对称。以一点为起点,向左右同

时展开的形态,称为左右对称形。应用对称的原理即可发展出漩涡形等复杂状态。

我国的古典艺术,大多是讲究对称原则的。对称的确使用户产生庄重威严感,但缺少

活泼感。在界面设计上,一般是不认可对称原则的。现代造型艺术也朝着非对称方

向发展。当然,在画面需要表达传统风格时,对称仍是较好的表现手段。中心也是平

衡的一个方面。在人的感觉上,左右有微妙的差异。如某画面右下角有一处吸引力

特别强的地方,考虑左右平衡时,如何处理这个地方就成为关键问题。人的视觉对从

左上到右下的流向较为自然。编排文字时,将右下角空着来编排标题与插图,就会产

生一种很自然的流向。如果把它逆转就会失去平衡而显得不自然。

四、乐趣原则

1.比例

黄金分割点,也称黄金比例,是界面设计中非常有效的一种方法。在设计物体

的长度、宽度、高度及其型式和位置时,如果能参照黄金比例来处理,就能产生特有

的稳定和美感。

2.强调

在单一风格的界面中,加进适当的变化,就会产生强调的效果。强调可打破界

面的单调感,使界面变得有朝气,例如,界面皆为文字编排,看起来索然无味,如果加

上插图或照片,就如一颗石子丢进平静的水面,产生一波一波的涟漪。

3.凝聚与扩散

我们的注意力总会特别集中到事物的中心部分,这就构成了视觉的凝聚。一般

而言,凝聚型看似温柔,也是许多人所喜欢采用的方式,但容易流于平凡。离心型的

布局,可以称为扩散型是具有现代感的编排型式。

4.形态的意象

由于计算机屏幕的限制,一般的编排形式总是以四边形为标准形,其他各种形

式都属于它的变形。四角皆成直角,给人以很规律、表情少的感觉,其他的变形则呈

现出形形色色的感觉,譬如成为锐角的三角形有锐利、鲜明感,近于圆的形状有温和

柔弱之感。相同的曲线也有不同的表情,例如用仪器画出来的圆,有硬质感,而徒手

画出来的圆就有柔和的圆形曲线之美。

5.变化率

在界面设计中,必须根据内容来决定标题的大小。标题和正文大小的比率就称

为变化率。变化率越大,界面越活泼,变化率越小,界面格调越高。依照这种尺度来

衡量,就很容易判断界面的效果。标题与正文字体大小决定后,还要考虑双方的比例

关系,如何进一步来调整也是相当大的学问。

6.规律感

具有共同印象的形状反复排列时,就会产生规律感。不一定要用同一形状的东

西,只要具有强烈印象就可以了。三四次的出现就能产生轻的规律感。有时候只反

复使用两次特定的形状,也会产生规律感。规律感在设计一个多媒体应用系统时,可

以使用户很快地熟悉系统,掌握操作方法。这一点,相信用户从微软的Windows软件

中可以得到启发。

7.导向

依眼睛所视或物体所指的方向,使界面产生一种引导路线,称为导向。设计者

在设计界面时,常利用导向使整体画面更引人注目。一般来说,用户的眼光会不知不

觉地锁定在移动的物体上,即使物体是在屏幕的角落,画面的移动和换场都会让目光

跟它移动的方向。了解了这一点,设计者就可以有意识地将用户的目光导向到希望

用户注意的信息对象上。在考虑导向时,切记一个镜头的结束应该引导出下一镜头

的开始。建立导向的最简单方法是直接画上一支箭头,指向希望用户关注的地方。

8.空白区

速度很快的说话方式适合体育新闻的播报,但不适合做典礼的节目主持人,原

因是每一句话当中的空白量太少。界面设计的空白量问题也很重要,无论排版的平

衡感有多好,读者一看界面的空白量就已给它打好分数了。所以,千万不要在一个界

面上放置太多的信息对象,以至界面拥挤不堪。没有空白区,就没有界面的美。空白

的多寡对界面的印象有决定性的影响。空白部分加多,会使格调提高并且稳定界面;

空白较少,会使人产生活泼的感觉。设计信息量很丰富的杂块界面时,用较多的空白

显然就不适合。

9.屏幕上字的大小

根据分析,为了视觉的舒适感,呈现在电脑屏幕上最小并且清晰的中文字型应

为16×16点阵字型的仿宋体。至于呈现在电视机上最小并且清晰的中文字型应为

36×36的点阵字

型,这是因为电视机需要从较远的距离观看的缘故。为了适应人们横向阅读中

文的习惯,一列最好不超过35个字。