西昌学院《计算机基础》课件-第5章多媒体人机交互技术_第1页
西昌学院《计算机基础》课件-第5章多媒体人机交互技术_第2页
西昌学院《计算机基础》课件-第5章多媒体人机交互技术_第3页
西昌学院《计算机基础》课件-第5章多媒体人机交互技术_第4页
西昌学院《计算机基础》课件-第5章多媒体人机交互技术_第5页
已阅读5页,还剩51页未读, 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

第五章多媒体人机交互技术西昌学院《计算机基础》概述人机交互(HumanComputerInteraction)是研究人与计算机之间的交互技术。由于计算机的应用越来越广泛,功能越来越强,计算机能处理和表现越来越多的信息。目前,计算机能够处理图形、图像、动画、视频、语音、音乐、文字等不同的媒体,但缺乏仿生的眼睛和耳朵,也没有从外部世界收集信息所需的触觉、味觉和嗅觉。计算机没有语言能力,没有四肢,没有建立各种各样信息表达形式的能力,所以,我们目前仍然以键盘和鼠标为主要输入工具,输入输出严重不平衡,这就限制了人和计算机之间的信息沟通。不能充分利用人的认知资源,人们长期追求的以自然的方法和计算机交流的理想仍然无法实现,许多新的计算机应用技术无法普及。因此,人和计算机之间的交互显得日益重要。主要内容5.1多媒体人机交互技术概述5.2图形用户界面5.3多通道交互技术小节的排练顺序原则5.4互联网界面设计5.6移动界面设计5.7人机交互界面的测试与评估5.1多媒体人机交互技术概述人机交互技术是计算机应用的核心技术,以用户为中心是人机交互界面设计的核心思想,人机界面作为人与计算机通信的途径,其效果好坏直接影响到用户使用计算机的效率以及软、硬件功能的发挥,现有的人机交互技术已落后于计算机软、硬件的发展,成为信息产业急待解决的问题,美国将软件、人机交互、网络和高性能的计算机并列为21世纪信息技术计划的基础研究内容,我国“973”计划也将人机交互技术与虚拟现实的真实感作为科技攻关的关键问题。5.1多媒体人机交互技术概述5.1.1人机交互技术的概念及发展历程人机交互技术的发展历程,大致经历了手工操作、命令行界面和图形用户界面三个阶段。1.手工操作阶段2.命令行界面上个世纪50年代中期出现的终端显示器,构成了字符显示终端,这一时期的人机界面被称作命令行界面,可以看作是第一代真正的人机界面。3.图形用户界面图形用户界面的出现使人机交互技术向前迈进了一大步,普通的用户不须要懂计算机,更不须要记住烦琐的操作命令,所有图形用户界面下的应用程序界面标准是统一的,操作是相同的,用户只须轻点鼠标就可以完成所有操作,非常简单、易于掌握,极大地推动了计算机的普及应用。5.1多媒体人机交互技术概述5.1.2人机交互技术的主要研究内容

1.认知心理学

2.人机工程学

3.多媒体技术

4.虚拟现实技术虚拟现实(VirtualReality,VR)就是通过三维空间设备在计算机上营造一个虚拟环境,人可以通过视觉、听觉、触觉与虚拟世界进行交互,使人有身临其境的感觉。5.1多媒体人机交互技术概述5.1.3人机交互界面的创意设计

1.屏幕设计创意一个屏幕载有各种媒体信息,图文并茂,有多层结构,并具有动态特性,其信息指向也是多向的。在进行设计时,通过直观的图形、图像、文字、概念、色彩等各种造型要素及信息菜单、信息正文所构成的总体感性印象及心理感受来传达信息内容。各构成要素就是传达特定信息的载体,将这些构成要素按照视觉运动的法则精心地编排组合使它们在组合中有主有次、有轻有重、有大有小、有疏有密、有曲有直,从而使这些要素和谐地出现在一个屏幕上,使其相辅相成,成为具有活力的有机体,以发挥最有效的诉求效果,更好地传达信息。5.1多媒体人机交互技术概述进行屏幕界面的创意设计时,必须遵循以下几条构成原则:(1)内容与形式必须统一,形式表现必须服从内容要求。(2)要充分考虑各构成要素之间的视觉流程,能自然而有序地达到信息诉求重点的位置,突出主题。(3)注意保持屏幕界面在视觉上的相对均衡感,使其在形式结构上得到正确的配置。(4)注意屏幕设计中的空白处理。(5)注重整体的对比因素。(6)注意提高屏幕界面信息内容的视读性。(7)创造一定的韵律感。5.1多媒体人机交互技术概述

3.屏幕创意设计表现手法(1)视觉流程视觉流程是指人们在阅读一种信息载体时,视线总有一种自然的流动习惯,通常都是从左到右,由上到下,由左上方沿着弧形线向右下方流动的过程。(2)点线面的关系屏幕界面的三大要素文字、图形、色彩的抽象就是点、线、面。它们彼此交织,互相烘托。(3)形状间的组合文字、图形、色彩在设计中以点、线、面的形式,在平面上构成了各种各样的形状,称其为“形”。形与形之间具有多种组合,如分离、接触、覆叠、联合等等。5.1多媒体人机交互技术概述(4)对比与统一对比是屏幕界面取得强烈效果的最重要的手段。彩度上的艳与灰、亮度上的黑与白、浓与淡、面积上的大与小、运动上的动与静、数量上的多与少、质量上的疏与密等都是对比。在视觉设计中,对比强烈的注视率就高。统一是高层次上的协调,协调是对比的对立。(5)节奏与韵律节奏和韵律运用在屏幕界面设计上,是指各种造型构成要素的点、线、面所形成的一种自然秩序,规律节奏的美。其表现手法有反复、连缀、转换、渐变、特异等。(6)装饰与趣味屏幕界面的装饰是指造型和色彩点缀、各类外框线、跳跃的点等等。5.2图形用户界面20世纪80年代诞生了图形用户界面(GUI),即所谓WIMP界面以窗口(Windows)、图标(Icon)、菜单(Menu)和指点装置(Pointingdevice),为基础的交互界面,首先是美国苹果(Apple)电脑公司开发出了世界上第一台图形用户界面计算机--Macintosh计算机,Macintosh风格也成了图形用户界面的标准,接着美国微软(Microsoft)公司推出了Windows视窗操作系统,并迅速成为风靡全球的图形用户界面操作系统,到了20世纪90年代基于图形用户界面的软件已经超过了字符界面下的软件,图形用户界面已经成为计算机人机交互技术的主导方式,图形用户界面极大地方便了广大非计算机专业人士使用计算机,其操作非常简单、易于掌握,极大地推动了计算机的普及应用。5.2图形用户界面5.2.1图形用户界面的特点1.桌面隐喻:是指用图例表示计算机可以进行的操作。2.所见即所得:界面中显示的格式即为最终输出的结果。3.直接操纵:直接操纵是指把操作的对象、属性和关系显式地表示出来,用指点设备直接从屏幕上获取形象化命令与数据的过程。直接操纵具有以下特性:(1)用物理动作或图标代替了复杂的操作。(2)用指点和选择操作代替键盘输入。(3)操作结果立竿见影,交互性强。(4)支持逆向操作。5.2图形用户界面5.2.2图形用户界面的设计1.设计原则(1)一致性原则。(2)提供快捷操作方式。(3)提供错误检测及错误处理机制。(4)提供信息反馈功能。(5)提供逆向操作功能。(6)提供联机帮助功能。(7)要提供多窗口管理。5.2图形用户界面2.色彩的运用(1)在一幅画面中使用的色彩种类不宜太多。(2)重要的或活动的对象采用鲜艳的颜色,而不重要的或非活动的对象使用较暗淡的颜色。前景使用鲜艳的颜色,背静采用暗淡颜色。(3)当需要区分不同对象时,首先按亮度大小,然后在按颜色不同来区分。(4)各种颜色的意义应该符合人们的习惯并保持一致,例如,红色表示错误,黄色表示警告。(5)避免使用不兼容的颜色配伍,如蓝/黄、红/绿、红/蓝、绿/蓝,这些色彩对比强烈的颜色组合,会在边界上产生颤抖或余像效应,影响观看。

5.2图形用户界面

3.色彩的设计方式在人机交互中色彩的使用主要遵循以下原则:(1)正确选择色彩基调(2)文字色彩与画面色彩应协调、柔和(3)尽量使用不易产生视觉疲劳的色彩(4)选择合适的颜色种数(5)处理好对比与和谐的关系(6)使用一致性的颜色显示字体清晰度与背景色的匹配如下表所示。5.2图形用户界面字块色彩背景色彩显示效果字块色彩背景色彩显示效果黑字黄色好蓝字黄色较好绿字白色好黄字白色较差蓝字白色好红字绿色较差黑字白色好蓝字红色较差白字黑色较好蓝字黑色较差白字紫色较好紫字黑色较差白字蓝色较好紫字红色较差白字绿色较好绿字灰色较差绿字黑色较好绿字红色较差5.2图形用户界面4.屏幕的布局屏幕布局一般应遵循以下几个原则:(1)平衡原则,屏幕的上下左右布局要平衡,不要虎头蛇尾或一边重、一边轻(2)顺序原则,对象显示的顺序应按需要排列,重要的先出现的对象先显示。(3)经济性原则,在有限的屏幕空间中既要提供足够信息量,又要注意信息的简明、清晰。(4)规范化原则,在一个系统中,对话框、提示行等要统一规范(5)可预期原则,对象的操作结果要可以预期。5.2图形用户界面5.菜单界面的设计在设计菜单界面时,一般遵循如下原则:(1)合理地组织菜单界面的结构与层次。(2)按照系统的功能对菜单进行分组和排序,将同一类功能的菜单选项放在同一组中,将常用的菜单选项放在比较靠前的位置。(3)菜单选项的标题力求简单、明确、以关键词开头。(4)常用的菜单选项要设置快捷键,并有文字提示。(5)充分利用菜单选项的使能与禁止、可见与隐藏的属性。(6)合理地使用弹出式菜单。5.2图形用户界面6.填表输入界面的设计设计填表输入界面时遵循的原则:(1)表格要有标题,布局要直观,栏目按逻辑功能分组排序,栏目标题要易于理解。(2)表格的显示要美观、清晰,避免过于拥挤。(3)把相关的输入字段安排在一起,按照使用频率、重要性、功能关系或使用顺序进行排序和分组。(4)要有出错提示,系统应该能提示输入数据的范围和方法,对不可接受的输入给出出错提示。(5)提供帮助,系统应该能提供帮助信息。(6)表格的文字要易于理解,力求简明。(7)光标的移动要方便。5.3多通道交互技术多通道用户界面的研究始于上个世纪80年代,多通道用户界面就是通过多个通道例如语音、手势、身体语言与计算机系统进行通信的用户界面。多通道用户界面主要关注用户向计算机输入信息以及计算机对用户意图理解的问题,它基于视线跟踪、语音识别、手势输入、感觉反馈等新技术,使用多个交互通道以并行、非精确方式与计算机系统进行交互,旨在提高人机交互的自然性和高效性。5.3多通道交互技术5.3.1眼动跟踪人类80%的外界信息是通过视觉获得的,目前人机界面所用的交互技术几乎都离不开视觉的参与。通过对视觉跟踪的研究,可以得知人在观测外界景物和屏幕信息时的扫描选择和注视过程,从而研究人的视觉感知和综合的机理。在观察多目标、多任务人眼对不同位置、大小、颜色和速度的目标的眼动敏感度、延迟、反应速度等特征进行深入的了解。视线跟踪技术有强迫式与非强迫式、穿戴式与非穿戴式、接触式与非接触式之分,其研究内容主要有人眼的运动和跟踪技术两个方面。5.3多通道交互技术视线跟踪的基本工作原理是利用图像处理技术,使用能锁定眼睛的特殊摄象机,通过分析人眼的虹膜和瞳孔中反射的红外线图像的连续变化记录视线的变化,从而实现视线跟踪。视线跟踪的基本要求有:要保证一定的精度,满足用户要求;反应速度要快;对用户基本无干扰;定位校正简单;可作为计算机的标准外设。从视线跟踪装置得到的原始数据需要经过进一步处理才能用于人机交互。数据处理的目的是滤除噪声、识别定位及局部校准与补偿,最重要的是提取出用于人机交互所必需的眼睛定位坐标。5.3多通道交互技术5.3.2手势识别1手势的分类手势可以有不同的分类:交互性手势和操作性手势,前者表示特定的信息(如乐队指挥),靠视觉来感知,后者不表达任何信息(如弹琴);自主性手势和非自主性手势,自主性手势与语音配合用来加强或补充某些信息(如演讲),非自主性手势是一些下意识的动作,不表达任何信息(如瘙痒);离心手势和向心手势,前者直接针对交谈者,有明确的交流意图,后者只是反映说话人的情绪和内心的愿望。手势的各种组合相当复杂,因此,在手势识别系统中通常对手势做适当的分割、假设和约束。

5.3多通道交互技术2手势的识别计算机手势识别的好坏是将手势应用于人机交互的重要前提,目前手势识别设备有:(1)鼠标和光笔。(2)数据手套。(3)计算机视觉。利用摄像机记录手势,这是一种很有前途的技术,优点是不干扰用户,但目前在技术上还存在许多困难,难以胜任手势的识别和理解。目前使用较多的是数据手套,因为数据手套可以输入三维空间的手势信息,而且比基于计算机视觉的手势识别在技术上更易于实现。5.3多通道交互技术手势识别的方法有:(1)模板匹配法:将输入的手势与预存的模板进行比对,通过测量两者之间的相似度来完成四别任务。(2)神经网络技术:这是一种较新的模式识别技术,具有字组织和字学习能力,能有效抗噪声和处理不完整的模式,并具有模式推广能力,但系统需要较长时间的学习。(3)统计分析技术:这是一种基于概率的方法,通过统计样本特征向量来确定分类函数。在模式识别中一般采用贝叶斯极大似然理论确定分类函数,其缺点是要从原始数据中提取特征向量,而不能直接对原始数据进行识别。5.3多通道交互技术5.3.3三维交互三维空间交互技术包括三维显示技术和三维操纵技术。前者是利用人两眼的视差,在三维显示设备(如立体眼镜或头盔式显示器)上呈现立体图像的技术。后者是利用三维交互设备(如三维鼠标、数据手套、跟踪球、三维操纵杆)在三维空间中与计算机进行交互。三维空间控制设备至少能控制六个自由度,分别描述三维对象的宽度、深度、高度、俯仰角、转动角和偏转角。通过控制这六个参数,用户可以在屏幕上或沿三个坐标轴转动三维对象,目前,实现三维交互的方法有:(1)直接操纵,利用三维空间控制设备直接操纵三维对象。(2)三维楔子(Widgets),这是三维界面中的一些小工具,用户可以使用它们在二维空间中控制三维空间中的物体。5.3多通道交互技术5.3.4表情识别人的面部表情相当丰富,包含着大量的信息,因此如何感知、记录和识别这些变化过程是表情识别的关键,面部表情的理解主要有五个方面的问题:人脸的分类、人脸的表征、人脸的检测、人脸的跟踪与识别、面部表情的分析与识别。迄今为止,国际上关于表情识别的研究可以分为基于心理学的识别和机遇计算机的识别,用计算机来分析和识别面部表情的关键是建立表情模型和情绪分类,并把他们同人脸的面部特征与表情的变化联系起来,计算机面部表情识别通常分为三个步骤,即表情的跟踪、表情的编码和表情的识别。5.3多通道交互技术1.面部表情的分类面部表情的分类有两种不同的体系,一类是对情绪的维度分析,即把情绪用三维坐标表示;另一类是对情绪的分类。汤姆·金列出了8种情绪:兴趣、快乐、惊奇、痛苦、恐惧、愤怒、羞怯、轻蔑;伊扎德在此基础上又增加了厌恶和内疚两种情绪;艾克曼定义了6种最基本的表情:惊奇、恐惧、厌恶、愤怒、高兴、悲伤,以及33种不同的表情倾向。2.面部表情的跟踪为了识别表情,首先要将表情信息从外界摄取回来。正如人在交流的过程中通过视觉获取对方的表情信息一样,计算机也要以某种方式获取这一信息。5.3多通道交互技术3.面部表情的编码要使计算机能识别表情,就要将表情信息以计算机所能理解的形式表示出来,即对面部表情进行编码。基于根据面部运动确定表情的思想,Ekman和Friesen于1978年提出了一个描述所有视觉上可区分的面部运动系统,叫做面部动作编码系统(FACS),它是基于对所有引起面部动作的脸的“动作单元”的枚举编制而成的。在FACS中,一共有46个描述面部表情变化的动作单元(AU)和12个描述头的朝向和视线的变化的AU。FACS系统由专人根据面部解剖活动对面部活动进行分类并完成编码。FACS编码员“解剖”表情,把它分解成特定的一些产生该运动的AU。5.3多通道交互技术4.面部表情的识别面部表情的识别可以通过对FACS中的那种预定义的面部运动的分类来进行,而不是独立地确定每一个点,这就是Mase,以及Yacoob与Davis的识别系统所采取的方法。例如,Yacoob与Davis根据Mase的工作,检测脸上6个预定义的和手工预置的矩形区域中的运动(量化为8个方向),然后利用6种表情的简化FACS规则进行识别。在他们的105个表情的数据库上,他们的总识别正确率为80%。Mase在一个更小的数据集上也得到了80%的正确率。考虑到FACS模型的复杂性,以及在脸上很小区域中度量面部运动的困难,这些已经是很好的结果了。5.3多通道交互技术5.3.5语音识别随着计算机技术的发展,人们迫切需要一种更加自然的、更加能为多数人所接受的方式与计算机沟通。在人机对话方面寻求最好的语音信息交换手段是发展人机语音通信和新一代智能计算机的主要组成部分。随着计算机的普及,越来越多的人在使用计算机,如何给不熟悉计算机的人提供一个友好的人机交互手段,逐渐引起了人们的重视。从而也就诞生了计算机语音学。计算机语音学覆盖了广泛的研究活动,包括语音识别、语音合成、语音编码、自然语言理解、机器翻译等。5.3多通道交互技术1.语音识别语音识别技术是计算机通过识别和理解的过程把语音信号转变为相应的文本文件或命令的技术。一个完整的语音识别系统应包括以下三个部分:(1)语音特征提取语音信号在完成模/数转换后,还要进行特征提取,一方面为了获得语音的本质特征;另一方面还可以进行数据的压缩。(2)声学模型声学模型是用于从语音到音节的概率计算。(3)语言模型语言模型用于计算从音节到字的概率。目前,语言模型主要有:规则模型和统计模型两种。5.3多通道交互技术2.语音识别系统的工作原理语音识别的过程分为三个步骤:预处理、识别和后处理。(1)预处理包含波形硬件采样率的确定、分帧的大小和帧移策略的确定;剔除噪声的带通滤波、高频预加重处理、各种变换策略;波形的自动切分。(2)识别包含特征参数提取;参数模板存储及识别。识别语音的过程,实际上是对语音特征参数模式的比较和匹配的过程。提取特征参数后,应对系统进行训练和聚类。(3)后处理包括自动分词、词类分析、词义分析、词用分析、语法分析、句法分析、同音词判别等。5.3多通道交互技术5.3.6自然语言理解计算机理解自然语言的核心任务是将自然语言的语句转化成机器内部的某种表示形式。这种内部表示形式应能完整地体现句子的语法、句法和语义信息,然后在这种内部表示形式上进行信息加工、问题求解和向另一种自然语言过渡(机器翻译)。目前自然语言理解的方法有:1.关键字匹配法2.转换网络和扩充转换网络3.图分析法4.格文法5.广义短语结构文法6.基于神经网络的理解5.3多通道交互技术5.3.7.手写识别手写识别是将文本的图形表示转化为字符表示的过程。手写识别可分为脱机识别和联机识别两种方式。脱机识别就是对已经写好的静态文本进行识别;联机识别是指人一边在输入板上写,机器一边识别,可进行人机交互。1.联机手写识别联机手写识别的过程分为四个阶段:预处理、归一化、特征提取和特征匹配。2.脱机手写识别脱机手写识别比联机手写识别困难得多,脱机手写识别得到的是点阵图像,还要经过细化运算才能得到笔画的点阵信息。脱机手写识别常用于扫描文字的识别和邮件的自动分拣。5.3多通道交互技术5.3.8数字墨水数字墨水是一种全新的人机界面技术。数字墨水通过数学上的三阶贝塞尔曲线描述输入的笔迹,它的记录格式与图像和文本格式都不同,这种记录格式使得墨水文件占用很小的存储空间。数字墨水的处理包括数字墨水的表示、压缩和显示,智能的墨水分析技术,墨水标记和注释技术,墨水的智能操作技术,墨水的存储和搜索等一系列技术。墨水解析技术是数字墨水中的关键技术,它可以将笔输入的字符串解析成单字,从而将复杂的语句级手写识别分解成语句识别和单字识别两个部分。数字墨水采用墨水格式的文件(.ink)保存,用户不需要将其转换为其它格式的文件。5.3多通道交互技术5.3.9.多通道整合技术多通道整合是指用户在与计算机系统交互时,多个通道之间相互作用,形成交互意图的过程。在用户的一次输入过程中,可能有多个通道参与其中,而每个通道都只携带了一部分的交互意图,系统必须将这些通道的交互意图提取出来,并加以综合、判断,形成具有明确含义的指令,以达到高效、自然的人机交互。1.基本概念整合(Integration)一词包含两个层次上的含义:在低层次上主要关注如何把各种交互设备和交互方式都容纳到一个系统中;在高层次上,主要关注多个通道之间在意义的传递和提取上的协作,而交替地使用单个通道,没有相互协作,不算是真正的多通道交互技术。5.3多通道交互技术融合(Fusion)与分流(Fission)对应输入与输出两个方向,融合就是指在多个层次(词素的、词法的、语法的、语义的、语用的、会话的)上对来自不同通道、具有不同表示的信息合一化处理,其目的是正确地获取用户输入,特别是正确地解释用户输入。而分流则是指在多个层次上对需要传达给用户的特定信息向不同输出通道、信道表示和表现所进行的转换。指称归结是指多个通道输入信息的共同所指。

5.3多通道交互技术2.人对多通道信息的整合人体正是通过眼、耳、手这些成对通道的整合,才得以非常方便地知觉我们所处的三维世界,并进行正常地活动。我们将这些成对的相同通道之间的整合称为“同质”通道。相应地,在“异质”通道之间的整合同样十分普及。例如,视觉与听觉的整合,使我们可以确定声源的位置。此外,在视听整合中,唇读与听觉信息的融合,对于人际间的语言交流也非常重要,尤其是在嘈杂的环境中。手眼的协调也是“异质”通道之间整合的例子,它既是一个通过眼的输入引导手的动作的过程,也是运动感觉和视觉感觉融合的过程。

5.3多通道交互技术3.多通道信息整合原理(1)多通道的用法①语音和手势/直接操纵互补。②其他形式的多通道整合也应考虑,如语音和书写的整合。③语音通道并不需要支持大词汇量,并且当词汇量小时,识别效果较好。④结合多个通道的输入有利于提高识别率。⑤任何时候所有通道都应该可用,以保证通道的自由组合。

5.3多通道交互技术(2)系统的结构①系统应该能够在硬件和软件上支持多种设备、多个通道。②时间是融合处理的基本原则,它允许重建信息的实际顺序。③以自然语言处理为核心将强烈地影响多通道系统的结构;可以扩充自然语言处理的技术来处理多通道整合。④采用语音/自然语言为输入方式的系统也可以采用更简单的系统结构和整合方法。⑤尽管语义层次的多通道整合会给界面带来更多的应用相关性,但它更为有效。⑥由于各个通道的技术不是完美的,任务特定的应用领域有利于实现多个通道的协作,因为里存在着最强的约束。

5.3多通道交互技术(3)整合策略①语音和手势信息的融合是目前多通道系统中整合的主要问题。②融合中的一个重要问题是消除歧异。③设备之间在时间响应上的差异可能非常大。除了利用时间的接近性之外,还需要结合语义、语法加以处理。④多通道反馈是在信息融合的过程中及时向用户分流重要信息的过程。⑤融合可以是“急性子”或“慢性子”的。“急性子”融合只要多通道输入支持整合就开始处理,是事件驱动的。而“慢性子”融合则要到具有全部输入或者比较完整的输入之后才开始处理。前者的优点是及早产生反馈,缺点是要进行回溯。⑥融合处理可以分散在系统中进行,也可以集中处理。5.4互联网界面设计

5.4.1Web界面的设计1.网页设计的原则 (1)内容与形式的统一 (2)特色鲜明 (3)统一整体的形象 (4)减少浏览层数 (5)了解浏览者的心理5.4互联网界面设计

2.网页的内容与风格(1)页面的内容设计①网页设计时要兼顾所有的浏览器都能正常地浏览。②应该尽量避免形成复杂的网状结构。③要权衡多媒体信息和文本信息所占的比例,在不影响网站效果的前提下,尽量减少图像的数量和所占的面积。④网站的首页非常重要。⑤网站的内容应该不断更新,并在首页上注明更新日期和相关链接。⑥网页中应该提供一些联机帮助功能。⑦网页中的文字应该简明、通俗易懂。5.4互联网界面设计

(2)网站的风格网站设计的风格要考虑以下因素:①网站的标志(Logo)尽可能出现在每个页面上。②要突出网站的标准色彩。文字的色彩、图片的住色彩、背景色、边框色等尽量与标准色彩一致。③突出标准字体。在关键的标题、菜单、图片中使用统一的标准字体。④使用朗朗上口的宣传语,把它放在醒目的位置。⑤使用统一的语气和人称。⑥使用统一的图片处理效果。例如,阴影的效果、方向、高度和模糊度都必须统一。⑦创造网站特有的符号和图标。⑧使用统一的花边、线条等元素。5.4互联网界面设计

3.网页的布局页面布局要遵循的原则:(1)平衡。是指画面中的图像、文字的视觉分量在上下、左右几个方位基本相当。(2)呼应。是指同一种设计元素同时出现在不同地方,形成相互联系。(3)对比。用不同的色彩、形态、线条等视觉元素形成对比,造成画面的多种变化,达到丰富的视觉效果。(4)疏密。充分利用页面的空白,疏密有度,是画面产生韵律感,体现出网站的格调与品位。几种常见的版面布局有:“同”字型结构布局;“国”字型结构布局;左右对称布局;自由式布局。5.4互联网界面设计

4.页面的色彩网页色彩搭配的一些原则:(1)色彩的合理性。网也的色彩搭配要赏心悦目,风格雅致,切不可大面积地使用刺眼的颜色,使人视觉疲劳。(2)色彩的独特性。色彩搭配要有自己的风格,与众不同,形成独特的氛围,使人留连忘返。(3)色彩的艺术性。色彩的搭配一定要有艺术内涵,最好请专业的艺术人员来设计,这样才能凸显出网站的品位和内在修养。(4)色彩的联想性。色彩的运用要能使人产生联想,例如,浅粉色使人想到女性的柔美、妩媚,适合于女性网站;黑色使人想到黑夜,可作娱乐性网站;绿色使人想到生机盎然,可作环保网站。5.4互联网界面设计

5.页面的字体选择字体的原则①一致性原则。一旦选择了某种字体,就应该在整个网站上统一使用,同一种字体表示相同的数据和信息,字体的颜色也应该一致,使用户易于区分不同字体和颜色所各自代表的内容。②统一性原则。字体的选择要和网页的整体风格融为一体,不要为了寻求变化而选用多种字体,使网页显得凌乱不堪。③匹配性原则。在同一篇文章中,最好使用同一种字体,为了突出标题可选用不同的字号,切不可多种字体混排。5.4互联网界面设计

6.界面的导航一个网页中仅有五个区域用来放置导航元素:顶部、底部、左侧、右侧和中央。导航的位置必须保持一致性,如果主导航在顶部,辅助导航在左部,就要保持这种布局。但是主页的导航位置和其它页面的导航位置可以不同。导航的布置应和页面的布局保持一致。导航元素在位置、次序和内容上应当是稳定的。页面尺寸应该固定不变,这样可以保持设计的一致性,并提高用户的可预见性。除了要限制导航元素的滚动外,还应限制鼠标在导航选择项之间的移动。设计时要考虑到导航元素和返回按钮之间的距离,在可能的情况下,尽量使导航项和返回按钮的距离为最小。不管网站的形式如何,导航的目的就是要帮助用户简单而快捷地找到目标,使网站浏览起来更方便。5.5移动界面设计1.移动界面的设计原则(1)了解用户(2)了解目标平台(3)易于检索(4)采用统一的界面风格(5)避免不必要的文本输入(6)提供个性化的服务(7)最大限度地避免用户出错(8)文本信息应当本地化(9)进行必要的用户测试5.5移动界面设计2.移动设备操作系统(1)PalmOSPalmOS是专为掌上电脑开发的移动操作系统。现在,许多智能手机也使用PalmOS移动操作系统。(2)WindowsCEWindowsCE是微软公司推出的移动设备操作系统,它采用图形用户界面,支持多媒体功能,如音频、视频,其下的开发工具比较完善。(3)EPOCOS和SymbianOSEPOCOS是专为手机开发的移动操作系统,广泛应用

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论