一直以来,经常有学生来问我,“是该选产品设计好还是交互设计好?”或者“过去是做产品设计的可不可以转交互设计?”“是不是视觉设计转交互或者界面设计方便点?”等等诸如此类的问题。笔者注:“产品”既可以是物质化的(硬件等实体产物),也可以是非物质化的(软件、服务等虚拟产物),学生的问题里所指的,以及之后全文中所提及的“产品”二字,都是指狭义层面上的工业设计范畴的实体形式,也即硬件产品。先不说别的,这里面有些问题本身问的就有问题,暴露了现在很多学生、甚至很多从业者对交互设计的理解偏差和混乱,要解答这些问题,我自己觉得,我们有必要先来搞搞清楚几个现在经常听到的名词,以及它们之间到底是什么关系:UX、Interaction、HCI、UI。

(1)UX - User Experience,也可以写成UE,用户体验设计。
这个词最先由电子工程学、心理学、认知科学学者唐纳德·诺曼(Donald Norman)在1990年代提出。通过提升用户与产品或服务交互中的可用性(分为有用性和易用性)、可触达性、情感性等因素,最终使用户达到满意的设计过程,便是所谓的用户体验设计。其实当时时任苹果公司用户体验架构师(User Experience Architect )的诺曼,主要是针对人和计算机的交互层面,提出的“用户体验”,他认为光是用可用性设计或者用户界面设计来定义当时那些计算机系统或软件设计师做的事情还是太狭窄。但我们现在知道,随着其自身定义的不断发展,用户体验设计覆盖的也已经不止是人和计算机的交互层面,也可以是人和器物的交互(工业设计)、人和系统的交互(服务设计)等等。

其实,用户体验设计最早可以追溯到1940年代,只不过那时人们不叫这个词,它有另一个名字,叫人因工学设计(Human factors and ergonomics),与用户体验之于人机交互不同的是,后者更专注于物理环境下,人的因素(生理、心理等因素)和实体产品设计(物理因素)之间的关系。所以实际上,不论是过去传统的产品设计,计算机时代的软件设计,还是当下体验经济时代的服务设计,广义上讲,都是在设计用户的体验,只是承载功能、传递价值、产生体验的媒介不同罢了,媒介也就是设计产物——设计者缔造解决方案的载体,可以是硬件产品、软件系统、也可以是服务体系。所以本质上用户体验设计可以泛指所有的以用户为对象的设计领域,也可以具体指某个细分设计专业。当下,企业设置很多职位、很多设计师自称为UX Designer,其实是特指某个或几个细分设计专业,其中以软件设计(常见的网页、客户端产品、系统设计等等)和服务设计为主,所以同样,如果一个产品设计师说他是UX Designer,没有任何问题。假设我们把所谓的“体验”定义为用户使用产品或服务过程的前、中、后整个周期的综合情感,那么艾斯林格的“Form follows Emotion”就是产品设计也属于UX的最好证明。

(2)Interaction,交互设计。
我们可以把Interaction这个词拆开来理解,由Inter和Action组合而成,在一个交互关系中,一定有一对或多对主客体存在,他们相互(Inter)作用(Aciton),主体输入、客体输出(I/O - Input/Output)的行为过程就是交互(Interaction)。那么交互设计,其实就是在设计交互(Design Interaction),设计“人之于其他一切客体的行为”。要设计人的行为,首先就是要了解人是怎么产生行为的。仔细研究,你会发现,不管对于何种客体,人的行为大致一样,都经历了一段从感性认识、到实践、再到理性认识的过程:感知(Perception)、预测(Anticipation)、行动(Action)、反馈(Feedback)、认知(Cognition)。举个例子,当某人看到墙上有个折弯、凸出的横向圆柱形器物(感知),觉得应该可以握着它并且可以旋转(预测),于是他这么做了(行动),这个圆柱形器物果然旋转了并且伴随着“咔哒”一声,同时随着此人继续拉动圆柱形器物,这面墙被打开了(反馈)。哦,于是这个人明白了,这面墙是个门,而这个折弯、凸出的横向圆柱形器物是可以控制这个门的开关的装置,于是他以后都知道,这个叫做门的把手(认知)。

在这个过程中,我们发现,用户得到的反馈符合了他最初的预测,顺利完成了目的,产生的这种愉悦、顺心的情感其实就是体验,所以我们讲,用户体验来自于用户与客体的交互过程和它带来的结果,用户体验设计包含交互设计,如果说体验是设计者最终的目的,那么交互设计就是实现体验的渠道和来源。同时,我们还可以发现,在这个过程中,其实只有门把手才是设计者直接缔造的产物,你可能会说这是属于产品设计师的范畴,但它的的确确演绎出了一整个人的行为过程,并且靠这个产物实现了人的目的或需求,这好像又是交互设计师的范畴。写到这里,你可能会发现,原来往往人们判别设计范畴的方法是直接看这个设计师产出的是什么,是门把手,就是产品设计师,是光标,就是软件设计师。但其本质上他们都是交互设计师,都遵循着交互设计中最核心的行为逻辑在做设计:用户在某种特定场景下通过媒介的使用行为来完成某个目的,其中包含了在设计交互中必不可少的五个要素:用户(who)、场景(when&where)、媒介(what)、行为(how)、目的(why)。

所以最后在交互设计范畴下,继续细分专业方向的标准就是,媒介 —— 人行为作用的客体,设计师缔造的直接对象。人和器物之间的交互,产品设计;人和信息之间的交互,视觉传达或数字媒体;人和计算机之间的交互,狭义交互设计,等等。所以今天为什么提到交互设计或者UX设计,人们下意识地会将它们和软件设计、网页设计、App手机应用设计划等号,就是因为(移动)互联网时代或者数字经济时代的主要产品形态是虚拟的(软件系统或服务体系),交互的媒介则是以诸如电脑、手机触屏等为载体的图形界面GUI(Graphic User Interface)。对于那些询问说“产品设计能不能转交互设计”的同学而言,根本就不存在“转”,产品设计本身就是交互设计,解决人怎么更方便使用产品的问题,何尝不是在设计人的行为?所以其实这里同学脑子里想的交互设计并不是广义交互,而正是指以软件、网页、App手机应用等为产物的狭义交互,但它们所代表的GUI却只是HCI中,用户界面的一个阶段性范畴,是暂时的,甚至以后会被替代的,我们接着看下去。

(3)HCI,Human Computer Interaction,人与计算机交互,也就是我们经常讲的人机交互。根据前文我们可以知道,计算机不过是一种新媒介、新客体,所以人和计算机之间的交互,依然属于交互设计范畴下的一个领域。提到HCI,就不得不提另一个词,HMI(Human Machine Interaction),人与机器交互。HMI可以指人与搭载计算机的机器之间的交互,比如智能洗衣机,数码相机等,也可以指人与不搭载计算机、计算处理靠机械运作的传统机器之间的交互,比如自行车、汽车(当然现在汽车早就搭载计算机),所以如果我们把计算机也比做机器的一种类型的话,那么HCI是被包含在HMI范畴中的,它们同时属于交互设计范畴。笔者注:这里可以普及一个小知识点,处理机器和机器(MMI - Machine Machine Interaction)之间关系的,是工程师,处理人和机器之间关系的,是设计师。回过头再来看HCI,计算机这一全新客体的出现,改变了人以往与物的交互行为方式。前面我们提到的那个门把手的例子,当人给予这个门把手一些操作,也就是输入动作后,把手的旋转、门铰链的转动导致门的开启等等过程,都是可以被感知的,也就是物的计算过程是可见的、瞬时的,人可以马上感知和判断自己的输入或操作,有没有对客体产生影响和作用。但是对于计算机而言,这个计算过程是人看不见的,我们称之为“黑箱化”的,那么人通过一些输入设备对计算机发出操作,怎么才能让人感知到计算机有反应、有在计算,这就需要非物理界面进行信息的表达和传递,下面我们来看看HCI中都有哪些用户界面形式。

(4)UI,User Interface,用户界面。
它是不同交互媒介用来表达功能和反馈用户行为结果的重要载体。还是拿门把手的例子来解释,如果门把手是用户要完成开门目的的媒介的话,那么它的造型、材质等塑造出的整体外观就是这个媒介的用户界面,属于物理界面。首先它的外观让人对其有一个初步的视觉感知,其次折弯、凸出的横向圆柱形特征传递出可以握持、旋转的功能含义,最后它本身的旋转、给手的触感直接给予人操作行为的反馈。

1. 形式(外观)对应感知层;
2. 功能可见性(产品语义)对应预测层;
3. 反馈/输出对应行动/输入

那么同样道理,对于今天高度普及的智能手机而言,那块触屏下的图形界面就是用户界面,属于虚拟界面,手机系统或软件应用的所有功能,以及人点触、滑动完的所有反馈,便都是通过这个二维的、图形语言的用户界面来表达,比如iOS系统中开关控件的设计,它的图形语义就暗示着人可以像现实生活一样,通过拨动那个按钮,来实现开关的功能。由于图形要素在以屏幕、触屏为主要交互媒介中扮演了主要角色,这就不难解释为什么很多视觉设计师可以较低成本地转型为UI设计师,但我们始终要明晰,这里的UI指的仅仅是GUI,图形用户界面。因为对于整个HCI范畴而言,GUI只是其中一种且较早的用户界面形式。计算机最早与人沟通的界面是CLI(Command Line Interface),也就是指令式用户界面,人输入计算机语言(早期的二进制语言),计算机反馈的也是计算机语言,今天的程序员依旧使用的是这种交互方式,它对人的专业性要求高,交互的信息也极为抽象;而后随着施乐公司(Xerox)的一群电脑工程师发明了图形界面GUI,人不用再学习复杂的计算机语言,即使是儿童都可以通过鼠标来操作屏幕里的一切图形元素,所看即所得;后来,抛开鼠标、键盘等外接输入设备,人能直接用手指、手势甚至其他人体组织等作为输入设备,和计算机进行交互,这就属于NUI Natural User Interface,自然用户界面;当然人机交互界面还会发展到诸如TUI、OUI、甚至BCI等阶段,这里就不逐一展开赘述。

现在,我们可以试着回答UX、Interaction、HCI、UI之间的关系:UX > Interaction(> HMI > HCI)> UI > GUI,用户体验源于交互,并包含交互,而一切人与客体之间的相互作用都属于交互,其中按客体类型可以分为HMI、HCI等,而HCI属于HMI范畴;用户界面则是交互媒介用来表达功能和反馈用户行为结果的载体,在HCI范畴里,随技术、媒介形式的变化,分阶段性发展出不同的用户界面形式,图形界面GUI只是其中的一种。所以我们现在很清楚了,当下很多UX/UI Designer本质上其实就是人与计算机交互(HCI)范畴下、图形界面(GUI)范畴的狭义交互或界面设计师。一块3.5英寸的屏幕,催生了当今数以万计的,所谓的UX、交互、UI设计师,更有新来者趋之若鹜,是趋利还是趋势,不得而知,但有一点可以肯定,技术的发展、媒介的变化,一定会产生新的交互方式,新的用户界面形式,也一定会淘汰掉我们今天中的很大一部分人。

*推荐和参考
1.比尔·莫格里奇 《关键设计报告:改变过去影响未来的交互设计法则》
2.唐纳德·A·诺曼 《设计心理学》
3.范圣玺 《行为与认知的设计》

本文来自UI头条 作者:le_keke
大连中钰睿泓与你分享精品文章

入行交互设计前要先明白的事相关推荐

  1. 新入行程序员考虑自己是否明白以下这8件事情

    [e良师益友网]关于下面这些事情,我常常想,要是我刚入这一行时就知道的话那该多好,能少走不少弯路,取得的成绩也肯定比现在高.唉,往事不可追,所以在这里我想分享给大家,尤其是刚进入这一行的新手,请仔细考 ...

  2. .NET入行之工作前

    时间就像轻风一样,刻意感受的时候几乎把你吹倒,不留意的时候又从你身边轻轻飘走了:长此以后,我怕自己会变得麻木,忘记了原来的样子.所以还是决定给自己留点什么,万一哪天忘记了,还可以再翻起来. 工作两年的 ...

  3. 入行pcb设计,到底该学哪款工具软件

    今天讨论一个很多初学者都关注的一个问题.也是很多小伙伴最近老问到的一个问题:目前PCB设计软件这么多,到底应该学哪个PCB设计软件?(仅供参考) 目前主流的就 三大PCB设计软件,目前不主流的就不提了 ...

  4. 产品设计体会(0011)我想做产品经理,如何入行

    这篇是写给0岁及以下的产品经理看的 高手阅读时请用批判的眼光帮我指出错误和不足,:) 全文三步走 确认自己真的想做产品 明确自己现在的位置 几个可行的切入点 ===================== ...

  5. 武汉UI设计薪资怎么样?入行容易吗?

    I设计作为刚兴起不久的高薪产业,发展非常迅速,从业人员的高薪资让他们成为众人羡慕的对象.都说UI设计师高薪职业,那么武汉UI设计薪资怎么样?想要转行进入UI设计行业容易吗?下面,我就给大家分析一下. ...

  6. Java后端入行看这 做软件园最靓的仔

    16k长文以失败学角度分享普通本科二线Java后端入行经历 前言 入行趣事 ■ 实习前 ■ 趣事分享1 -- 找实习 ■ 开启一周面试狂潮 1.皮包单休公司 2.养老级银行政务 3.培训机构 4.狼性 ...

  7. 转 我想做产品经理,如何入行

    全文三步走 确认自己真的想做产品 明确自己现在的位置 几个可行的切入点 =========================  正文开始的分割线  ========================= 经 ...

  8. 心得| 想入行 AI,别让那些技术培训坑了你...

    本文来自作者 李烨 在 GitChat 上分享,本处作了不改变原意的删减! 引子 IT 行业发展迅速,各种新名词此起彼伏.身处这样一个热点行业,学习是必须的.不打算成为终身学习者的程序员,失业就在明天 ...

  9. 想入行 AI,别让那些技术培训坑了你...

    引子 IT 行业发展迅速,各种新名词此起彼伏.身处这样一个热点行业,学习是必须的.不打算成为终身学习者的程序员,失业就在明天. 可是,怎么学呢? 都已经毕业了,每天要上班,不能像以前读书的时候,整天只 ...

最新文章

  1. 天线的近场区和远场区
  2. win10系统如何安装iis信息服务器,win10系统安装iis服务功能的具体方法【图文教程】...
  3. Kotlin学习笔记(2)- 空安全
  4. 合肥工业大学计算机学院王院长,王青山(合肥工业大学教授)_百度百科
  5. 006-Python迭代器
  6. 浏览器缓存机制(优化)
  7. python3和python2的优劣_python2和python3的区别
  8. python爬虫从小白到高手 Day1 爬取百度音乐歌单
  9. php 代码mysql 读写分离实例
  10. 御剑后台扫描工具下载
  11. java实现随机抽取题目_随机抽取样本问题蓄水池算法按权重抽取问题
  12. Android中OKHttp的基本用法(Get、Post、上传文件等)
  13. 水清冷冷:PS 2021 (Adobe Photoshop 2021) 安装教程和学习方法(附工具)
  14. 百度地图、高德地图的数据从哪里得到的?
  15. 201521123037 《Java程序设计》第7周学习总结
  16. 纵观30年5000多部国产电视剧,豆瓣评分最低的演员原来是……
  17. 常用通信协议——IIC协议编程实现
  18. 明源云采购颁奖盛典|欧金盾铝业荣膺“2020房企供应商10强”
  19. 对可口可乐瓶进行图像识别
  20. 矩阵转置相关公式_(机器学习示例)上证指数、深证指数相关性研究

热门文章

  1. 计算机网络2-网络协议
  2. 4月TIOBE编程排行榜:Python第三、继续上涨!2021薪资多少?
  3. 【Redis】高可用架构之Cluster集群和分⽚
  4. 为什么LSTM可以缓解梯度消失?
  5. 观看 陈广 老师视频做的图像管理器,代码打包,给需要的朋友。
  6. 非常有特色的QQ符号图形
  7. 写在新年开工前的一点感悟
  8. 监控摄像头镜头可视距离和角度
  9. c语言中undef,C/C++中常用的预处理方法 #define #undef #ifdef #endif
  10. 计算机茶包装设计论文,创意设计论文茶叶包装设计论文