常见的交互设计方法

article/2025/11/4 22:06:12

尽管交互设计跨越了无数类型的Web和移动应用程序和网站,有一些固定的方法是所有设计师都可以依赖的。我们将探讨一些比较常见的方法:目标驱动设计,可用性,五个维度理论,认知心理学和人机界面指南。

1. 目标驱动的设计

目标驱动的设计是由艾伦·库珀在他的著作《囚犯正在逃出庇护:为什么高科技产品让我们疯狂,如何恢复理智》(出版于1999年)中推广的。艾伦定义了目标驱动的设计是指把解决问题作为最高优先级的设计过程。换句话说,目标驱动设计首先关注满足终端用户的具体需求和欲望,而不同于旧的设计方法只是专注于技术侧上的能力。

今天来看,艾伦提出的一些观点是显而易见的,因为设计师很少会选择设计完全受制于技术发展约束的交互。然而,其核心的方法是满足最终用户的需要并想要的,也就是说就这一点对现在和曾经都是一样必要的。

根据艾伦所说的,目标驱动的设计过程,需要作为交互设计师的我们进行五个思维方式的转变。

1)先设计,再编程。换句话说,目标驱动的设计首先要考虑用户如何与产品交互,而不是以技术因素开始。

2)独立开设计和编程的负责。这其中的必要性是,这样可以使交互设计师可以尽量拥护用户,而不去担心技术限制。一个设计师应该信任他或她的开发人员来处理技术方面的问题,事实上艾伦建议如此,否则会把设计师放在利益冲突的位置。

3)设计师要对产品质量和用户满意度负责。虽然利益相关者或客户会有各自的目标,交互设计师出也对任何在屏幕的另一边的人有责任。

4)为你的产品定义某个特定的用户。这个想法已经发展成为现在用户研究最通常的东西:角色模型。然而艾伦依旧不断提醒我们要把角色模型关联回产品,不断问自己:这个用户会在哪里使用这个产品?他或她是谁?他或她想要完成什么目标?

5)结对工作。最后一点是,交互设计师不应该独自完成工作,而应该与他人协作,艾伦称其为关键的“设计沟通者”。虽然作为设计沟通者的艾伦,在1999年时的设想不过是一个典型的旨在提供营销产品副本的广告文字撰稿人,但到今天已经设计沟通者扩展到了包括项目经理、内容策略师、信息架构师等在内的许多其他人。

2. 可用

可用性感觉起来可能是一个模糊的概念,但其核心只是设计师的一个简单问题——“是不是谁都可以轻松使用这个产品呢?“。这个概念在无数的书籍和网络文章上解释过,我们将回顾一些不同的定义来发现一些共同的主题和细微的差别:

在艾伦迪克斯,珍妮特芬利,拉塞尔比尔,格里高利阿柏德几个全著的书《人机交互》中,可用性被划分成三个原则:

  1. 易学性:新用户学会在系统中导航的容易程度如何?
  2. 灵活性:有多少种方法可以实现用户和系统的交互?
  3. 鲁棒性:我们对用户面对他们的操作错误时的支持做得怎么样?

与此同时,由尼尔森和施耐德曼所解释的可用性是由五项原则构成的:

  1. 易学性:新用户学会在系统中导航的容易程度如何?
  2. 有效性:用户执行任务的速度如何?
  3. 记忆性:如果一个用户一段时间没有访问系统,他们对界面的记忆程度如何?
  4. 错误度:用户一共犯了多少错误,从错误中恢复的速度如何?
  5. 满意度:用户是否喜欢他们所使用的界面,以及他们是否对结果满意?

最后,国际标准(ISO 9241)也把可用性这个词也分解成五项原则:

  1. 易学性:新用户学会在系统中导航的容易程度如何?
  2. 可理解性:用户对他们所看到的界面的理解程度如何?
  3. 可操作性:用户对界面的控制程度如何?
  4. 吸引度:界面在视觉上的吸引程度如何?
  5. 易用性的依从性:界面是否遵循了标准?

显然,在这些解释中,我们能看出构成可用的界面是有一些共同的主题的,无论一个设计师依据的是哪条原则,在设计任何界面的时候可用性都是一个重要的考虑方面。

3. 五维度理论

在比尔莫格里奇的访谈书籍《设计交互》中,吉莉安史密斯,一位交互设计学者,介绍了关于“交互设计语言“的四维空间的概念,。换句话说,这些维度能够构成交互本身,因此它们最后形成了用户和屏幕之间的沟通。原来的四个维度是这样的:话语,视觉表征,物体或空间,以及时间。最近,凯文西尔韦,一位IDEXX实验室的资深交互设计师,增加了第五个维度,行为。

  1. 一维:话语应该尽量易于用户理解,用这样一种方式表达使信息能够轻松传达给最终用户。
  2. 二维:视觉表征一般都是图形或图像,基本上就是指一切非文本的东西。他们应该适量地被使用,而不是压倒。
  3. 三维:物理对象或空间指的是物理硬件,无论是鼠标和键盘,或者任何用户能与之交互的移动设备。
  4. 四维:时间是指用户与前三个维度交互所花费的时间长度。它也包括用户可能的用来衡量进展的方式,包括声音和动画。
  5. 五维:凯文西尔韦在他的文章《交互设计中的设计》中增加了行为这个维度。这是指用户与系统交互时产生的情绪和反应。

通过使用这五个维度,交互设计师可以非常专注于用户与系统通信和连接时的体验。

4. 认知心理学

认知心理学是关于大脑如何工作,以其发生的心理过程的研究。根据美国心理协会的定义,这些过程包括了“注意力、语言的使用、记忆、感知、解决问题,创造力和思考”。

虽然心理学是一个非常广泛的领域,认知心理学尤为重视其中的某些关键的元素,实际上,这可能帮助了交互设计领域的形成。唐诺曼在他的书《日常生活的设计》中提到了其中的很多概念。以下只是那些概念中的一部分:

1)心理模型是指的在用户心中的一幅景像,使他们产生了对特定的交互或系统的期望。通过学习用户的心智模型,交互设计师可以创建出使用户有直观感觉的系统。

2)界面隐喻是指利用已知的行为来引导用户产生新的行动。例如,大多数计算机上的垃圾桶图标都类似于现实中的垃圾桶,这是为了提醒用户做出预期的行动。

3)功能可见性是指界面元素不仅是为了达到功能而设计出来的,而且也是为了让它们看起来像是可以达成功能而设计出来的。例如,按钮看起来像一个可以按的物体,这就是一个功能可见性的设计,使得不熟悉按钮的人仍能理解如何与之交互。

5. 人机界面指南

这部分内容其实有点不恰当,实际上是没有一整套完整的人机界面指南的。然而,创建人机界面指南背后的理念本身就是一种方法论。准则是由主要的技术设计企业,包括苹果和安卓、Java和微软等构建的。他们的目标都是一样的:用这些建议和推荐来提醒未来的设计师和开发者,这将帮助他们创建普遍意义上直观的界面和程序。

日常任务和可交付成果

在整个开发过程中交互设计师是一名关键的球员。他或她从事的一系列的活动都是项目团队的关键。这些活动通常包括形成设计策略、将关键交互做成线框图,以及将所有交互建立为产品原型。

1. 设计策略

虽然这个将会物的界限比较模糊,但有一点是肯定的:一个交互设计师需要知道自己在为谁设计,以及用户的目标是什么。通常情况下,这些信息会用户研究员提供。然后,交互设计师在独立或者受到团队中其他设计师的帮助的情况下,将会评估目标并形成设计策略。好的设计策略将帮助团队成员对在哪些需要的地方应该发生什么样的交互有一个共同的理解,以方便用户目标。

2. 关键交互的线框图

8jh20160219

交互设计师在用于激励其设计的设计策略上有了好主意之后,就可以开始画草图,画出那些可以促进必要交互的界面。交互的妙门藏在细节中:在这个过程中,有一些专家会直接在纸板上素描,而有些则使用在线应用程序来帮助他们,而有的则会使用两者的组合。有一些专家会协同工作来创建这些界面,而有的则独自创建。这一切都取决于交互设计师自己的特定工作流。

3. 原型

根据项目的需要,交互设计师的下一个合乎逻辑的步骤可能涉及到创建原型。团队制作交互原型有许多不同的方法,比如html/css原型,或纸上原型,在这里,我们不会覆盖广泛的细节。

4. 保持流行性

对一个现实中的交互设计师来说,最难的部分是适应工业发展变化的速度。每一天,新的设计师都可能要在不同的方向上看待媒介。结果便是,用户也会预期这些新类型的交互会出现在你的网站上。谨慎的交互设计师会响应这种演变,不断探索在线交互以及利用新技术,但是我们总是要记住正确的交互或技术是最好地满足角色用户的需要的那些,而不只是最新颖或最令人兴奋的那些。交互设计师还通过在推特上跟随交互设计的思想领袖(比如下列的著名设计师)并主动推动媒介本身的发展,以保持流行性。

转载于:https://www.cnblogs.com/DXYHW/p/10576435.html


http://chatgpt.dhexx.cn/article/p0TDiqkl.shtml

相关文章

软件工程与计算-11-人机交互设计

11-人机交互设计 不良的界面会导致用户感到不适 1. 用户和不好的设计 系统用户通常通过系统界面而非功能来判断系统:用户界面的设计应与预期用户的技能,经验和期望相匹配。界面设计不当会导致用户发生灾难性错误:不好的UI的设计往往是很多…

基于HTML+CSS实现的可交互照片墙Web页面

资源下载地址:https://download.csdn.net/download/sheziqiong/85723524 资源下载地址:https://download.csdn.net/download/sheziqiong/85723524 一、 实验目的 本次实验目为练习 HTMLCSS 的布局与样式,以及简单的交互 二、实验内容 制作…

web课程设计

作者:yyl 班级:量子通信 一、Laravel简述 Laravel是一套简洁、优雅的PHP Web开发框架(PHP Web Framework)。它可以让你从面条一样杂乱的代码中解脱出来;它可以帮你构建一个完美的网络APP,而且每行代码都可以简洁、富于表达力。 二、Laravel的安装 L…

网易交互设计师微专业 C1 揭开交互神秘面纱

如果有需要视频资源的可以关注"AI产品经理人",回复关键字“网易交互设计微专业”获取下载链接~ Chapter1 揭开交互神秘面纱 第一章 揭开交互神秘面纱 产品设计开发流程和团队构成 产品设计开发六大步 交互设计师和产品经理的区别 交互设计影响用户体验…

网易交互设计师微专业C4 让页面更优雅

如果有需要视频资源的可以关注"AI产品经理人",回复关键字“网易交互设计微专业”获取下载链接~ Chapter4 让页面更优雅 第一章 你需要懂的视觉心理学 1. 为什么要懂视觉心理学? 原因1. 运用用户观察和思考的规律来设计界面;原因…

web实现全景图的交互展示

Web实现全景图的交互展示 不需要学习其他知识,小白也能实现全景图AR展示一、webVR全景图多种方案实现(aframe,Krpano,three,jquery-vrview等等)二、用krpano之前的一些知识准备三、krpano的购买、下载、注册四、做一个…

WEB UI设计规范

Web应用界面设计规范(Design Specification for Web UI) 主讲人:ARay 目录: 一、软件界面规范的重要性及其目的 二、用户体验为何如此重要 三、Web规范体系介绍 四、界面设计开发流程 五、应该遵循的基本原则 六、界面设计规范 …

Web 与 App 数据交互原理和实现

作者 | 张小虎 杏仁前端开发工程师,前 iOS 开发工程师,关注前端技术栈。 背景 点击图片查看大图已经成了用户浏览页面时的一种习惯,原生 App 往往都实现了这些图片处理功能(点击查看、缩放、保存、滑动浏览等)。对于 W…

人机交互-8-交互式系统设计

1. 设计框架 过早地把重点放在小细节、小部件和精细的交互上会妨碍产品的设计 先站在一个高层次上关注用户界面和相关行为的整体结构房屋设计举例 设计框架 定义高层次上的屏幕布局定义产品的工作流、行为和组织 1.1. 定义外形因素和输入方法 外形因素 设计什么样的产品&am…

人机交互-2-交互设计的原则与方法

交互设计的原则与方法 交互设计中的问题 尽量减少用户需要记忆的部分缺乏反馈 1. 目标Goal vs. 意图Intention 单个目标可对应多个意图 举例:删除文档中的部分内容的目标意图1:通过编辑菜单删除意图2:通过删除按钮删除每个意图可包含一系列活动 2. EEC模型 从用户视角探…

网页交互性设计

对于任何一个Web应用,与用户互动是最基本的要求。为Web应用增加交互性,最常用的方法,莫过于使用 Javascript 或 jQuery、AJAX 了。 本节不打算详细介绍这几种技术,只是简要介绍在网页版 word 中,如何使用这些技术来实…

web与服务器之间的信息交互,web客户端与服务器端如何进行交互

web客户端与服务器端如何进行交互 内容精选 换一换 开启了 Kerberos认证的安全模式集群,进行应用开发时需要进行安全认证。Kerberos这一名词来源于希腊神话“三个头的狗——地狱之门守护者”,后来沿用作为安全认证的概念,使用Kerberos的系统在设计上采用“客户端/服务器”结…

网易交互设计师微专业C5 交互设计测试与评估

如果有需要视频资源的可以关注"AI产品经理人",回复关键字“网易交互设计微专业”获取下载链接~ Chapter5 交互设计测试与评估 第一章 为什么要开展测试与评估 用户测试:请目标用户使用产品来完成任务,观察并记录用户使用产品的…

网易交互设计师微专业C3 规范信息架构与流程设计

如果有需要视频资源的可以关注"AI产品经理人",回复关键字“网易交互设计微专业”获取下载链接~ Chapter3 规范信息架构与流程设计 第一章 信息架构设计 (一)认知产品信息架构 定义: 信息架构设计是对信息进行结构…

【人机交互技术】Web界面设计

一、实验目的和要求 1)熟悉 Web 站点的信息交互模型和结构 2)熟悉 Web 界面设计的基本思想和原则 3)掌握 Web 界面设计的工具和技术 二、实验内容与步骤 1)实验内容: 要求根据 Web 界面设计的原则(简洁、一致性、对比度)&#…

尼尔森十大交互设计原则

前言 Jakob Nielsen(雅各布尼尔森)的十大交互设计原则。它们被称为“启发式”,因为它们是广泛的经验法则,而不是特定的可用性指导原则。因此,我们不能把它上升为一种标准,而是应该当做一种经验来学习&#…

人机交互-任务4:图形交互界面的设计(web)

文章目录 一、 题目二、 实验内容三、 方案设计四、 实验步骤与过程五、 实验结果与分析完整项目成品下载 一、 题目 目的 (1) 使用掌握的计算机语言完成图形界面的设计,熟悉图形用户界面设计的原则并运用到设计中。 (2) 通过用户友好界面的设计,使学生…

web交互设计模型

《信息架构中的常见模型》是整个“web交互设计方法”中的一部分: 本期的内容目的是分享和总结信息架构中一部分基本的交互模型。信息架构需要考虑内容和功能的建构,首先需要考虑怎样组织内容和功能的关系,也就是切 分内容,如何把一些动作和对…

交互设计文档示例_Web交互的重要性:提示和示例

网站创建涉及许多要素。 网站是与来自世界各地的用户进行交流的最佳媒介。 因此,至关重要的是,其设计方式应吸引用户并吸引其参与。 这是网站可以有效地覆盖其用户的时间。 设计师经常想知道使网站吸引人的秘密成分 。 设计和功能的结合是每个设计师都希…