2024年网站交互设计规范 篇1
交互设计,又称互动设计,(英文Interaction Design, 缩写 IxD 或者 IaD),是定义、设计人造系统的行为的设计领域。人造物,即人工制成物品,例如,软件、移动设备、人造环境、服务、可佩带装置以及系统的组织结构。
就读学生感想
NO.1 Carneg ie Mellon University
我的感觉CMU的交互非常看重documentation也就是你的设计文档,着重解释你的设计思路以及你设计的产品是如何优化用户体验的。
建议在做自己项目之外没事可以多写写博客分析一下先流行的app在交互上的成功与不足,一方面锻炼自己的思辨,也可以作为portfolio很好的一部分。同时可以去看一下设计学院学生的作品集,分析下他们风格或许有很大帮助。
NO.2 California College of the Arts
有Frog、Method Design、Adaptive Path的资深师资和IDEO的系主任、加上旧金山湾区的设计资源,恐怕大部分研究所都没有这么得天独厚的资源让设计师打下扎实基础、形成人脉网络与各种专业的冲击。
相较于从人机工程、软件开发、工业设计、视觉设计、媒体艺术、批判、创新设计衍生出来的交互设计学校,这应该是第一个“比较原生”的互动设计系所,或是说第一个针对互动设计打全面性基础的地方。
NO.3 Parsons School of Design
总体来说,帕森斯设计学院的作品集要求并不是你的“美术基础”,而是多样性以及创新性,是否CREATIVE!!! 是最重要的,所以不是你在外面找个美术老师,教你如何画画,上色就能考上,除非你想报考罗德岛的艺术专业,否则帕森斯的话,玩儿的是创意,美术基础从零到能考上,在正确的指点下,几个月还是需要的。
1.你现在可以没有基础,找帕森斯毕业生开设的辅导班来教授你,网络辅导是足够的;
2.一般零基础需要几个月的辅导时间来提高;
3.作品集是综合要求,所以很多样得会做。
这个学校只适合对设计或者艺术真正感兴趣的人因为真的很苦,熬夜,通宵是常有的事情。如果没有激情和动力是撑不下来的。校方曾在教育展上给出申请的建议是:要强烈的诉说自己为何选择Parsons念的理由,不管是什么样的原因,都要好好的表现出来。”
NO.4 Pratt Institute
“它是纽约历史最悠久的世界级院校,也是艺术家的造梦天堂。”
有些学生进了普瑞特但托福没有100分,原因如下:
第一呢,是因为你非常幸运,这学期没有足够的学生申请普瑞特,所以他们需要学生,所以他们接受了你,不然咧! 要是这学期有足够的学生申请普瑞特,他们就会先踢掉托福不够的…
第二个理由就是你的作品集真的太赞了,让他们觉得非收你不可,不管你的英文是好是坏(因为反正你都得先考入学的ESL考试,然后上普瑞特的ESL英文补救课程)。
教授不会真正教你东西的,他们使用非常美式的教学,让你拥有自己的思想与点子,但是当你的观念不是很好的时候,他们会告诉你,还有,他们总是告诉你要自己去念书,所以我大部分都是从书上学,而不是跟教授学的,不过我真的有些在设计上的好点子是从教授那边学到的。
国际学生依法是不能在学时打工的哦!不过如果你拿的是H1签证,或是学生实习课程时,你才有办法在大苹果市工作,对于主修CGIM-3d动画的学生来说,毕业后在大苹果市找工作真的不容易!去洛杉矶找工作还比较轻松,不过如果你专业是网页设计,我告诉你,根本不用找工作啦!工作会自动来找你!
NO.5 Savannah College of Arts and Design
1、Do you have anything to tell me? About yourself, like, education experience...
面试官刚上来就问我有没有可以跟她讲的,关于自己的事情。可以介绍一下自己的基本情况,就读的学校以及任何你觉得有趣有特点的事情。
2、你为什么选择SCAD?请给我两点理由。
这个问题要围绕着你对SCAD的research,结合自身情况来说。比如SCAD的某知名校友是你的偶像人物,或者SCAD某个专业在该领域有影响力啥的。
3、能不能说说关于XXXX(我提交的一个作品)的事情?是什么给了你启发让你想出这样的设计?
请各位同学牢记自己给自己作品起的英文名字,要迅速地反映出来面试官问的是哪一个Project,因为她的电脑是背对着你的,不会让你看到。至于启发,稍微说点有影响力有深度的设计师或者设计品就好。
4、你认为你所提交的作品中哪一个是最好的?
一定要说第一眼看上去就最好的作品,最好讲讲设计过程和反响,可以扯一些自身挑战或者社会问题。
5、你说过你有半年的国外交流经历,请问在这半年中你最大的挑战是什么?你是如何应对的?
最好说语言。应对的方式是,我的室友都是外国人,我跟她们as much as possible地进行对话,并参加了一些clubs,来提高我的语言。如果没有过国外交流经历的同学,我猜测她大概会问去外地读书的挑战,可以讲homesick或人际关系以及学习方式的不习惯等等,解决办法就自己编一些,反正最后是解决了。
6、你觉得你身上突出的优点是什么?请讲两个。
最好说学习能力强有洞察力。
7、最后给你一分钟,请你跟我讲讲与专业无关的,让SCAD给你录取的理由。
泛泛地说SCAD的优势和我想来读书的愿望,但面试官显然不太满意,她又强调了一遍任何来SCAD的人都是这样想,请讲讲apart from your major的理由。我就说我来自一个普通家庭,父母并不富裕,我从高中、本科到研究生一直都拿到很好的rank,为了给他们一个better life。我希望SCAD也能给我机会让我在US实现梦想,报答父母。
NO.6 New York University
喜欢NYU的图书馆,十楼的研究生刷卡才能进自习室,可以说话可以吃东西,有沙发有板凳,有阵子我们闺蜜聚会都改到那里去了。六楼的刷卡自习室桌子大、隐私好,一人一个台灯。各个走廊都有沙发凳,坐着看中廊爽爽的。
你慢慢会发现ITP内部有不少小流派,有人想要做digital artist,有人想要成为creative technologist, 有人想要做一个有商业前景的产品做自己的business,有人想要做DJ, 有人想要做儿童教育……不管哪一种人,ITP都会提供海量的机会。
你的责任就是在第一年里面,不停的尝试,然后在第二年的时候,定下自己的方向。想要做artist的人就会开始更多的接触artist, 会去拿作品pitch gallery exhibition; 想当creative technologist的人,就会去接触大公司的media lab directors, 会学各种各样的技术,学习如何应用ITP的东西到商业世界;想要开Business的人,就会拿着一个idea参加各种start-up competition, pitch fund......不管如何,首先给自己OPEN的mind,敢于去尝试,然后专一的走向自己最为之激动的那条路。
如果你对你从未接触过的领域产生了兴趣,那也不要怕,大胆的上,技术不会是问题,老师同学会帮你一起攻克,你只有在你有兴趣的领域里,才能被激发出最有灵气的创造力。
公众号
作品集分享Portfolio
2024年网站交互设计规范 篇2
交互设计起源于网站设计和图形设计,但现在已经成长为一个独立的领域。现在的交互设计师远非仅仅负责文字和图片,而是负责创建在屏幕上的所有元素,所有用户可能会触摸,点按或者输入的东西:简而言之,产品体验中的所有交互。
这篇文章对有兴趣学习更多关于交互设计的知识的人来说是一个很好的起点。我们将会简要讨论交互设计的历史,相关的指导原则,值得关注的贡献者,以及有关这个迷人学科的工具。
一、什么是交互设计?
交互设计(IxD)定义了交互系统的结构和行为。交互设计师努力在用户和用户使用的产品或者服务间创建有意义的关联,不管是从电脑到移动设备,家用电器或者其他。我们的实践会与世界一同不断发展。”——交互设计协会(IxDA)
从第一台用来容纳静态副本以外的信息的屏幕被设计出来的那天开始,交互设计就开始了。从按钮,链接到表单的一切都是交互设计的一部分。在过去的几十年里,有许多相关的书已经出版了,这些书解释了交互设计的方方面面,并探索了交互设计与体验设计间交叉和重叠的多种方式.
交互设计的发展帮助和促进了人和他们所在的环境之间的相互作用。不像用户体验设计那样占据所有面向用户的系统,交互设计师只关心用户和屏幕之间的特定相互作用。当然,在实际中从来不会如此清楚地划分开来。
二、常见的交互设计方法
尽管交互设计跨越了无数类型的Web和移动应用程序和网站,有一些固定的方法是所有设计师都可以依赖的。我们将探讨一些比较常见的方法:目标驱动设计,可用性,五个维度理论,认知心理学和人机界面指南。
1. 目标驱动的设计
目标驱动的设计是由艾伦·库珀在他的著作《囚犯正在逃出庇护:为什么高科技产品让我们疯狂,如何恢复理智》(出版于1999年)中推广的。艾伦定义了目标驱动的设计是指把解决问题作为最高优先级的设计过程。换句话说,目标驱动设计首先关注满足终端用户的具体需求和欲望,而不同于旧的设计方法只是专注于技术侧上的能力。
今天来看,艾伦提出的一些观点是显而易见的,因为设计师很少会选择设计完全受制于技术发展约束的交互。然而,其核心的方法是满足最终用户的需要并想要的,也就是说就这一点对现在和曾经都是一样必要的。
根据艾伦所说的,目标驱动的设计过程,需要作为交互设计师的我们进行五个思维方式的转变。
1)先设计,再编程。换句话说,目标驱动的设计首先要考虑用户如何与产品交互,而不是以技术因素开始。
2)独立开设计和编程的负责。这其中的必要性是,这样可以使交互设计师可以尽量拥护用户,而不去担心技术限制。一个设计师应该信任他或她的开发人员来处理技术方面的问题,事实上艾伦建议如此,否则会把设计师放在利益冲突的位置。
3)设计师要对产品质量和用户满意度负责。虽然利益相关者或客户会有各自的目标,交互设计师出也对任何在屏幕的另一边的人有责任。
4)为你的产品定义某个特定的用户。这个想法已经发展成为现在用户研究最通常的东西:角色模型。然而艾伦依旧不断提醒我们要把角色模型关联回产品,不断问自己:这个用户会在哪里使用这个产品?他或她是谁?他或她想要完成什么目标?
5)结对工作。最后一点是,交互设计师不应该独自完成工作,而应该与他人协作,艾伦称其为关键的“设计沟通者”。虽然作为设计沟通者的艾伦,在1999年时的设想不过是一个典型的旨在提供营销产品副本的广告文字撰稿人,但到今天已经设计沟通者扩展到了包括项目经理、内容策略师、信息架构师等在内的许多其他人。
2. 可用性
可用性感觉起来可能是一个模糊的概念,但其核心只是设计师的一个简单问题——“是不是谁都可以轻松使用这个产品呢?“。这个概念在无数的书籍和网络文章上解释过,我们将回顾一些不同的定义来发现一些共同的主题和细微的差别:
在艾伦迪克斯,珍妮特芬利,拉塞尔比尔,格里高利阿柏德几个全著的书《人机交互》中,可用性被划分成三个原则:易学性:新用户学会在系统中导航的容易程度如何?灵活性:有多少种方法可以实现用户和系统的交互?鲁棒性:我们对用户面对他们的操作错误时的支持做得怎么样?
与此同时,由尼尔森和施耐德曼所解释的可用性是由五项原则构成的:易学性:新用户学会在系统中导航的容易程度如何?有效性:用户执行任务的速度如何?记忆性:如果一个用户一段时间没有访问系统,他们对界面的记忆程度如何?错误度:用户一共犯了多少错误,从错误中恢复的速度如何?满意度:用户是否喜欢他们所使用的界面,以及他们是否对结果满意?
最后,国际标准(ISO 9241)也把可用性这个词也分解成五项原则:易学性:新用户学会在系统中导航的容易程度如何?可理解性:用户对他们所看到的界面的理解程度如何?可操作性:用户对界面的控制程度如何?吸引度:界面在视觉上的吸引程度如何?易用性的依从性:界面是否遵循了标准?
显然,在这些解释中,我们能看出构成可用的界面是有一些共同的主题的,无论一个设计师依据的是哪条原则,在设计任何界面的时候可用性都是一个重要的考虑方面。
3. 五维度理论
在比尔莫格里奇的访谈书籍《设计交互》中,吉莉安史密斯,一位交互设计学者,介绍了关于“交互设计语言“的四维空间的概念,。换句话说,这些维度能够构成交互本身,因此它们最后形成了用户和屏幕之间的沟通。原来的四个维度是这样的:话语,视觉表征,物体或空间,以及时间。最近,凯文西尔韦,一位IDEXX实验室的资深交互设计师,增加了第五个维度,行为。一维:话语应该尽量易于用户理解,用这样一种方式表达使信息能够轻松传达给最终用户。二维:视觉表征一般都是图形或图像,基本上就是指一切非文本的东西。他们应该适量地被使用,而不是压倒。三维:物理对象或空间指的是物理硬件,无论是鼠标和键盘,或者任何用户能与之交互的移动设备。四维:时间是指用户与前三个维度交互所花费的时间长度。它也包括用户可能的用来衡量进展的方式,包括声音和动画。五维:凯文西尔韦在他的文章《交互设计中的设计》中增加了行为这个维度。这是指用户与系统交互时产生的情绪和反应。
通过使用这五个维度,交互设计师可以非常专注于用户与系统通信和连接时的体验。
4. 认知心理学
认知心理学是关于大脑如何工作,以其发生的心理过程的研究。根据美国心理协会的定义,这些过程包括了“注意力、语言的使用、记忆、感知、解决问题,创造力和思考”。
虽然心理学是一个非常广泛的领域,认知心理学尤为重视其中的某些关键的元素,实际上,这可能帮助了交互设计领域的形成。唐诺曼在他的书《日常生活的设计》中提到了其中的很多概念。以下只是那些概念中的一部分:
1)心理模型是指的在用户心中的一幅景像,使他们产生了对特定的交互或系统的期望。通过学习用户的心智模型,交互设计师可以创建出使用户有直观感觉的系统。
2)界面隐喻是指利用已知的行为来引导用户产生新的行动。例如,大多数计算机上的垃圾桶图标都类似于现实中的垃圾桶,这是为了提醒用户做出预期的行动。
3)功能可见性是指界面元素不仅是为了达到功能而设计出来的,而且也是为了让它们看起来像是可以达成功能而设计出来的。例如,按钮看起来像一个可以按的物体,这就是一个功能可见性的设计,使得不熟悉按钮的人仍能理解如何与之交互。
5. 人机界面指南
这部分内容其实有点不恰当,实际上是没有一整套完整的人机界面指南的。然而,创建人机界面指南背后的理念本身就是一种方法论。准则是由主要的技术设计企业,包括苹果和安卓、Java和微软等构建的。他们的目标都是一样的:用这些建议和推荐来提醒未来的设计师和开发者,这将帮助他们创建普遍意义上直观的界面和程序。
三、日常任务和可交付成果
在整个开发过程中交互设计师是一名关键的球员。他或她从事的一系列的活动都是项目团队的关键。这些活动通常包括形成设计策略、将关键交互做成线框图,以及将所有交互建立为产品原型。
1. 设计策略
虽然这个将会物的界限比较模糊,但有一点是肯定的:一个交互设计师需要知道自己在为谁设计,以及用户的目标是什么。通常情况下,这些信息会用户研究员提供。然后,交互设计师在独立或者受到团队中其他设计师的帮助的情况下,将会评估目标并形成设计策略。好的设计策略将帮助团队成员对在哪些需要的地方应该发生什么样的交互有一个共同的理解,以方便用户目标。
2. 关键交互的线框图
交互设计师在用于激励其设计的设计策略上有了好主意之后,就可以开始画草图,画出那些可以促进必要交互的界面。交互的妙门藏在细节中:在这个过程中,有一些专家会直接在纸板上素描,而有些则使用在线应用程序来帮助他们,而有的则会使用两者的组合。有一些专家会协同工作来创建这些界面,而有的则独自创建。这一切都取决于交互设计师自己的特定工作流。
3. 原型
根据项目的需要,交互设计师的下一个合乎逻辑的步骤可能涉及到创建原型。团队制作交互原型有许多不同的方法,比如html/css原型,或纸上原型,在这里,我们不会覆盖广泛的细节。
4. 保持流行性
对一个现实中的交互设计师来说,最难的部分是适应工业发展变化的速度。每一天,新的设计师都可能要在不同的方向上看待媒介。结果便是,用户也会预期这些新类型的交互会出现在你的网站上。谨慎的交互设计师会响应这种演变,不断探索在线交互以及利用新技术,但是我们总是要记住正确的交互或技术是最好地满足角色用户的需要的那些,而不只是最新颖或最令人兴奋的那些。交互设计师还通过在推特上跟随交互设计的思想领袖(比如下列的著名设计师)并主动推动媒介本身的发展,以保持流行性。
四、著名的设计师
从左到右,从上到下分别是:
ALAN COOPER,BILL SCOTT,BRAD FROST,BRENDA LAUREL,BRENDA SANDERSON,
DAN SAFFER,DON NORMAN,KAREN MCGRANE,KIM GOODWIN,MAT MARQUIS,
MIKE MONTEIRO,THERESA NEIL,WHITNEY HESS
译者注:此处篇幅过长,因而对设计师作了聚合,可在原文中查看详细个人说明。
五、工具
交互设计师使用许多不同的工具来完成他们的工作。无论是在一张餐巾纸上画交互草图,还是向客户展示原型,他们的目标都是一样的:通过对话来沟通。交互设计师最需要的就是沟通。下面的列表里是一系列用于促进对话的工具。记住,最终创建的Web界面,通常与面向用户的(前端)技术完成的,比如CSS / HTML。
1. Balsamiq Mockups
Balsamiq的界面简单,使用手绘风格元素和comic sans字体,使得制作交互线框图的过程变得简单,可以认为它是一个在线版的纸上原型!
2. Invision
InVision是一个免费的网站和移动App的原型工具。InVision旨在通过结合Photoshop,Sketch等其他应用促进沟通。设计师可以上传线框图,并通过热区来连接它们。客户、利益相关者和他的同事设计可以直接添加评论,并有实时演示工具LiveShare。
3. Omnigroup
Omnigraffle是OSX上的交互设计师可以利用的图表软件,用单调的审美创造的图表软件Omnigraffle更关注背后的交互设计而不是设计本身,同时其也具备许多优秀的模拟功能。
4. Patternry
没有人愿意浪费时间重新发明轮子。良好的交互设计或代码聚合在一起更能节省时间和精力,并确保设计的一致性。Patternry是一种允许团队交互设计师分享并将其设计和代码资产存储在一个中央位置的工具。
5. Sketch
Sketch是一种设计工具(Mac),最好用于图标的中高级保真度模型,是一个Adobe Photoshop的一个轻量级替代。
6. Axure
Axure RP可以说是市场上最好的交互设计工具。比Balsamiq拥有更强大的功能,内置的协作和共享功能,并且能够轻松地实现线框原型。缺点是,它可能提供了太多,这意味着它有一个缓慢的学习曲线。
7. Uxpin
UXPin是一个协同设计平台,支持低保真的线框图和高保真的动画原型。设计师使用Photoshop或Sketch制作的分层原型可以直接导入,然后从利益相关者处得到反馈。该工具还包括可用性测试和现场演示功能。
六、协会和组织
不管交互设计师是否属于任何特定的组织,其仍然是一个交互设计者。不过,找到其他设计师的网络是向他人学习的好方法。这些协会在美国都有,有一些则是国际性组织。
1)IXDA-Interaction Design Association
交互设计协会,其提供了一个讨论交互设计问题的在线论坛。
2)AGIA-American Institute of Graphic Arts
美国平面艺术学院,组织中的平面设计师更经常地为新媒体设计作品,交互设计在其中扮演了重要组成部分。
七、书籍
其实相关的交互设计书籍列表可以占掉好多页。在这里,我们缩小成几本标志性的图书的列表。如果你真的渴望扩大你的图书收藏,可以看看我们网站搜索用户体验的推荐书集:http://hao.uisdc.com/book/
从左到右依次是《交互设计:创建创新应用和设备(第二版)》《设计数字时代:如何创建以人为本的产品和服务》《设计界面》《交互设计:超越人机交互》《日常生活的设计》
此外还推荐《点石成金》。
2024年网站交互设计规范 篇3
明确了交互设计的充分性与必要性,论证了交互设计的可被研究后,我们不经要问:进行交互设计研究和实践的方法是怎么样的?我们怎么样才能做出有效的交互设计?以及我们如何评价我们做的设计是否有效?
市面上会有很多方法,用户研究、情景化思考、线框图、流程图等等等等。这么多方法、流程,我们应该去用什么?又怎么应该去用?是否也应该质疑它们的存在意义?
我们能不能顺着一条线逻辑线来梳理交互设计的流程应该如何进行呢?
根据我们之前得出的结论:交互设计的实现手段是「构建简单有效的心理映射模型 」。那么我们便可以基于这个思路,来思考交互设计的进行流程。
一、 我们依据什么进行交互设计?
我想,做任何事情,第一步都必须明确目标,也就是说,我们要依据什么进行交互设计?如果没有目标没有设计参考的标准,我们便像是无头苍蝇,东碰西撞,摸不到出口,也无法自检合理性。所以我们第一件事,便是明确:我们依据什么进行交互设计?
目前摆在我们面前的有两个对象:人造系统与人。那我们应该从哪边出发去思考呢?从目的来看,我们是需要让人掌握人造物。那么,从人的角度出发进行交互设计的思考,将会比从机器的角度来的更加合理与自然。我们应该去关注「人」,而不是关注「人造系统」。
那到底需要关注人的什么?是性别吗?年龄吗?身高体重吗?关注什么内容对我们进行设计有着最为重要的东西?有时候人的性别会影响设计,有时候人的年龄也会影响设计,那到底是什么决定了这些因素到底起不起作用?到底是用户的哪个因素从根本影响着交互设计呢?
再回过头来看,我们进行交互设计的意义在于在保持原有功能的基础上削弱人造物的复杂性,使人能够快速地构建对人造物的认知。
那我们是不是从人的认知角度来思考设计就可以了?仔细分析一下,无论是性别、年龄,还是身高体重等等,这些因素其实都是影响人认知的因素。不同年龄的人会有不同的认知,不同性别的人也会有不同的认知。而拨开交互设计的本质,也是在快速构建人对人造物的认知。如此一来,我们在关注人的时候,只要抓住「认知」这一核心即可,年龄性别,身高体重都只是影响认知的因素。
但是,人的认知是抽象的,任何人都无法感知别人是如何进行认知的,也无法将其具象化。我们无法用任何机器来检测一个人的认知到底是什么样的。那是不是不能把「人的认知」作为进行交互设计的标准了?
所幸的是,认知在现实世界中存在一个不完整但是却可以被检测的映射——行为。我们可以从人的一个个行为中推断出他对事物的一部分认知。这一个一个行为进行叠加,我们就拼凑出他对事物认知的全貌。表面因素往往只是深层次本质的部分映射,但是通过大量的表面因素叠加,我们便可以发现本质的真实样貌。
行为是认知的映射,而性别、年龄、身高体重等不同因素都能在某些意义上反映出行为。
因此,我们通过整理出人的不同因素模型,从模型中提炼出人的行为模式,我们可以从这种模型中推测出人的认知方式,而人的行为模式与认知方式便是我们进设计参考的标准因素。
说到这里,大家应该能感觉这些模型都是似曾相识的。没错,人的不同因素模型就是我们常说的「用户模型」,也就是 Persona。人的行为模式就是近年来各个大公司的交互设计都在使用的用户行为模型。而人的认知方式在认知心理学中有「心智模型」对应。但是在交互设计中的运用还是不常见。
因为通常来说,为满足 KPI 的设计,提炼到用户行为模型这个程度便可以了,一个有效的用户行为模型能很好地指导如何改善交互设计,满足 KPI 指标。但是如果要想做一个完全全新的交互模式, 必须从认知方式出发进行提炼。 这里最好的例子便是 3DTouch 。
那么,怎么去构建用户模型才是有效的?很显然,能通过这个模型寻找出有效的行为模式才是有效的用户模型。在这里,我认为 @Lumi 在这个问题:创建用户角色(Persona)时,如何更好的提取行为模式(Behavior Patterns),作为区分不同角色的关键信息?下的回答很好地说明了这个问题。我就不再赘述。根据 Alan Cooper 的描述,行为模式的提取是通过识别访问对象在各行为变量上聚集的状况来完成的,聚集在多个行为变量上的主题集群可能会代表一个显著的行为模式。私认为发现正确的行为变量是提取有效行为模式的最重要过程。在情景调查之前,通过人物角色假设(Persona Hypothesis)提出可能的行为变量,并发现可能影响这些变量的因素。这些因素会作为寻找访问对象的依据之一。要建立好的人物角色假设,需要事先对目标用户的情景以及领域有足够的了解。在情景调查的过程中,我们可以为人物角色假设找到数据支持,验证其有效性,或提出修改或完善。如何通过数据来验证呢?本人的经验是若一个变量的某个取值的确能够作为某个行为模式的组成部分,那么研究数据在该变量上通常会出现聚集情况,可以是聚集在某个值上,也可以是聚集在多个值上而形成明显的对比,而数据分散、没有聚集出现的行为变量通常是无用的变量。在访谈过程中,会发现一些数据与假设冲突的地方,以及新的可能的行为变量。根据这些结论修改人物角色假设,并调整后续的访谈计划。这是一个迭代的过程,直到发现的行为模式在逻辑上可以解释,并且符合所有情景调查的结论。
而关于认知模型的部分,本人也没有人太多深入研究,在此便不露丑,期待有这方面的造诣的答主补充。
二、用户与系统的中转站:用户体验目标
当然,关注人,并不意味着我们要关注所有人。我们应该要从「特定人群」,也就是系统需要面对的「用户」进行切入。
根据前一环节,我们拥有了对用户的整体认知,那有了这些认知之后,下一步需要做什么呢?
当我们完全理解用户之后,我们便要开始考虑系统的功能以及需求限制,进行系统与用户两者的宏观沟通。但是一上手就开始画线框图出界面并不是一种合理的方法。因为你并不清楚用户到底需要什么,也不知道系统如何架构才是最有效合理。从细节入手吃力不讨好,从大局出发,获得合理架构之后,细化才会显得事半功倍。
正常情况下,用户在使用人造物的过程中,不会去从自己有没有掌握人造物,控制人造物这个角度进行认知,而是从人造物好不好用,功能强不强大这些角度进行认知。而这种角度的认知反映的即是「用户体验」。 换句话说,「心理映射模型」的现实映射即是「用户体验」。
因此,我们可以从体验的角度来直观衡量映射模型是否有效。那反过来,为了创建有效的映射模型,我们也可以从「体验」这个角度来限定映射模型的各个因素。 而这种限定并不是细节到按钮如何摆放,而只是呈现了用户想要得到的体验,例如「用户需要知道最新、最潮流的商品样式」、「用户能够方便地选取自己的照片」。
用户行为模式、认知模型中并不包含用户对一个产品需求,用户模型、行为模式和认知模型只会指出老年人辨认能力差,但是并不会直接指出老年人到底需要的是一个大屏手机还是一副老花镜。因此我们需要将根据用户的信息挖掘出用户的需求,分析和构建出用户的体验目标,并翻译成信息架构、界面架构能够理解和执行的内容。这才会成为用户研究与界面架构的过渡桥梁。
三、如何构建「心理映射模型」
「心理映射模型」在某种意义上就是人机接口。但是接口这个词并不能很准确地反映它包含的功能和目的。因为除了接口本身,「映射模型」更加关注接口和功能的组织结构是否符合人的心理。
而从狭义的角度来说,这种映射模型就是界面设计。组织一个心理映射模型或者说界面(绝大多数情况下),应该分成三个环节进行,信息架构、界面架构、界面视觉。
信息架构
为什么信息架构一定是承接用户体验目标的环节呢?它一定有必要存在吗?
根据我们之前的结论,用户体验目标是零碎的设计需求。根据用户体验目标可以设计出符合该需求的功能界面,但是界面与界面之间的流程与关系却并没有被用户体验目标明确。而这个的原因很简单——用户本身并不关心系统的信息架构模式,他们只要觉得「好用」就行了。因此用户体验目标中也不可能会包含明确的架构定义。
然而一个为了达到「好用」的心理映射模型,必然会含有清晰的信息架构模式,有着符合用户思维的流程、页面与控件。因此在架构合理的「心理映射模型」的过程中,我们必须根据用户体验来梳理出一个合理的信息架构:例如明确功能的优先级,功能的跳转关系,模块与模块之间的组合方式等等。 信息架构是衔接用户体验目标和界面的架构的桥梁。基于用户体验目标,我们能够在宏观层面定义出功能的优先级和逻辑关系,整理出界面与界面的层级属性。而这非常有助于提高思考和设计信息架构的效率,同时也是为界面架构做好了非常明晰的指导框架。
界面架构
从狭义的角度来说,这种映射模型就是我们常说的交互原型。但是为何我们要将界面架构与信息架构分开?一方面信息架构作用于宏观层面,把控整体,界面架构作用于单个页面,关注局部。另一方面也是也因为随着技术的发展,出现了更多的界面架构的承载形式,如 AR/VR等等,不同的界面载体会有不同的架构需求。而信息架构作为宏观框架可以始终保持不变。
从流程上来说,这一流程完成的其实是基于流程图的界面框架。在这一个程度进行思考的是用户操作的便捷性和可用性,界面元素是否符合用户的直觉思维等等。 而关于界面架构如何设计,在各大网站、书籍中均有详细的范式、原则,在此不再赘述。
界面视觉
完成界面架构之后,我们需要做的便是完成对应的界面的视觉设计。如果说界面架构是骨的话,那么界面视觉便是肉。用户直接接触的便是界面的视觉。关于这一部分的内容,我个人也不再多说。
2024年网站交互设计规范 篇4
楼主倾向将信息精简,遵从少即是多的原则,只推荐含金量最高的几处信息来源。
这张图几年前楼主见过之后,一直保留到现在。不仅是因为它形象而客观,而是每看一次,它都提醒楼主,作为交互设计师,莫钻牛角尖,综合平衡各方面的信息。
网站类汇总
1.每日必逛
每日必逛的定位在于对一些需要时间比较久地去培养能力的地方,比如审美。或者是同行业人士整理的一些工作上可以用的小tips。
BehanceShowcase & Discover Creative WorkBehance 是展示和发现创意作品的领先在线平台,同时也是 Adobe 系列的一部分。Behance 的管理团队每天都会从各种领域中的顶级组合探索出新作品。这些领域包括设计、时尚、插图、工业设计、建筑、摄影、美术、广告、排版、动画、声效以及更多。领先的创意公司可以通过 Behance 发现人才,数百万的访客也可以使用 Behance 跟踪最新和最杰出的创意人才.现在已经推出iOS和支持Android4.0版本以上的APP,可以进行使用。
DribbbleWhat are you working on?Dribbble 的口号是,你正在创作什么?然后,鼓励创作者上传个人的作品,以及正在创作的作品到 Dribbble 网站上。Dribbble的作品整体质量却非常高,许多摄影师、设计师和其他创意产业人士都喜欢在这里展示其未完成的设计,通过与其他设计师的共同探讨来激发自己的灵感。也有相应的APP。
Dribbble 上的作品以 GUI 设计、平面设计、插画、VI 设计为主,而 Behance 上种类更多,还包括了 广告、建筑、摄影、Motion 等等。从 Popular 榜单上也可以看到,Dribbble 上经常是明星设计师们精美的图标或者界面,而 Behance 上多是一些 Agency 的整体品牌视觉包装。知乎上有位大神的比喻比较恰当,“Behance就像设计师的厅堂,展示大方,井井有条。dribbble就像设计师的厨房,进去问一句「今天打算做点啥?」,瞅见各种半成品跟成品,七嘴八舌,其乐融融”。
PinterestPinterest采用的是瀑布流的形式展现图片内容,无需用户翻页,新的图片不断自动加载在页面底端,让用户不断的发现新的图片。图片质量都算比较好的。
人人都是产品经理国内做得比较好的产品经理学习、交流、分享平台,也有设计、运营的知识分享,在互联网业内得到了广泛关注和高度好评。
优设网一些比较实用的设计类综合信息教程,每天会更新几篇文章,花费时间不太长,值得浏览。
Google是所有问题的终结者,当我们没法从专业的网站上去获得答案时,就Google吧。
2.前沿类的网站
MediumStories that move with you.
Medium 是一个全新的轻量级内容发行平台,允许单一用户或多人协作,将自己创作的内容以主题的形式结集为专辑(Collection),分享给用户进行消费和阅读。
该网站好文不断,汇聚各行各业的设计大拿,如果关注了对了自己感兴趣的话题,以及优秀的设计师,自己的打怪升级进化之路会变得更加平稳。在这里推荐Medium《你该认识的64位设计师》,唯一不太方便的地方就是,文章是全英文的,对于英文不好的童鞋有点吃力。不过多看一些,进步就会很大,加油吧,童鞋们~
3.设计规范
《iOS human interface guideline》《Up and running material design》
市面上平台不仅仅只有iOS和Android,但既然是精简版,在这一步只介绍这两种。单这两个平台的规范,就足以让自己去钻研许久了,有精力的小伙伴也可以再去搜索一下Windows Phone等平台规范文章。
读规范,并不是一步全部读完,需要分好几遍来进行研究。刚开始概览一遍,做到框架的熟悉。然后在做项目的过程中边做边翻阅,又会给自己一些灵感,比如说控件怎样进行统一,同一控件不同的状态怎样表述等等。它们是值得一读再读,反复研究的材料。
软件学习
软件学习分为三大方向。
第一个方向是专业类的,图形图像的处理用Sketch或者Photoshop。Photoshop擅长图片的处理,这一点它是老大,没人能撼动。但作为流程图的绘制工具,它的效率确实比轻量级的Sketch要来得慢一些。所以定位可以分为Sketchup用来画页面的流程图,表达跳转关系,而PS进行辅助,用来处理一些漂亮的图片。两者进行相互的配合。
专业内的还有原型展示工具。原型展示工具就是将二维平面的设计图,变成动态可以上手进行操作的demo。做这一步是为了检查在跳转过程中是否有存在让用户体验不流畅的地方,避免在开发的过程中才发现这样的问题,浪费大家的精力。
这样的软件主要有AE、Principle、Flinto、Origami等等。现在市面上功能比较晚上的应该算是Origami,不过它学起来思维转换比较大,要有开发思维,所以对于设计师来说上手有点难。比较简单的是Principle、Flinto,AE更像是一个完整的动画,不能鱼人进行交互动作。
第二类是文档的整理。文档的整理主要是项目的进度跟进,资料共享,平时的会议等等。这个比较常见,Mac的keynote、number、Notes或者Windows的PPT、Word、Exce都可以。不过个人比较喜欢Google 云端储存文件,方便团队共享,更改和同步。
第三类是思维的整理。脑图工具会帮助咱们罗列出各种大小事件,然后进行归纳整理,排出优先级。最好用的是MindNode,但只能Mac进行使用。Windows用户可以使用Xmind,颜值稍微低一点。
推荐书目
在推荐书目里面,楼主比较支持一种做法,就是挑一本经典的书,然后反复不停地去读它。理论结合实际地去用,有疑惑的地方再回过头来进行查阅、反思。
所以楼主推荐的书目,主要是业内耳熟能详的书籍,在亚马逊或者:《About Face 3 交互设计精髓》(强烈推荐,时间不够也可以只看着一本)《设计心理学》《用户体验的要素》《瞬间之美》
实践
关于实践,楼主秉持着一个原则,就是一定要带着自己在工作中遇到的问题,去训练。重要的事情说三遍:带着问题去实践!带着问题去实践!带着问题去实践!
其次,主动地、不断地帮助团队去解决问题,不论大小。
总结一下,在基本功阶段,咱们翻阅各种网站,学习软件,翻阅书籍,目的其实是为了提高自己的审美,用方便快捷的工具将项目的信息传达给团队。也就是说,要培养的是自己对美的追求态度,信息的归纳总结能力,逻辑思维能力。