互交设计中的人体工学

    跟进了一段时间的UI设计,总结一下从这工作中学到的东西先。

    互交设计,归根到底是为了提高用户体验,因为离开不了人,所以人体工学往往在互交设计有一定的参考价值。

人体工学对互交设计的影响

1. 结合设计心理学进行设计计划

根据设计心理学的理论来分析交互媒体产品的使用者的需要,使用者的满意度、使用者的个体特征。同时也可利用设计心理学进行社会文化、社会阶层、社会群体、社会心理现象等宏观方面的分析,从而做出更符合用户需求的产品。

2. 设计阶段结合人的感觉习惯以及人体测量学

根据人的感觉习惯以及人体测量学中的具体内容对交互媒体作品的整体框架、色彩搭配、交互方式、界面元素的形状大小等方面提供依据。人的感觉习惯与人体测量等具体数据与内容需要在用户调研时研究清楚,为以后的设计提供一个行为习惯上、数据上的基础。

3. 任务分析时融合认知心理学和色彩心理学

通过了解人的信息加工处理过程、人的注意力、人的失误性、人的疲劳性等确定任务的操作流程、复杂程度、休息间隔等等详细内容。

4. 任务分析的同时结合色彩心理学

交互媒体产品的初步任务分析决定了是用于教学还是用于娱乐等基本性质。每个类型的交互媒体产品有其控制色、基本色、窗口框架和图标颜色、任务栏色彩等的基本色彩使用的规范。所以交互媒体界面的色彩设计是根据色彩心理学和设计任务分析来共同决定的。

人体工学在互交设计中的应用

1. 视觉与文字信息

文字的设计是交互媒体界面中重要设计元素之一,文字具有很高的明确性和极佳的直观传达作用,可以传播大量的信优势,特别适用于交互媒体界面的设计中。在选择文字的时候要考虑它的明确性、适合性、美观性、创新性以及易读性。

文字的设计要力求突出重点,简明扼要,在设计界面文字时我们应该合理的设计文字,使其符合人机工程学原理中人体的思维习惯。

下面以文本的长度举个例子:

我们一般显示的大段文字的文本,一般以40个字以内一行,报纸的排版就是一个参考。一行字太长,一般会增大用户的阅读难度,容易造成用户串行,造成用户体验不佳。(平时我们喵到一大片的文字就不想看,不是因为我们不爱文字,而是我们生理上接受不能啊)

经过研究人际工程学发现:中心视角10°以内是最佳视区,人眼的识别力最强;人眼在中心视角20°范围内是瞬息视区,可在极短的时间内识别物体形象;人眼在中心视角30°范围内是有效视区,需集中精力才能识别物象;人眼在中心视角120°范围内为最大视区,对处于此视区边缘的物象,需要投入相当的注意力才能识别清晰。人若将其头部转动,最大视区范围可扩展到220°左右。

计算得知,如果人眼距离屏幕40cm,最佳视区10°看到的宽度约为7cm。

瞬息视区10°看到的宽度约为14cm。

有效视区30°看到的宽度约为21cm。

所以我们页面的文本一行长度要尽量限制在21cm以内,根据字体的大小,适当调节文字长度将有利于提高用户体验。

2. 界面色彩的设计应用

亮度:

首先,亮度越高的时候,视觉识别难度更大,眼睛更容易疲劳。

上图右边的曲线称为明视觉曲线,是在明亮的环境下(5尼特)的光谱响应。可以看出,人眼最灵敏的点是在555毫微米的黄绿色光。对于475毫微米的蓝色光和650毫微米的橙红色光,需要10倍的强度才能引起与这黄绿色光相同的亮度感觉,而对于685毫微米的红色光,灵敏度就更下降到1%了。如上图的暗视觉曲线,是在0.001尼特以下的亮度下测定的。可以看出,峰值已经转移到510毫微米的绿色光,相应10%灵敏度的点分别为420毫微米和585毫微米。这是杆状细胞在起作用。

从上面的分析可以看出,在同样明亮的环境下,人眼最敏感的是黄绿光到绿光间的范围,如果页面太多这类颜色的元素,眼睛会容易产生疲倦,要谨慎使用。

那对于设计中的颜色,白色是白频光,全放射光对人眼的刺激最大,所以可以看到很多印刷品采用淡黄色和米白色的纸张。而针对于电脑本身就带有发光,所以同样的颜色对于用户的阅读难度已经增大。另外有眼睛表明,同样的文字,在电脑上的阅读效率仅仅能达到纸张上的80%不到。因此为了网页的浏览速度和舒适度,越来越多的网页设计采用了淡灰色、淡蓝色、淡绿色等等。

色相:

不同的颜色所产生的心理作用会给人不同感觉。在心理学上,对于一种感觉兼有另一种感觉的心理现象,叫联觉现象。人们的颜色感觉容易引起联觉,因此,颜色容易对人的心理产生这样或那样的影响。如冷暖、远近、轻重等。色彩不但影响人的视觉神经,还进而影响心脏、内分泌机能、中枢神经系统的活动。所以在交互媒体界面的设计时应该注意在不同的内容运用不同的色彩。

一个界面应该有一个主色调,而且要有一个整体的布局风格,这样可以保持使用者的情绪稳定。

过多地使用色彩,将会影响使用者注意力的集中、观看的情绪,也容易让使用者产生疲劳感。在界面色彩的设计中还要注意的是背景的颜色与文字的颜色不要使用接近的颜色,这样不利于使用者对文字的辨别度,而产生视觉疲劳,降低效率。

颜色之间的对比和人眼的辨色能力会有一定关系,当人们从距离较远的地方分辨多种色彩时,这时易于分辨的色彩顺序是红、绿、黄、白。如果将两种色彩相搭配,易于分辨的几种组合分别是:黄底黑字、黑底白字、蓝底白字、白底黑字等。

饱和度:

饱和度通俗的说就是色彩浓度。越是鲜艳(饱和度高)的颜色,便可在越短时间内吸引到人,同时也越容易引起人的视觉疲劳(越看越累)。而不怎么鲜艳(中低饱和度)的颜色,则显得更加“耐看”。

3. 阅读时长与文字显示时间

我们默读中文的一般速度为400-500字每分钟,也就是大概每秒6.67-8.33字,再算上提示的反应时间。我们可以对一些页面的提示弹窗指定如下的规则:

1-6字:显示停留1s

7-12字:显示停留2s

13-20字:显示停留3s

由于考虑到有阅读速度比较快的用户,在字数较多时提供关闭按钮也是可以的。

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 205,236评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 87,867评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,715评论 0 340
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,899评论 1 278
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,895评论 5 368
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,733评论 1 283
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,085评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,722评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,025评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,696评论 2 323
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,816评论 1 333
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,447评论 4 322
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,057评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,009评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,254评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,204评论 2 352
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,561评论 2 343

推荐阅读更多精彩内容