设为主页   北京: 多云转阴 18℃~31℃

艺术与设计
ART DESIGN

返回顶部

艺术与设计 > 设计 > 浅析眼动理论在移动端幼教用户界面设计中应用的可行性分析

浅析眼动理论在移动端幼教用户界面设计中应用的可行性分析

Webmaster: ArtDesign | Time: 七月 6, 2018

摘    要:随着移动终端在儿童教育中的推广,针对其界面设计不合理而诱发的儿童视力健康问题,笔者从图形语言角度出发,结合眼动理论、幼教用户界面的特殊性以及幼儿教育中的视觉语言属性,分析并总结出幼教用户界面设计中图形语言的应用方法与原则。目的是总结出一套有利于儿童视力健康的幼教用户界面设计方式和方法。文章主要论述自身研究的前半部分,即眼动理论在幼教用户界面中应用的可行性分析。

 

关键词:眼动理论;幼教用户界面;图形语言

检    索:www.artdesign.org.cn

中图分类号:TP391        文献标志码:A        文章编号:1008-2832(2018)05-0089-03

 
一、幼教用户界面设计中眼动理论应用的必要性

(一)背景概述

国务院2011年颁布的《中国儿童发展纲要(2011-2020)》中明确指出:“加快发展3~6岁儿童学前教育,优化教育资源,拓展数字化学习空间,全面推进教育现代化和信息化”。伴随着信息化技术的普及与国家出台政策支持,幼教产品如雨后春笋般竞相出现,它将大量信息传递给儿童,丰富了儿童的日常生活与学习。但儿童视力尚处于生长发育阶段,幼教产品的辐射、屏幕色调等问题,会直接影响儿童视力健康。
首先,从电子产品低龄化角度来看,随着信息化技术的普及,电子产品已渗入到儿童生活的方方面面。2013年,北京市妇女儿童博览会中发布的《2013年中国城市儿童生活形态报告》显示,4~6岁儿童中约有53%会上网,他们的课余生活是在电脑、手机等不同屏幕间切换。其次,从儿童数字化教育趋势来看,国家政策的支持以及电子教育产品的发展,儿童教育进入数字化阶段。2006年,教育部将“手持式网络学习系统在学科教学中的应用研究”定为全国“十一五”教育技术研究重点课题,至此在相关政策支持下进行电子教科书的研发推广,直接推进了儿童教育数字化的发展。然后,从幼教用户界面角度来看,儿童电子产品的负面影响与儿童生理发展存在着矛盾。北京清华长庚医院眼科医师郭立斌2016年在京工报中指出:现代社会中,电脑、Pad、手机等电子阅读产品已经成了伤害儿童视力的罪魁祸首。婴幼儿时期眼睛是远视状态,睫状肌长期处于不同幅度的收缩状态。在此期间,如果孩子眼睛超负荷工作,将导致用眼疲劳,远视状态结束的时间提前,极易发生近视。
综上所述,电子化产品已融入到儿童生活的方方面面,经前期调研,儿童使用电子产品引发的生理与心理问题已引起社会关注。而本研究集中在预防儿童近视的幼教用户界面设计方面,经调研分析得出电子产品引发儿童视力健康问题的原因大体如下:现阶国内幼教产品界面设计处于初步发展阶段,技术和设计不足给儿童身体和心理带来了不同程度的伤害。其次,3~6儿童处于生长发育阶段,视力发展尚未成熟,过早、过度使用电子产品会对儿童视力产生不同程度的影响。针对上述问题,笔者拟采用眼动理论与图形语言相结合的方法,对现有幼教用户界面进行设计,缓解相应矛盾。

(二)国内外研究调研

对于幼教用户界面中眼动理论和图形语言的应用,国内外研究具体分析如下:

在国外:与本研究相关的眼动理论研究有,2005年,Enquiro和Did-it公司与眼动仪公司Eye tools发现了F型眼动模式,这为具有良好视觉层级结构的界面设计提供了依据;2008年,Sorensen提出眼动行为能测量用户的情感反应,至此,一些学者开始尝试用眼动指标来研究用户情感体验①;实践方面,2008年,Weinreich等以眼动理论为依据针对网站进行可用性测试,使网站在用户登陆之际抓住他们的注意力;2016年麻省理工学院和乔治亚大学研究人员合作,开发一款能确定用户目光注视点的手机APP,届时,眼动跟踪技术有望用于智能手机。从图形语言的理论研究方面来看,英国埃克塞特大学的精神科研究员表明色彩的搭配方式会对眼睛造成不同程度的影响;2012年,Yen KungLai②和Eva③对平板电脑进行视觉疲劳研究,找出移动设备与计算机阅读时产生视觉疲劳的区别。实践方面,美国Fact Monster少儿网站,对界面色彩的明度、亮度控制,减少儿童浏览界面时产生的视觉刺激;另外,2016年发布的iphone系列,晚间屏幕显示自动调成暖黄色调,减少视觉疲劳。
在国内:与本研究相关的眼动理论研究主要体现在,2013年,东北大学李森老师对网络浏览中的用户情感进行研究,建立了网页浏览中用户情感体验与眼动指标之间的关系模型④;2014年北京举办的和谐人机环境联合学术会议中,利用眼动理论预测用户的网络搜索行为⑤,进而改进搜索引擎和提升用户体验;实践方面,2013年第二届湖北省青年心理学人论坛中,采用量表和眼动技术相结合的方式,探讨儿童在观看视频时视觉与心理特点。相关的图形语言理论研究有,2012年宁波举办的第十四届全国包装工程学术会议中,对最符合儿童认知特点的学习型游戏人机交互界面设计方法进行探讨;图形语言方面与本研究相关的实践研究有2003年第七届全球华人计算机教育应用大会中,中央大学以平板电脑为例进行实验,探讨儿童在提高学习效率同时降低视觉疲劳的用户界面设计方法;2016年,中国标准化研究院与北京阳明智道光电科技有限公司通过对iPad2平板电脑使用者进行测试,确定环境照度与显示亮度对人眼视觉质量和视觉疲劳的影响⑥。
通过前期调研与分析,眼动理论的相应研究主要体现在以视觉搜索为出发点,通过眼动追踪技术对人眼搜索模式进行探索;从心理学角度出发,对界面各要素与受众认知特点之间的关联性进行探讨。而图形语言的相应研究主要为幼教用户界面中各要素与儿童视觉疲劳之间关系的研究,及从儿童认知特点出发,探讨符合儿童认知心理的人机交互界面设计的方式方法。而本研究主要从图形语言角度出发,着重解决界面设计不合理而引发的儿童近视问题,并以儿童眼动理论和视觉语言理论为依据,对创建有利于儿童视力健康的幼教用户界面设计方式方法进行探究。

二、眼动理论、幼教用户界面、图形语言的特点与关联性分析

(一)儿童眼动特点

人类从外界获得的信息约83%来源于视觉,通过眼动研究可以了解用户视觉特点。笔者通过前期调研与实验总结,归纳出儿童眼动特点如下:

1. 承载丰富信息区域优先特点。即不同年龄段儿童在浏览界面时眼动视线均集中在承载丰富信息区域,儿童对丰富区域的注视时间越长,对该区域内容的解读越好⑦。
2. 图画优先特点。即儿童在浏览界面时视线主要集中在图画区域,对文字区域的注视较少。图画是对事物的生动再现,通过图画进行学习对儿童来说非常有吸引力。
3. 新信息优先特点。即与“旧信息”相比,界面中出现的新信息会优先引起儿童注意⑧。例如,在《好饿的毛毛虫》中,相对于从第1页就出现的旧信息毛毛虫,儿童会先注意到下文中第一次出现的苹果。
4. 大面积信息优先特点。界面中信息比例大小对儿童的吸引力不同,大面积信息会优先引起儿童关注。如经过放大处理的标题会在儿童浏览界面时,首先获得儿童注意。
5. 色彩鲜艳区域优先特点。即与色彩暗淡区域相比,色彩鲜艳区域能吸引儿童关注。如毛毛虫和背景区域相对比,毛毛虫的颜色要鲜艳的多,因此更能吸引儿童注意。
6. 面部区域优先特点。人脸是被注视最多的地方,眼动注视点相对集中在五官。且儿童在观看动物卡通形象时也表现出相同的特点,即视线集中在眼、鼻和嘴上。
对儿童眼动认知特点的分析,为幼教用户界面设计提供理论依据和数据支撑,另外,通过眼动追踪技术,快速准确获取儿童眼动信息,帮助笔者更清晰的了解儿童视觉感知特性与认知过程。

(二)幼教用户界面设计中图形语言的特点与功能分析

本研究中的图形语言主要应用在幼教用户界面的各个构成要素中,其特点与功能主要体现在以下几方面:

1. 点。幼教用户界面中多使用圆润平滑的点,视觉效果上显得亲切可爱;另外,在点击、滑动指令下会加入点的特效元素,使画面更加生动。
2. 线。幼教用户界面中多采用曲线线条,曲线的柔和优雅给儿童饱满圆实的视觉感受。另外,通过加粗的圆滑线条边框对信息进行划分,给人以圆润的感受。
3. 面。幼教用户界面中的面多为圆形或圆角组成,画面活泼,而方形、三角形等图形缺乏亲和力,不符合儿童心理需求,因此在界面中使用较少。
4. 形。幼教用户界面中的图形多是以动植物为元素的拟人化图形,且随着虚拟现实技术的发展与普及,3D效果的表现形式更容易儿童被接受。
5. 色。幼教用户界面中的色彩明亮、纯度高且对比度强烈,儿童视觉处于发育期,对比强烈、饱和度高的色彩搭配,可吸引儿童的视觉注意力。
6. 光。界面中的色彩通过电子光产生而具有明显的光亮强度,因此界面在符合美感的前提下可减少色彩的色度以达到降低电子光对眼睛的刺激,从而降低视觉疲劳感。
通过对幼教用户界面中图形语言的特点与功能分析,掌握儿童阶段图形语言的特性并与前述儿童眼动部分结合,同为创建保护儿童视力健康的幼教用户界面提供理论依据。

(三)幼教用户界面中的视觉要素属性分析

由于幼教用户群体的特殊性,其用户界视觉要素的特点与功能体现在以下几方面:

1. 色彩。界面色彩通常选用类似色,使风格统一。当遇到大量信息,会采用白色背景,便于用户预览信息。而儿童阶段偏爱对比强烈、饱和度高的色彩,故幼教用户界面中色彩明度纯度较高,使界面看起来生动活泼。
2. 文字。界面中文字标题可吸引读者注意,便于读者阅读,因此通过字体版式设计,可帮助用户获取的信息。而3~6岁儿童认识文字较少,故幼教用户界面中会对文字进行趣味性设计,辅助儿童进行学习。
3. 图标。界面中的图标风格分为具象和抽象:具象如细节丰富的拟物化图标,抽象如简洁直观的扁平化图标。3~6岁儿童抽象思维能力弱,偏爱具象图形,因此界面中图标以图案为主,并进行简单的设计,确保儿童辨认操作。
4. 角色。与图标设计相似,根据儿童思维特点,界面中多选用造型生动活泼的卡通形象。另外,对儿童熟悉的元素进行拟人化设计,可提高儿童学习兴趣。
5. 动画。动画效果的运用能够给用户带来新鲜感,增强记忆效果。
儿童时期注意力差,因此,幼教用户界面中动画设计或交互过程中的动画特效,可使界面更好的吸引儿童注意力。
6. 界面交互。界面中以菜单的形式将功能与信息分类进行排布设计,用户可通过鼠标、触屏等方式获取所需信息。儿童阶段思维逻辑能力较弱,因此在交互方面有明显引导,辅助儿童使用;另外,界面的层级架构不宜过多,方便儿童轻松掌握与操作。
总之,上述幼教用户界面中视觉要素的属性特点分析,为本研究中眼动理论和图形语言在幼教用户界面中应用提供了的方法与准则。

(四)幼教用户界面中眼动理论与图形语言的关联性分析

综上所述,将眼动理论和图形语言结合,解决幼教用户界面设计不合理而引发的近视问题,其可行性体现在:

本研究中眼动理论和图形语言均将幼教用户界面作为研究对象。眼动研究是针对用户界面中视觉信息加工研究最有效、最直接的手段之一,可直观显示眼动特征及用户对界面信息的感兴趣程度。如大量分散的注视点表明搜索效率低,说明界面信息要素排布不合理;重要的要素注视点越多,表明获得的注意也就越多。图形语言作为幼教用户界面中最基本的构成要素,在界面中所呈现的形态,具有不同的功能及属性。如图标具有直观、简明的特点,简单且辨识度高的图标可以引起儿童的共识;文字作为一种特殊的图形符号,通过对其字形、颜色设计,可吸引儿童的注意力,提高阅读兴趣。而幼教用户界面作为图形语言的载体,因其用户特殊性,故具有自身独特的属性。如界面中多为圆滑字体,且字体经过卡通化设计,帮助儿童阅读;对重要信息或图形添加粗线勾边,强化视觉效果。
从上述分析来看,眼动理论中的各项测量指标可直观测量出儿童在使用幼教用户界面时的眼动规律,进而分析用户心理特征及对界面中各要素的感兴趣程度;另外,以儿童眼动作为指标,可对界面进行优化设计,使界面更加符合儿童的认知心理与使用习惯。图形语言作为幼教用户界面中的构成要素,也是界面中信息的载体,在吸引儿童注意力,传递信息的同时,还能从儿童的生理心理角度出发,确保儿童阅读使用时的“舒适性”。因此,基于眼动理论与图形语言的以上特性,并将其结合,为构建保护儿童视力健康的幼教用户界面提供了方法与可能。

 

三、小结

综上所述,伴随着信息化技术的普及与国家出台政策支持,电子产品在儿童教育中的应用不断推广。但儿童视力处于生长发育阶段,长时间使用幼教产品,眼睛处于超负荷工作状态,将导致用眼疲劳,继而引发近视。在此背景下,本研究针对幼教用户界面设计不合理而引发的儿童近视问题,从图形语言角度出发,以眼动理论为切入点,对图形语言在保护儿童视力健康的幼教用户界面设计中应用的必要性和可能性进行了分析总结,为后续研究中,探讨基于眼动理论的幼教用户界面设计的可行性,总结相关应用方法及原则,以及进行相应实证研究等奠定了重要前期基础。■(宋树峰,李彬彬   大连理工大学 建筑与艺术学院)

 

 

注释:

① Sorensen J.Measuring emotions in a consumer decision-making context—approaching or avoiding[J].Aalborg University,Department of Business Studies,2008(20):1-41.

② Lai Y K,Ko Y H.Visual Performance and Visual Fatigue 0f long Period Reading on Electronic Paper Displays [J].journal of Ergonomic Study,2012,14(2):119-126.

③ Eva S,Yves B,Per B,et a1.Reading on LCD VS e—Ink Displays:Effects on Fatigue and Visual Strain [J].0phthalmic&Physiological Optics,2012,32(5):367-374.

④ 李森,孙敏,许娜,刘凡涛.网页浏览任务的用户情感测量模型研究[J].工业工程与管理,2013,18(1):106-110.

⑤ 第十届和谐人机环境联合学术会议论文集[C].2014.

⑥ 蔡建奇,杜鹏,郭娅,等. Ipad 使用过程中环境照度对人眼视觉质量的影响研究[J].照明工程学报,2016,27(6):6-9.

⑦ RAYNEIL K.Eye movement in reading and information processing[J].Psychological Bulletin,1978,85(3): 618-660.

⑧ 李林慧.学前儿童图画故事书阅读理解发展研究——多元模式意义建构的视野[D].上海:华东师范大学,2011.

 

 

 

参考文献:

[1] 朱滢.实验心理学[M].北京:北京大学出版社.

[2] 樊翠芳.儿童网站的界面设计方法研究[D].上海:东华大学,2009.

[3] 戴文静.学前儿童使用iPad情况的调查研究——以上海地区为例[D].上海:上海师范大学,2013.

[4] 白丽辉,齐桂林.学前心理学[M].南京:东南大学出版社,2015.

[5] 郭楠.面向儿童安全教育的数字化学习App设计[D].西安:西安理工大学,2013.

[6] 韩映虹,闫国利.眼动分析法在学前儿童认知研究中的应用[J].心理科学,2010(1):191-193.

[7] 高晓妹.汉语儿童图画书阅读眼动研究[D].上海:华东师范大学,2009.

[8] 李林慧.学前儿童图画故事书阅读理解发展研究——多元模式意义建构的视野[D].上海:华东师范大学,2011.

[9] 胡珊.视听心理学[M].北京:世界图书北京出版公司,2012.



无觅相关文章插件,快速提升流量