协同教育平台用户界面设计研究

协同教育平台用户界面设计研究摘要：随着现代信息技术的不断发展和广泛传播，构建学校、家庭、社会协同教育平台是搞好未来教育的基础与前提。

以心智模型为理论依据，结合逻辑学、心理学和美学等理论知识，分析了用户界面设计的思想、关键因素，以及应当遵循的基本原则，并对适合于协同教育平台的界面进行了设计。

关键词：协同教育；界面设计；心智模型0引言协同教育是未来教育的主流，它联合对学生有影响的各个社会机构的力量，即学校、家庭、社会三大教育系统，对学生进行教育，产生协同效应，以提高教育成效。

协同教育平台是信息时代家校协同的新发展，它汇聚了更多的教育力量，促进了学校、家庭、社会三个教育系统的有序运行，弥补了技术支持下的学校、家庭、社会协同教育中的不足，有利于促进我们素质教育的进程与发展。

用户界面设计涉及到了用户与界面之间的关系，是通过协调界面各构成要素，优化人与界面信息交流过程，以提高人与界面交流的效率，最终达到满足用户需求的目的。

协同教育平台的用户涉及到了家长、教师、社会人员以及学生等成员，对于部分家长用户而言，由于其家庭背景以及自身文化素质等客观因素的差异，他们无法使用网络技术等方式与学校进行沟通交流，这样更导致了学生的学校教育与家庭教育的脱节，不利于学生的教育与成长。

为了更好地促进协同教育平台的进展与实施，设计人员所设计的用户界面必须要具有良好的人机界面，界面简洁明朗，导航清新，操作简易和高效快捷。

本文就用户界面设计的设计思想、关键因素及界面设计的基本原则进行了探讨与分析，进而设计出适合于协同教育平台的界面。

1设计思想协同教育平台以网络技术为支撑给用户提供了多种新的功能和体验，随着用户生活水平和审美能力的不断提高，他们更多地关注平台界面的易用性、使用的愉悦性等。

那么设计人员开发之前则需要了解用户的认知、心理、习惯和动机等行为，只有从用户的实际需求上出发才能设计出易操作、人性化和满意度高的界面，即要用以人为本的界面设计思想进行设计。

从认知心理学研究范畴来看，要了解用户的心理行为，就必须先了解用户心智模型。

Jay Wright Forrester教授将心智模型定义为：“在我们的脑海中，关于周围世界的图景仅仅是一个模型，并没有人会在脑海中真正去想象世界各地的政府或国家。

他们只选定那些与他们以及身边事物有关的概念和关系。

”^[1]简单来说，心智模型又称心智模式，就是人们在生活中积累下来的认知和习惯，也就是说用户对某种类型的网站有一定的使用经验，在使用类似网站的过程中，根据用户自身习惯思维、定势思维及已有的知识，会自然地产生一定的心理认知程序，认为这些产品应该按照自己的想法去使用。

在用户界面设计的过程中，可以将已经形成的心智模型作为一种分析研究的手段或方法，进而可以节约许多的时间和精力。

不同的用户对不同的界面需求是不同的，不管怎么样，因为使用对象是用户，必须很好地满足用户的需求，才能设计出比较成功的界面，所以在进行界面设计时应该用以人为本的思想，依据心智模型理论进行设计，即在界面设计之前，要充分考虑用户群体的思维和行为特性等因素，进而设计出满足用户的界面。

2用户界面设计的关键因素2.1特殊的用户角色通常在开发设计一个平台的用户界面之前，要先对用户对象类型进行分析。

一般用户都需要更易于理解的信息，要求平台具有友好和简洁清晰的界面设计，要求设计者考虑到用户的人群属性、心理需求、认知水平和文化背景等相关属性。

协同教育平台的用户角色有家长、教师、学生和社会人员，对于部分家长这一特殊用户，由自身文化素质、家庭条件、工作时间及平台操作能力等客观因素的限制，使他们的信息化认知水平参差不齐，但是他们对自己的正常需求很明确，设计人员在把这些现实需求转换为物理模型时要加以适当引导。

除了家长用户角色以外，还有教师、学生和社会人员参与，这些都是在家长教育子女日常生活中需要配合的必要人员，因此界面设计人员应根据各个用户角色类型的不同设计出不同的界面风格，但平台界面的整体设计风格要符合一定的规律性，要全面考虑到用户的不同需求。

2.2具有通道特性的网站导航通过对心智模型进行分析发现，导航是网站用户界面设计的一个关键点，导航就相当于网站的通道，它可以为用户体验提供极为丰富友好的界面，网站导航设计得合理与否直接关系到所设计网站的成功与否。

网站导航设计合理，直接决定用户在网站中穿梭浏览的体验感受，可以将网站的服务内容最大程度地呈现在用户面前，甚至可以展现出用户意想不到的服务内容，可以激发用户继续浏览的兴趣，这样易于提高网站的浏览深度，增加了网页被浏览的次数。

依据心智模型理论可知，网站导航的位置应该接近于网页的顶部或左侧。

学校网站、教育资源网站等很多有名的网站都是采用这种方式，这是因为绝大多数用户心智模型里导航条的位置都接近于网站的顶部和左侧。

但是如果为了突出自己的与众不同，而把导航设计在接近网站的中部或下部的地方，这样反而会使用户体验起来不习惯、不方便，进而会消减用户继续体验的兴趣。

对于导航的使用情况，要求其要尽可能简单，避免使用下拉或弹出式菜单导航，如果不得不使用，那么所设计的菜单层次最好最多只有两层。

网站的导航条有很多种类，其中要特别注意的是面包屑导航。

面包屑导航是单一维度的导航结构，其作用是让用户在浏览访问的时候知道自己现在所看到的网页是什么以及与现在所看网页的相关网页是什么，例如通过所要设计的协同教育平台的导航“首页>课题中心>研究课题”里网页所在位置的文字说明，与此同时也要配合导航的颜色亮度等方面，这样可以达到视觉被直观指示的效果。

不难看出，面包屑导航具有跟踪用户行为和记录用户在网站上的活动足迹的功能。

2.3结合了逻辑与美学的界面设计界面的一致性结合了逻辑学、心理学和美学等方面的理论知识。

逻辑强调的是程序内部的一致性，在平台进行更新的时候，平台界面的设计布局、设计色彩和图标等可以有所改变，但是不要相差太远。

考虑到一些使用技巧和功能的位置是否应该有所保留，最好不要做出太多违背心智模型的改进，因为大部分用户喜欢追求最新版本，新旧版本之间过多的变化，会使用户使用的难度增加，这是一种基于心理模型的正常反应，这些是符合心里学理论的。

同时，在界面更新换代的时候也要遵循平台所应有的规范，强调界面要具有一定的一致性。

美学强调了审美的一致性，一般对于网页的切换方面而言，不希望页面之间在界面风格、视觉结构及图标上出现太多的变化，那样很容易让用户产生不和谐的感觉。

3界面设计基本原则3.1对称性根据格式塔心理学家提出的“知觉简化性”原理，协同教育平台的用户界面设计要尽量简洁，使用户一看到界面就能看出平台具有哪些功能和平台边界，整体上感觉比较舒适，而不是复杂的、杂乱无章的网络结构，给用户一种别样的心理体验，使系统的实效达到最优。

3.2易开发性界面设计要构建合理的页面组织结构，组织结构包括序列结构、层次结构、网状结构、复合结构等。

界面设计虽然容易定位，但是对于设计人员来说并不是那么简单，本文基于B/S架构来进行设计，充分体现了HTML和CSS的优点，能够对界面布局进行美化和定位。

在设计界面时，还要简化界面操作尽量遵循“3次点击”^[2]原则，如果点击了3次以上还找不到所要的信息，就会降低用户使用的积极性。

3.3符合视觉浏览顺序界面设计，是否考虑到用户固有的网页浏览、观察、思考方式，会直接影响用户的浏览时间和最终的使用感受。

因在计算机界面的左上方是最容易被注意到的，经过有关数据可知注意程度最高（33%），其次是右上方，界面的右下方为最低注目区域。

所以，在设计协同教育平台界面布局时，要考虑将界面中最重要、最需要用户首先知觉的信息优先放在注意和观察频率较高的左上方和右上方区域，例如平台名称、最新公告、热点话题、导航信息等。

然而，视觉流程是一种感觉而非确切的数学公式，它可以根据符合人们认知过程的心理顺序和思维发展的逻辑顺序灵活地加以运用。

3.4一致性界面需要依据用户的认知特点进行设计，使界面设计乃至整个系统风格控制能够达到一致，这样在一定程度上能够减少用户的记忆负荷，减少用户的学习操作时间，简化操作方法。

协同教育平台是基于家长、教师、学生和社会人员，特别是针对于部分家长用户的，其界面设计风格既要简单实用，又要清晰明了。

3.5平台界面设计思想首页是一个网站平台的总体体现，能够整体地反映出一个平台所具有的特色。

本文所设计的是协同教育平台的用户界面，协同教育平台是全国“十二五”教育科学规划课题下的“基于网络的学校、家庭和社会教育”的研究成果之一，首页平台将Logo设计如图1所示。

该Logo的设计理念充分体现了该平台的基于网络的学校、家庭和社会教育的思想，首页界面将该Logo与蓝天背景结合，给人一种蓝色宇宙的遐想，再加上具有立体感的电脑屏幕图和人物图，充分体现出了平台所服务的主题：以学生为中心，结合学校、家庭和社会进行协同教育。

平台首页界面如图2所示。

根据界面设计的对称性和开发性基本原则，将该平台的界面设置为简单的“国”字型（如图2所示），使界面整体看起来结构清晰，给用户一种轻松的感觉，这样就间接地减轻了用户的视觉负担。

考虑到界面的一致性，将界面整体的色调设计为蓝色调，蓝色让人有一种宁静、明亮、清澈、深邃、梦幻、浪漫、内在以及智慧的感觉。

这样设计出来的风格既简单实用，又清晰脱俗。

4结语本文主要提到了有关用户界面设计的一些观点，它不仅借助了心理学、逻辑学、美学及教育技术相关理论和方法，而且还根据用户界面设计本身的分工细致程度，对背景做了不同要求。

所以，为能设计出用户满意的界面，需要很好地了解用户需求。

协同教育平台研究是全国“十二五”教育科学规划课题之一，而开发出一种能够服务于学校、家庭、社会协同教育的多功能网络平台不在于它的功能难以实现，而在于它是否适用于家长、教师、学生以及社会人员等用户。

在平台开发过程中，用户界面设计具有不可估量的重要作用。

本文通过分析用户界面的设计思想、相关因素和基本原则，使协同教育平台的用户界面设计不仅在功能上满足用户需求，使整个设计更加规范，界面更加简洁，而且还加快了平台的开发效率。

参考文献参考文献：[1]杨静.浅谈用户界面设计[J].艺术与设计，2009（10）.[2]周长春，王长杰.Web应用界面设计方法[J].计算机工程与设计，2006（7）.[3]南国农.成功协同教育的四大支柱[J].开放教育研究，2006（5）.[4]李运林.协同教育是未来教育的主流[J].电化教育研究，2007（9）.[5]程定稆.产品设计中基于心智模型的符号指向研究[D].无锡：江南大学，2009.[6]黄艳群.设计人机界面[M].北京：北京理工大学出版社，2007.[7]黄立新.技术支持的协同教育研究[D].兰州：西北师范大学，2009.[8]韩雪涛.基于网络的家校合作系统中个性化推荐的设计与实现[D].北京：首都师范大学，2006.[9]马忠虎.家校合作[M].北京：教育科学出版社，1999.。