查看原文
其他

南科课程 | 课堂的教具可以是游戏卡片,也可以是老师的电动车

SD 南方科技大学 2024-04-14

【编者的话】

大学的课堂,世界之大在这里徐徐展开,思想之美在这里碰撞升华。“南科课程”专栏,带你走进南科大的课堂,与师生们一同探索专业知识,展开前沿思考。本期“南科课程”,让我们一同走进交互设计的奇思妙想


老师的私家车变教具

学生制作出短视频防沉迷系统

并且申请了发明专利

每节课后互评方案大讨论

师生共同编辑“知识树”

总结消化硬核知识点

......

这是发生在南科大创新创意设计学院

 《用户体验与交互》课堂上

真实的授课模式

将抽象概念通过亲身体验具象化

通过业界案例分享举一反三

今天官微带你体验

这门有趣的课程



《用户体验与交互》是由南科大创新创意设计学院 (以下简称“学院”)罗涛教授于2022年秋季开授,面向大三同学为期4周的一门设计工作室课程(Design Studio)。本课程通过讲授罗涛教授的主要研究成果交互设计语言(IxDL),专注培养同学们对微交互底层逻辑和结构的拆解、分析与创新能力。通过个人课程项目,挖掘日常生活中交互体验的需求、痛点和机遇,比较和分析各种场景(如触摸屏、实体交互、AR/VR、互动游戏等)下的交互技巧,并提出新颖的交互方式改善用户体验。本课程包含课堂讲授、互动体验、案例分析、特邀讲座和设计评审五个主要环节。



教具可以是游戏卡片

也可以是老师的电动车


交互设计语言包含多个复杂的重要概念,例如,“操控力”是交互设计语言中最基础的概念,由操控的主体、被操控的客体和他们之间的操控关系组成,包含丰富的交互细节。在本门课程中,罗涛教授通过丰富的案例,深入浅出地介绍了交互设计语言的概念,对微交互的底层逻辑和结构进行细致讲解。为了让同学们更深入的理解和学以致用,除了传统的讲授之外,罗涛教授也充分利用自己开发的各种交互设计工具插件(如IxDL Editor、IxDL Engine),让同学们上手体验各种交互技巧的结构和感受,原本“晦涩难懂”的知识通过同学们的亲身体验变得“通俗易懂”。


罗涛教授向学生讲解交互设计语言的基础概念

学生寻找案例、进行描述,并与罗涛教授探讨


每次学完一整天的“硬核”知识,必不可少的一环是总结与反思。这次课程还设置了同学们的“种树”环节。“共享知识树”是以一种对课程知识结构可视化的展示方式,所有同学都能编辑和查看。每个概念区域给大家留有发表想法的空间,并在多处设置Template Area(包含案例展示模版、提问模版、回答模版、想法表达模版),同学们可以复制相应模版并编辑内容与大家分享。罗涛教授和助教也会在每次课程结束后查看大家的共享内容,为有疑问的同学提供解答或对大家的共享内容给出评价。通过共享大家对课程内容的学习心得和疑问,促进同学们相互交流和学习,加深同学们对相关概念的理解。


同学们“种树”的阶段性成果


为了更好巩固同学们的基础理论知识,罗涛教授在课程中安排了许多互动体验环节,令学生在轻松愉快的氛围中不断汲取、加深、应用和巩固所学知识。



卡片游戏


在第一周的课程中,围绕“操控力”的联动关系,罗涛教授组织了一场别开生面的卡片游戏。学生分为5组,每组获得一套“小卡片”,每套卡片上印有不同的交互设计语言表达式构件,学生可以遵照基本“语法规则”自由摆放,并使用特制卡片对屏幕上的案例进行描述。


罗涛教授向学生介绍卡片游戏的使用方法

Enza MIGLIORE教授、徐秋石教授与学生互动

罗涛教授、徐秋石教授与学生讨论


许潆心:课上让我印象最深刻的是罗涛老师讲解绝对联动和相对联动的概念的方式,他通过多个生活中的例子,结合一套卡片游戏帮助我们区分这两种联动。我们根据给出的例子,选择符合例子的卡片拼成表达例子里面交互的关系。使用卡片的过程给课堂增添了不少趣味性,十分有利于同学们对于抽象概念具体的理解,以形成结构化的知识体系便于记忆。



电动车


罗涛教授还将自己的私家车变成了教具,邀请同学们去户外体验电动车上的各类交互方式和细节。并将触屏上空调风向控制作为一个小挑战,让大家在使用后分析其交互结构和细节。同学们兴致勃勃地感受了车门和触屏等交互方式,并积极地思考其中涉及的交互细节。这种互动式的教学方式极大地提高了同学们的热情,加强了同学们对所学内容的印象和满足感。


同学们体验电动车

同学们体验电动车的触屏


邱果:在课程中我们有很多的机会去亲身感受一个交互并且尝试描述它。这其中不止有老师和助教精心准备的交互操作案例,老师甚至会带我们去亲身体验实际产品的交互过程。在课程中罗涛老师直接用他的电车当作教具,通过让我们实际感受车门开关和空调调风等几个不同媒介的交互案例并且用交互设计语言进行分析,去理解设计者的用意和交互过程的微妙。这对我们来说是一种非常新奇的体验,同时也让我们切身感受到研究交互设计的乐趣。



任天堂Switch


游戏对交互设计的细腻程度要求极高,罗涛教授通过任天堂的Switch主机,介绍了健身环、塞尔达传说和赛车游戏中常见却容易被忽略的交互细节,并用交互设计语言对各种交互结构展开分析,甚至利用Arduino制作了简易的交互原型,向同学们展示健身环的交互方式还有其他哪些可能的形式。同学们在体验游戏交互技巧的同时,也切身体会了游戏交互设计和交互设计语言的魅力。这种寓教于乐的教学方式,极大地提高了同学们的学习热情和积极性。


罗涛教授介绍健身环的交互使用原理

罗涛教授讲解“塞达尔传说”中的微交互


李衔:罗老师的课通过实践的方式,实实在在地让我们亲自接触健身环以及Swtich,以及PS4的方向盘,亲自体验有很不一样的感受。书本上学到的交互理论知识,很多时候是靠想象去实现的,和实际落地差距很大。平时一些感觉普普通通的交互,实现起来原来那么困难。在塞尔达传说中,罗老师对里面的“技能释放”“对准目标视角”等功能用IxDL进行拆分,一个普普通通的功能经过拆分后,真是大有文章,再一次让我体会到了IxDL的通用性与普适性。


俞晗煦:罗涛老师从我们感兴趣的游戏入手,找到一些比较有针对性的交互进行分析并且让我们亲自体验,使我们更容易感受到交互的各个环节。简单来说就是“寓教于乐”,正因为互动性强,我们也更能够用心去分析游戏中比较复杂的复合联动。



从课堂触摸业界经验


为帮助学生更好地洞察问题、抓住痛点、发现机遇,罗涛教授还根据他之前在韩国企业SK Telecom和韩国国民大学中的实际设计项目,详细讲解了大量实践案例的设计内幕(T map双指缩放、虚拟键盘交互创新、网易云音乐交互创新等)。通过向同学们展示如何在实际项目中,深挖微交互的结构、逻辑和细节,做出令人愉悦的交互体验,以此帮助同学们举一反三,学会发掘交互层面的需求和机遇,分析微交互的细节,并提出改善方案。


罗涛教授分享实践案例的设计内幕


罗涛教授的博士研究生于入洋也基于自己的研究,进行了交互设计案例的分享。他以虚拟环境中最基础也最常见的按钮交互为例,通过交互设计语言与AR/VR交互原型,向同学们展示了四种不同的交互逻辑在不同操作情境下的优缺点。案例分享后,同学们也体验了Hololens(AR眼镜)和Oculus(VR眼镜)中的三维按钮和菜单交互,更直观地理解与感受二维与三维按钮和菜单在交互细节和用户体验上的差异。


学生体验Hololens与Oculus交互

于入洋进行案例分享


为了让同学们从业界学习交互设计的实践经验,本课程邀请了网易游戏交互设计主管刘海岩、科沃斯机器人资深交互设计师郭皓月、兰宙技术科技UED负责人金周雄、北京隆源天恒知识产权代理公司总经理闫冬分别给同学们做了特邀讲座,分享了他们所设计的交互案例以及在不同行业中,交互设计和用户体验相关的岗位设置、工作内容和工作重点。专家们指出,希望同学们能够掌握发现好问题的能力,更好地运用交互设计语言和它所带来的思考方式,帮助设计师更好地与人交流,做出有价值的创新。与企业专家们的交流让学生对交互设计实践有了更深刻的认知。


科沃斯机器人资深交互设计师郭皓月做线上讲座

北京隆源天恒总经理闫冬做线下讲座



课堂作品申请交互发明专利


为了及时给予同学们充分且多元的指导和评价,课程还设置了每日互评,中期评审和最终评审三个设计评审环节,邀请来自设计学院、技术转移中心、各个企业的老师和专家、甚至是同学们相互之间,针对同学们的设计提出反馈意见。


同学们在浏览他人方案并交流讨论

企业专家总结点评

各位专家参与结课评审


经过四周的学习和实践,同学们在不同的场景下都找到了相应的需求和机遇,并通过对其微交互结构、逻辑和细节的分析,提出了各种设计方案。其中有三个同学的方案由于创新点比较突出,现已正式申请交互发明专利。


“听话”的光标


该方案在触屏设备上,针对内容输入框内光标调整这一常见操作,提出了“轻拨”等新颖的交互技巧,让用户能在不同调整模式之间自然的切换,提高内容输入框的整体使用体验。(该方案由张奕静同学设计并制作,发明专利申请号:202310181969.2)




Vinlyist - 

一套有趣的音乐播放交互


该方案在网易云音乐黑胶唱片的概念基础上,通过探索交互的“加法”增加音乐播放操作的情绪和多元化,增加交互手势中多种属性与音乐属性之间的对应关系,让简洁但趋同的交互方式多一些趣味性。(该方案由邱果同学设计并制作)




通过交互减少短视频的成瘾性


该方案对各类短视频应用中,过于丝滑的视频切换手势进行了反思,提出通过交互手势细节的变化,让用户在刷短视频时调动更多感官和认知,从而起到微妙的提示作用,帮助用户避免成瘾。(该方案由梁万生同学设计并制作,发明专利申请号:202310181976.2)




画的“多重宇宙”


该方案在平板电脑上,针对数字绘画过程中需要频繁撤销和重做的需求,提出了“树状图”功能及其相关的展开、浏览等交互细节,让用户在平板绘画过程中,可以更有掌控感地撤销和重做。(该方案由唐子麓同学设计并制作,发明专利申请号:202310181973.9)




 手机视频单手剪辑操作


该方案聚焦手机视频剪辑的场景,探索仅通过一个按钮进行复杂剪辑操作的可能。在支持单手操作的前提下,尝试提高剪辑操作的交互效率、直观性和趣味性。(该方案由李衔同学设计并制作)




更流畅的短视频分类收藏操作


该方案聚焦手机短视频收藏的高频操作,探索更为流畅直观的分类收藏交互方式,减少画面切换带来的割裂感,让用户在观看短视频的同时,能够快速完成视频的分类收藏。(该方案由盛玥同学设计并制作)






推荐阅读


〇〇〇,在南科大相约 π DAY


原创科幻哲理剧《云身》在南科大上演!


首次解密藻华,南科大冯炼团队成果登上Nature封面






--- 南方科技大学 ---

新媒体中心


来源:创新创意设计学院

文字:于入洋、吴子鉴、张昱琪、罗涛

编辑:杨奂彦


欢迎投稿、建议:

weixin@sustech.edu.cn


继续滑动看下一个
向上滑动看下一个

您可能也对以下帖子感兴趣

文章有问题?点此查看未经处理的缓存