首页

如何从产品角度发起交互设计?

天宇 交互设计及用户体验

本文从产品角度出发,深入探讨了如何发起交互设计。通过明确产品目标与用户需求、进行用户研究、构建信息架构、设计流程与界面、进行原型测试以及持续优化等关键步骤,阐述了如何打造出满足用户期望、提升用户体验并实现产品目标的交互设计。
 
一、引言
 
在当今数字化的时代,产品的成功不仅仅取决于其功能的强大,更在于能否为用户提供流畅、愉悦且富有价值的交互体验。从产品角度发起交互设计,意味着将用户置于核心,以实现产品的商业目标和用户需求的完美融合。
如何从产品角度发起交互设计?
 
 
二、明确产品目标与用户需求
 
(一)定义产品目标
产品目标是交互设计的起点,它决定了设计的方向和重点。产品经理需要与团队共同明确产品的定位、市场需求以及预期的商业成果。例如,是旨在提高用户活跃度,还是增加用户转化率,或者是提升品牌形象。
如何从产品角度发起交互设计?
 
 
 
(二)挖掘用户需求
通过市场调研、用户反馈、竞品分析等手段,深入了解目标用户的行为习惯、痛点和期望。这不仅包括对用户显性需求的捕捉,还包括对潜在需求的挖掘。
如何从产品角度发起交互设计?
 
 
 
三、进行用户研究
 
(一)用户画像创建
基于收集到的数据,构建详细的用户画像,包括用户的年龄、性别、职业、教育背景、使用场景等特征,以便更精准地理解用户的行为和需求。
如何从产品角度发起交互设计?
 
 
 
(二)用户场景分析
模拟用户在不同场景下与产品的交互过程,发现可能存在的问题和优化点。
举例说明:
我们要知道,地铁周边美食,这是一个解决方案。真正的需求是什么?一个字一个字地找需求,地铁=快速方便出行,美食=和朋友一起吃饭/自己一人吃饭。这是一个和线下场景很相关的项目,我们要把不同目的核心用户的主要使用场景写出来。经过分析,我们得出了用户会选择我们产品,且产品未来可能存在的各种场景A、B、C、D、E。如下图所示:
如何从产品角度发起交互设计?
 
 
如果按照目标人群所在场景分类,进行细分,则为下图:
如何从产品角度发起交互设计?
 
 
乘地铁去地铁站和附近地铁站区别:前为用户会乘坐地铁去目的地寻找美食;后为用户不用地铁/吃完后使用地铁,地铁边美食没有其他美食团购产品有竞争力。
上班族和普通大众区别:上班族工作日使用固定地铁站上下班,时间可能紧急,快速获取食物;普通找美食吃的大众不使用固定地铁站,目的是通过地铁快速到达某目的地,就近享受目的地美食。
朋友们和个人区别:朋友们一起吃饭,容易出现喝多、吃过点等异常行为,并且在选择地铁旁吃饭地点时需要考虑朋友们家的位置就近选目的地。个人均不需要考虑以上,较为自由。
 
市场定位
经过领域场景的分析,我们知道了真场景都是用户有目的乘坐地铁去到某地铁站出站口寻找美食的。那么我们对这么一群大众进行用户人口统计学类的细分:
如何从产品角度发起交互设计?
 
 
  • 上图为前期定位的目标大众用户群,依靠地铁的工具属性,我们得出了具体的两个影响因素:时间+美食热爱程度。同时我们把直接竞品和间接竞品一同进行用户群比较。可以看到和大美团有相同和不同维度,这就是产品最初冷启动时期的差异化!也就是我们的前、中期场景的主要目标用户类型。
  • 红色部分即种子用户群,以这些群体为冷启动阶段,可以更快的向四周扩张。因为他们有使用地铁的时间属性,同时有较高的美食热爱程度,有利于带动其他时间+热爱程度的用户加入产品,实现快速并有质量的拉新、活跃的目标。
  • 低端直接竞品即用户群工具属性明显,只是搜地铁站,选择美食的用户,无明显其他行为;高端竞品即注重社交、ugc为起点,逼格高的搜寻美食工具。这部分开始很难,工作量巨大,且较脱离大众主流群体。
 
结合上图和要做的场景,我们得出了产品具体目标用户:乘坐地铁快速到达并寻找目的地美食的大众用户(上班族休息日,大学生,个人或一起),要求在地铁站附近便能方便享受目的地美食。且对美食有一定热爱程度。
 
(三)用户测试
邀请真实用户进行产品试用,观察他们的操作行为,收集反馈意见,为后续的设计提供依据。
1、需求接受
需求很有可能是在线上接到的,并不是面对面交流传递的,并且还会遇到很多坑,例如需求本身不具体,或者自己理解有偏差,因此在接到需求后,最好和交互、产品等同事进行面对面的交流和沟通。
详细了解测试目的和关键点,确定用户配比。
最好是让交互带着跑一下整个程序(半成品demo也好,交互稿也行),这样能在头脑中快速形成操作流程的认知,并把相应关键点对应上去。同时把大致的用户配比情况敲定一下,后续就可以直接招募用户了。
了解demo的完成进度,相应确定具体测试时间。
交互、视觉等完成demo的时间具有太多不确定因素,因此我们需要及时了解整个demo的完成进度,在尽可能快的情况下保险安排测试时间,如果邀请的是外部用户,结果用户到了而demo还没出来,那也是够了。
2、方案撰写和确定
让交互稿帮助自己。在完成测试方案撰写的过程中demo还未诞生,具体程序细节记忆又很模糊,不好写测试方案,怎么办?不要慌,去看交互稿吧。
及时沟通。在方案撰写过程中,如果有一些疑问,例如在看交互稿的时候还不是很理解某个具体操作过程,或者自己对产品有疑问的也可以跟交互等沟通,因为自己会遇到的问题,很有可能在测试用用户也会遇到,这样子用户如果问到了,就可以相应作出解释。
核实确定方案。完成方案后,可以在公司沟通交流工具上和交互及产品等同事再确认一下,是否有什么地方遗漏或有不妥之处。
3、用户招募
这是一个大多数人都头疼的一个过程,希望看完了以下几点,可以稍微缓解一下大家的症状。再次确定测试时间。
方案定下来后,再跟交互确认测试时间,了解是否有变动和调整,尽量避免用户来了demo或者测试环境还不ok的情况。
 
撰写招募文案。需要把用户要求、测试日期和地点、报酬、大致的测试时长、用户需要在测试中做什么,以及报名方式等表达清楚。有以下几点可以注意一下,方便我们自己招募:
  • 详细列出测试安排的时间段。例如10:30-11:15、13:30-14:15,让用户自己挑选合适的时间段,这样就不用事后再协调不同用户测试时间了;
  • 优先人力、信息管理、行政等岗位同事。尽量避免相关产品人员、设计岗等同事。
  • 制作简单的招募海报,并检查。可以事先将“海报”用word或者ppt做好,然后保存成图片格式,记得检查核实一下是否有错。因为在公司IM群上直接黏贴确实方便,但是其排版往往不利于阅读,导致用户会遗漏重要信息。而制作成图片格式,可以更好地去避免这个问题,同时还可以显得整个招募过程比较正式,突出了对用户的尊重,也能在一定程度上体现我们用研工作的规范性。
 
多渠道投放招募海报。内部用户可以尝试先在公司IM群组上招募,之前招募样本量比较小,因此很快可以招到,其他途径暂时未尝试,公司论坛应该也可以,不过隐约感觉效率会比较低。外部用户可以在朋友圈试试,效果还不错,大家都很热情帮忙转发,群众的力量大无穷。也可以相应去搜索一些QQ群,加入并发布招募信息。另外还有一些社交论坛什么的,都可以尝试一下。方法很多,针对具体招募情况,大家就尽情发挥吧~
 
用户多了留到下次用。海报发出去后,有时也会出乎意料用户数量超过预期了,这是好事,不要担心,也不要急着拒绝,平和的跟对方说明情况,强调下次还会有测试,把用户相应信息了解一下做个记录,下次招募的时候可以直接先联系这几名用户。当然前提是你真的有下次测试需求,如果没有那还是老老实实说明情况。
 
确保自己和用户能彼此联系上。跟用户强调测试时间和地点,尤其是外部用户,如果招募和正式测试隔了几天,最好在测试前一天再通知一下。给出自己的联系电话,同时询问用户的联系电话。
 
第一个用户尽量安排公司内部同事。很多时候demo的完成情况会出现意外,到了测试时间demo还不能用,内部用户可以方便取消或者更换。另外,在第一次测试前谁都不确定用户会有什么反应,第一个测试是可以起到试水效果,而外部用户成本高,用来试水太奢侈。
4、测试准备
 
材料准备。需要准备的内容有:量表、报酬签收表、记录笔记本、录音笔、会议室借用,以及记录表格,如果是外部用户过来,相应准备一杯水,人家大老远过来也不容易。
 
测试内容准备。其实每次访谈用户自己都会挺紧张的,不知道用户是不是也很紧张(PS:好想当一回用户,体验一下被访的感觉)。为了消除这种紧张,同时也是为了更好的完成访谈,可以有尝试以下几点:
  • 尽可能多的去了解所需测试的产品。有时候demo出来的晚,下午要测试,demo中午才出来,自己都没玩过,测试还怎么搞?之前也说了,那就使劲去看交互稿吧,虽然比不上实际操作来的真实,但是也能有不小帮助,但也要给自己留足熟悉demo的时间。
  • 按照模块来列提纲。其实相当于组块策略,把同一个模块的问题放到一起更方便记忆,并且也在访谈中也方便自己和其他同事发现遗漏点。但模块不要太大,如果太大了就相应拆分一下。例如,在考拉新版测试的时候,有“首页”、“活动”、“购物车”等测试,但是光是首页内容也很多,作为一个模块还是太大了,可以拆分成“首页整体感知”、“商品详情”等几个方面来整理提纲。
  • 根据任务演练提纲。有了提纲后,按照任务大致过一下所有列出来的问题,这个过程会打乱按照模块列好的提纲,有一次这样的排练,在测试的时候更不容易漏掉题目,而且也相当于模拟了一下测试,自己心里会更踏实一点,在实际测试过程中也能有更好的应对。
 
相关人员通知。通知交互和产品的同事具体测试时间和地点,邀请他们一起参与。不建议交互和产品只是后期测试查阅报告,如果他们参与到测试中,能更近距离和用户接触,并能更加深刻感受到产品存在的问题,也能更好的推动产品的改进。
5、正式测试
主持人需要注意的点:
  • 划分我们和产品的关系。在测试之前跟用户说明清楚,我们并不是产品的设计者和开发者,我们只是受产品方委托来进行测试,以免用户不好意思当面如实评价产品。
  • 强调测试的是产品,而不是用户。要跟用户说明产品尚处于不完善阶段,因此邀请用户过来进行测试,帮助发现问题和改进产品设计,但请注意不是为了评价产品。
  • 注意访谈技巧。这个就不用多说了。
  • 尽可能深入的去挖掘用户的需求。不要停留在用户话述表面,更进一步去追问,用户为什么会这么说或这么问,例如,很多时候在测试中会碰到用户说“哦,原来这个按钮是xx功能,我还以为是xx功能“,这个时候可以再推进一步,了解用户为什么会这么认为。
  • 给其他在场的同时发言的机会。主持人如果觉得自己访谈的差不多了,可以询问一下记录者以及交互、产品等同事,了解他们是否还有问题需要补充。
  • 记得量表评分和报酬签收。长时间的测试和访谈后容易忘记量表评分和报酬签收,可以把这两份东西放在显眼的地方,另外可以让记录的同事打个招呼,帮忙提醒自己。
 
记录人员需要注意的点:
  • 仔细观察用户行为并记录。记录不仅仅是用户的观点、想法等,更重要的是记录用户的实际行为。
  • 按照模块记录。记录者可以按照测试方案中的模块来相应记录用户的行为和言语表述。
  • 查漏补缺。主持人可能会遗漏一些点,记录者作为旁观者需要提醒主持人遗漏了什么,或者自己有什么新的内容需要补充。
 
6、测试结束欢送用户。对用户表示感谢,并开门送一下用户,对于外部用户,最好能送到大楼外面可以看见出口的地方。
测试后及时讨论。这个是重点!
在每一名用户测试后及时和交互、产品等同事快速过一下主要发现的问题点,这样做有以下优点:
  • 有效达成共识,确定解决方案。刚访谈结束印象最深刻,因此能快速有效达成对主要问题的共识,并讨论确定相应的解决方案。
  • 体现敏捷优势。确定了一些比较严重的问题后,交互和产品的同事就可以相应去改进产品设计,做到了边测边改,加快迭代速度。
  • 帮助优化访谈提纲,和测试用户安排。有些问题在事先撰写方案的时候可能没涉及到,在讨论后可以补充进去,而有些问题确定后则不需要再测。另外,也可以通过讨论对事先安排的测试用户进行相应调整,例如增删用户,或者调整新老用户测试顺序等。
  •  
    事后帮助我们自己快速撰写方案。通过讨论确定了关键问题,并且,交互和产品的同事也相应清楚了,因此在最后可以快速形成报告。
再次感谢用户。所有用户测试结束后,可以花几分钟时间简单感谢一下用户。
 
7、报告撰写
针对不同大小项目的用户测试,在完成报告撰写过程中有两种具体方式:
  • 小测试项目简单快速撰写报告。对于那些1-2天的小测试项目,由于在每次测试后都有讨论,已对主要问题达成共识,因此在报告撰写的时候就可以快速地将主要的问题和风险点呈现出来。
  • 大测试项目每天总结并反馈主要问题。大的测试项目持续时间比较久,针对每天的测试及讨论,简单总结一下主要发现的问题,并反馈给相关人员,如果到了最后再总结,容易遗忘掉一些内容,并且这样子也方便自己最后撰写报告。
 
四、构建信息架构
思考信息架构有三个核心关键词:用户角色、产品价值、使用场景。
1、明确用户角色
用户角色清晰揭示用户目标,帮助我们把握关键需求、关键任务、关键流程,看到产品哪些是主要的事,哪些是次要的事。我们应该尽可能丰富、形象化我们的用户角色,让它在设计决策过程中发挥作用,设计出更符合用户场景的产品。
2、了解产品的目标价值
作为产品的设计师一定要理解产品的价值,知道用户想要什么,把最重要的优先级提到最高,尽量移除无关紧要的信息,或降低其他优先级的权重,以免对用户造成干扰。
3、提炼产品的使用场景
要了解产品的业务流程,比如目标用户是谁、什么场景、如何使用,要把产品业务流程上的节点一个一个梳理出来,还要考虑这个产品对用户的价值是什么,不要仅仅考虑界面的元素规范、设计细节等等,要知道产品的目标价值体系。
4、信息架构优先级
基于三个核心点(用户角色、产品价值、使用场景)分析,把目标用户人群核心价值的功能点业务流程梳理出来,分清主次关系,切忌功能堆砌,具体方法可以把所有功能业务逻辑的主线列出来,然后根据业务的优先级做评级,分清楚这些功能哪些是主要的,哪些是次要的,然后通过数字做排序,这样我们就知道哪些功能设计需要明显,哪些功能设计需要低调。
5、信息归类及整合
从整体上思考信息类产品的分类及整合,比如用户资料相关的产品会有用户信息、资料、等逻辑,这样就要把所有跟用户相关的信息都归在同一个分类菜单下,不要让他们分散在各个页面中。也就是所谓的一级菜单、二级产品的处理逻辑。
6、要定期审视与迭代
随着产品规模与复杂度的提升,要随时关注信息架构是否满足当前的产品框架,不要等需要时候再去孤注一掷的全盘优化,这样会让项目陷入被动的局面,可以逐渐增强,循序渐进的优化,从小的细节对信息架构进行调整,提升产品的易用性。
 
六、进行原型测试
1、制作原型
使用快速原型工具制作可交互的原型,以便更直观地展示设计方案。
 
(二)内部测试
团队内部进行初步测试,检查功能的完整性和流程的合理性。
 
(三)用户测试
邀请外部用户进行测试,收集他们的意见和建议,发现潜在的问题和改进空间。
 
七、持续优化
 
(一)数据分析
通过收集和分析用户的使用数据,了解用户的行为路径和偏好,为优化提供数据支持。
 
(二)用户反馈处理
及时响应用户的反馈,将有价值的建议融入到后续的优化工作中。
 
(三)迭代更新
根据数据分析和用户反馈,不断对交互设计进行迭代更新,以适应市场和用户需求的变化。
 
八、结论
 
从产品角度发起交互设计是一个综合性的过程,需要充分考虑产品目标、用户需求、信息架构、流程界面、测试优化等多个方面。只有以用户为中心,不断追求卓越的用户体验,才能打造出具有竞争力的产品,在激烈的市场竞争中脱颖而出。
 
在未来的产品开发中,随着技术的不断进步和用户需求的不断变化,交互设计也将面临新的挑战和机遇。产品团队应保持敏锐的洞察力和创新精神,持续探索和优化交互设计,为用户创造更多的价值。
 


作者:Charlotte的嘻酱
链接:https://www.zcool.com.cn/article/ZMTYyNzM1Mg==.html
来源:站酷
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

用户体验一致性思考

天宇 交互设计及用户体验

前言
在团队内部,我们已确立了一套设计规范,在日常项目中使用设计规范输出变的高效、统一。然而,在实际操作中,不可避免地会遇到一些特殊情况:某些客户提出的个性化需求并不完全契合既定的设计规范,这些促使我们不得不在保持设计一致性的基础上进行灵活调整。因此,深入反思并优化一致性原则的应用策略显得尤为重要。我们需要探索如何在坚守设计规范核心精神的同时,灵活应对多变的需求,确保设计既保持统一和谐,又能满足特定场景下的独特需求,从而实现用户体验与品牌价值的双重提升。
 
用户体验一致性思考
 
 
用户体验一致性思考
 
 
在UI/UX设计中,雅各布·尼尔森的十条可用性原则中,一致性(Consistency and standards)位列第四。这一原则强调在界面和交互设计上需要遵循既定的规则,无论是在应用内部还是跨平台之间。
背后的心理学原理——重复定律,强调了信息重复对于巩固记忆的重要性。正如赫尔曼·艾宾浩斯通过“遗忘曲线”所揭示的,信息的有效保留离不开重复接触。一致性的应用正是这一原理的生动实践,通过不断重复统一的设计元素与模式,强化用户对产品的认知与记忆,从而提升整体的用户满意度与忠诚度。
艾宾浩斯遗忘曲线
艾宾浩斯遗忘曲线
 
用户体验一致性思考
 
 
用户侧
1、用户学习曲线:
一致的UI/UX设计可以降低用户的学习曲线。当用户在应用程序或网站中遇到一致的元素、布局和交互方式时,他们可以快速理解并准确预测如何与界面进行交互。这减少了用户的混淆和困惑,提高了他们的效率和满意度。
2、提升可用性:
一致性使用户界面更加易于使用。当用户在不同的页面或功能之间找到相似的设计元素和交互模式时,他们可以轻松地将已有的知识和经验应用于新的情境中。这种一致性帮助用户快速完成任务,减少错误和迷失,提供更好的导航和流畅的体验。
3、品牌认可度:
一致的UI/UX设计有助于树立品牌形象和增强品牌认可度。通过在不同的渠道和平台上保持一致的设计元素、标识和视觉风格,品牌可以建立起独特而可识别的形象。用户在不同的触点上都能感受到品牌的一致性,从而增加品牌的信任和忠诚度。
4、用户满意度:
一致性直接影响用户的满意度。当用户在使用应用程序或网站时感受到一致的设计和交互方式时,他们会感到更加舒适和自信。一致性传递了专业和质量的信号,让用户感到被关注和重视。这种积极的用户体验有助于提升用户满意度,并促使他们持续使用和推荐你的产品或服务。
 
用户体验一致性思考
 
 
产研侧
1. 降低设计成本,提高开发效率
无论是设计还是开发,复用已有的组件资源,保持界面的一致性可以有效地减少设计的投入,避免不必要的设计分歧点。
而在开发阶段,可以避免重复造轮子,提高开发的效率,保证落地效果,也可以减少上线前设计走查、测试的工作量。
2. 形成一致的设计风格
根据原子设计理论,通过原子组件的一致性,可以构建出统一的界面框架、布局,形成统一风格和用户交互认知,从而更好地保证用户体验质量。
 
用户体验一致性思考
 
 
色彩
色彩作为一种兼具物理属性与感官享受的复杂现象,其本质在于光波在人体视网膜上的特定波长被反射或吸收后,所引发的视觉感知结果。在设计领域,色彩的选择与运用不仅是视觉艺术的展现,更是品牌身份与个性的直接体现。诸如饿了么标志性的蓝色、美团鲜明的黄色、以及京东热情的红色等,这些品牌专属色彩不仅构成了品牌识别系统的重要组成部分,还通过其高度的一致性,在视觉层面上构建起强烈的品牌认知,营造出统一和谐的视觉体验。
色彩的一致性策略在品牌塑造中发挥着不可估量的作用,它能够有效增强品牌的记忆度与辨识度,深化品牌形象在消费者心中的烙印,进而提升产品的市场吸引力和用户忠诚度。同时,这种策略还促进了设计元素间的和谐共存,包括按钮、图标、字体、标签、背景、以及关键视觉元素如Banner等,均能在统一的色彩体系下实现视觉上的连贯与流畅,极大地提升了产品的可用性、无障碍性,以及用户在使用过程中的整体满意度与交互体验。
 
用户体验一致性思考
 
 
字体
字体作为设计中不可或缺的核心要素,其独特性在于能够精准地塑造文字的视觉形象,涵盖形状、尺寸、粗细、字间距等多维度特征。这些特征共同构建了一种独特的文字风格,不仅承载着信息的传递功能,更在无形中引导着用户的视觉流程,影响着信息的接收与理解深度。因此,在设计过程中,合理选择与应用字体显得尤为关键。
 
字体类型的多样性,如有衬线字体与无衬线字体的对比,不仅体现了风格上的差异,还隐含了不同的阅读体验与情感表达。字体的粗细变化(如细体、常规、粗体等)更是能够强调文本的重要性层级,增强信息的层次感与可读性。此外,字重的调整也是塑造视觉焦点、引导视线流动的有效手段,对于提升设计的整体美观度和信息传达效率具有不可小觑的作用。
 
然而,在实际的开发与实现过程中,若不加节制地使用多种字体,不仅会显著增加页面的加载时间,影响用户体验的流畅性,还可能因风格不统一而导致页面显得杂乱无章,破坏整体设计的和谐感。因此,制定一套统一、规范的字体使用策略显得尤为重要。这不仅有助于提升开发效率,减少后期更新迭代的复杂度,还能有效避免资源浪费,确保设计作品在视觉上的一致性与专业性。
 
用户体验一致性思考
 
 
图标
 
图标作为用户界面设计中至关重要的元素,风格直接影响到用户的使用体验与对产品的整体印象。图标以其简洁、直观且富有表现力的特点,在快速传达信息、引导用户操作方面发挥着不可替代的作用。在设计中,图标的设计与应用更是需要精心考量,以确保其既能够准确传达信息,又能够与整体设计风格保持一致,从而营造出专业、和谐且易于使用的界面环境。
 
设计中视觉上保持统一包括图标的大小、形状、色彩以及设计风格等多个方面,能够增强用户的认知连贯性,降低学习成本,提升使用效率。相反,如果图标风格混杂,不仅会让界面显得杂乱无章,还会给用户带来困惑和不安,进而影响其对产品专业性和安全性的信任。
用户体验一致性思考
 
 
按钮
按钮设计应统一于项目风格,无论是圆形、矩形、圆角矩形还是特定形状,保持一致性是关键。统一的按钮样式不仅彰显专业性,还能增强用户信任,确保体验连贯。过多变化的按钮样式会扰乱用户界面,降低操作直观性,甚至让用户误以为自己已离开应用环境。因此,精心设计的统一按钮样式对提升用户体验至关重要。
 
排版
设计中的排版一致性对于构建高效、用户友好的界面至关重要。一致的排版不仅能够让用户快速适应和理解界面的整体结构,大幅降低学习成本,还能在用户心中激发强烈的归属感和安全感。这种熟悉感使得内容更加易读,用户能够自然地依照既定的视觉动线流畅地浏览页面,迅速定位并获取所需信息,从而显著提升信息获取的效率。因此,在设计过程中,注重并维护排版的一致性,是提升用户体验和界面有效性的重要策略之一。
 
 
用户体验一致性思考
 
 
 
操作流程的一致性
标准化流程:确保用户在执行相似任务时,如购买商品、搜索信息或提交表单等,能够遵循相同的操作流程。这有助于用户快速适应并高效完成任务。
逻辑清晰:操作流程的每一步都应符合用户的认知习惯和行为逻辑,避免让用户感到困惑或不知所措。
用户体验一致性思考
 
 
交互元素的一致性
按钮和控件:确保按钮、输入框、下拉菜单等交互元素的样式、位置和操作方式在整个应用或网站中保持一致。例如,所有按钮都应具有相同的视觉风格和触发机制。
导航和菜单:导航栏和菜单的设计也应保持一致,使用户能够轻松地在不同页面或功能之间切换。
 
用户体验一致性思考
 
 
反馈机制的一致性
操作反馈:当用户执行某个操作时,应用或网站应提供一致且及时的反馈,如加载动画、成功提示或错误消息等。这有助于用户了解操作结果并采取相应的行动。
状态提示:对于长时间运行的操作或需要用户等待的场景,应提供明确的状态提示(如进度条),以减轻用户的不确定感和焦虑感。
 
 
 
 
 
 
在任何维度上,一致性不应成为设计的唯一导向。设计,这一融合了艺术与科学的复杂领域,要求我们在用户体验的细腻雕琢、功能需求的精准满足、美学价值的深刻体现及技术可行性的严格考量间游走。
 
“一致性”作为设计策略,其核心使命在于优化用户路径,降低认知门槛,确保用户在多元界面中穿梭时仍能感受到连贯与和谐。当我们在与设计团队(包括工程师、产品经理等)沟通时,仅仅提及“一致性”可能并不足以说明其必要性和价值。我们需要更深入地阐述为什么需要保持一致性,以及它如何具体帮助减少用户困惑、提高用户满意度和忠诚度。
 
同时,我们应清醒认识到,“一致性”并不是万能的。在某些情况下,为了追求极致的用户体验或解决特定的设计问题,可能需要打破传统的一致性规则。因此,设计师需要在保持一致性和创新之间找到平衡点,根据具体情况灵活调整设计方案。
 
实际落地执行时,要根据产品定位、用户场景,结合业务功能来确定设计方案,不能为了一致而一致。
当我们遇到一致性问题时,还是需要从以下3个方面深入思考,做出准确合理的设计决策。
用户体验一致性思考
 
 
真实项目
真实项目
 
在SaaS产品设计中,特别是面向B/G端(企业用户)时,满足不同用户角色(如普通用户与高权限领导)的需求是至关重要的。
管理端布局设计
普通简洁明了:为普通用户设计的管理界面应简洁直观,聚焦于日常操作,如数据查看、统计和下载。
功能分区:通过清晰的导航栏或侧边栏将功能区域划分开,如“数据概览”、“报表下载”、“任务管理”等,便于用户快速定位所需功能。
操作便捷:确保常用操作(如搜索、筛选、排序)易于触达,减少用户点击次数和页面跳转。
 
首页版心定宽设计
固定宽度:为首页设定一个合适的固定宽度(如1200px、1440px等),以保证内容在大多数屏幕上都能保持一致的阅读体验。
信息模块化:将首页内容划分为多个卡片,每个卡片承载一个独立的信息单元(如数据报表、通知公告、项目进展等)。
视觉层次:通过颜色、大小、阴影等设计元素区分卡片的重要性,引导用户视线,提高信息获取效率。
交互性:为卡片添加交互元素,如点击展开、滑动查看更多等,增加用户参与度和页面活跃度。
 
用户体验一致性思考
 
 
位置差异性分析
根据「认知负荷>视觉负荷>动作负荷」理论,在页面中我们首先要让用户能够找到按钮,然后完成操作。
相对于弹窗,页面的空间更大,边界感偏弱,用户的视觉重心更容易停留在左侧表单内容区域。所以按钮应该紧随搜索条件,便于用户快速发现按钮。
区域用户已经形成下意识操作习惯,虽然区别于规范,只能打破,遵循客户需求
用户体验一致性思考
 
 
一致性是规则
“一致性”作为规则或手段,服务于提升用户体验的原则。规则与原则一致时,促进业务共识与用户价值;冲突时,原则优先。用户体验原则指导下的一致性,要超越表面控件统一,更在于产品决策与价值取向的一致。必要时,为更好的用户体验,可在规则上让步以实现原则统一。打破规则需慎重权衡,确保用户便利足以弥补理解成本,需长期全局考量。规则非僵化教条,而是引导我们谨慎创新的框架。
 
一致性的底线
无论从哪个角度,一致性存在的必要性都是毋庸置疑的。
对于关键的设计元素,如专有名词和颜色体系,保持一致性至关重要。这不仅有助于维护品牌形象,还能减少用户的困惑。
特定设计语言在特定场景下的变体应用,虽然可能带来一定的视觉新鲜感或针对性优化,但往往需要谨慎评估其潜在风险。一旦变体打破了整体设计的一致性,可能会破坏用户对品牌的熟悉感和信任感,甚至引发误解。因此,在追求设计创新的同时,必须确保这种创新是基于一致性的原则之上,以维持品牌的整体性和用户的良好体验。
 
拥抱复杂性
一致性确实不应成为设计师的避风港或限制创新的枷锁,而应是基于对业务深刻理解和多样化设计能力之上的价值选择。设计师的核心任务始终是满足用户的多样化需求和偏好,这需要他们细致入微地观察、理解并解决每个用户的独特问题。
 
在追求一致性的同时,设计师应保持“第一性思考”的能力,即回归问题的本质,从用户需求出发进行创新设计。多样性页面的产出,不仅体现了设计师的创造力和灵活性,也是提升用户体验、增强产品吸引力的关键。
 
一致性与创新设计并非相互排斥,而是相辅相成的关系。真正的一致性不应导致单调或拒绝创新,而应是在遵循品牌或产品核心价值的前提下,鼓励设计师在细节和体验上不断探索和突破。当设计师感到被既定规则束缚时,应勇于质疑并重新评估当前的规范,确保所谓的“一致性”不是刻板的伪命题,而是真正符合用户需求和品牌发展的价值导向。
 
因此,设计师应时刻保持开放的心态和敏锐的洞察力,不断探索和尝试新的设计方法和理念,以更加灵活和创新的方式实现一致性与用户需求的完美融合。
 
用户体验一致性思考
 
 
重要的设计原则
「一致性」作为设计领域中的一项基础性原则,其重要性不言而喻。它不仅为设计过程提供了稳固的基石,还显著促进了开发效率与产品体验的全面升级。在设计实践中,一致性确保了界面元素的统一性和连贯性,使得用户能够迅速熟悉并掌握产品的使用方式,降低了学习成本,增强了操作的直观性和便捷性。
灵活变通使用
一致性原则并非一成不变的强制规定,而是需要根据产品的具体定位和市场环境进行灵活变通的应用。不同的产品可能面向不同的用户群体,拥有独特的品牌调性和功能需求,因此在追求一致性的同时,也需充分考虑这些因素,确保设计既符合品牌特色,又能满足用户的实际需求。
 
提升用户体验是价值所在
一致性的真正价值在于其能够显著提升用户体验。通过遵循用户的认知和习惯,设计师能够创造出更加自然、流畅的操作流程,使用户在享受产品功能的同时,也能感受到品牌所传递的舒适与和谐。因此,在追求设计一致性的过程中,我们始终应以人为本,将用户的体验和感受放在首位。建设有兼容性和长期价值的的一致性框架,在一致性中做到有用户价值的设计,是设计师应该不断探索的命题。

作者:cheny米鱼
链接:https://www.zcool.com.cn/article/ZMTYzNTAzNg==.html
来源:站酷
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

交互设计的核心:用户体验与创新思维的融合

天宇 交互设计及用户体验

在数字化时代,交互设计(Interaction Design)已成为产品成功的关键因素之一。无论是移动应用、网站还是智能设备,优秀的交互设计都能为用户带来流畅、直观的体验。今天,我想和大家探讨交互设计的核心要素,以及如何通过创新思维提升用户体验。

1. 以用户为中心的设计理念

交互设计的核心是“以用户为中心”。设计师需要深入理解用户的需求、行为和痛点,通过用户研究、原型测试等方法,确保设计能够真正解决用户问题。例如,简洁的导航、清晰的反馈和一致的操作逻辑,都是提升用户体验的基础。

2. 创新与功能的平衡

在追求创新的同时,设计师需要确保功能的实用性和易用性。过度复杂的设计可能会让用户感到困惑,而过于保守的设计则可能缺乏吸引力。如何在创新与功能之间找到平衡,是每个交互设计师面临的挑战。

3. 情感化设计的力量

交互设计不仅仅是功能的实现,更是情感的传递。通过色彩、动画、音效等元素,设计师可以创造更具吸引力和情感共鸣的体验。例如,微交互(Micro-interactions)的巧妙运用,能够增强用户的参与感和满意度。

4. 跨平台与多设备的一致性

随着用户使用设备的多样化,跨平台设计变得越来越重要。设计师需要确保在不同设备和平台上,用户都能获得一致且无缝的体验。这不仅需要技术上的支持,更需要设计思维的全局观。

5. 数据驱动的设计优化

通过数据分析,设计师可以了解用户行为,发现设计中的不足,并持续优化产品。A/B测试、热图分析等工具,能够帮助设计师做出更科学的决策,提升产品的整体表现。

31.png

结语

交互设计是一门融合艺术与科学的学科,它需要设计师不断学习、实践和创新。无论是新手还是资深设计师,我们都应保持对用户需求的敏感,以及对技术趋势的关注。期待大家在评论区分享自己的见解和经验,一起探讨交互设计的未来!


希望能激发大家的讨论和思考!如果你有更多想法或案例,欢迎留言交流

 

 

小功能大细节|掌握选择控件设计

天宇 交互设计及用户体验

 

我们UI设计师在界面设计的时候经常会使用到单选按钮、复选框、开关这些选择控件,它们是设计中经常会使用到的让用户进行选择的控件。尽管它们在用户界面中是常用的组件,但设计师、产品经理在为他们的任务选择合适的组件时,仍然会有很多现实的麻烦,而我们则需要更认真地探究其中的细节。
良好的掌握每个组件的使用场景,可以更加积极的帮助用户体验产品。本文通过结合实际案例与思考,与各位分享这类选择控件在web端的使用逻辑与细节差异,希望能对设计工作带来一定的指导意义。
 
你是否有这种困惑?
当我们需要用户在两个选项中选择一个选项时,在这种情况下可以使用三种控件:单个复选框、两个单选按钮或者开关,那么我们应该如何做出抉择呢?
感觉似乎使用Radio单选按钮、Checkbox复选框和Switch切换开关这三个组件好像都是可以的。下面文中会对于这三个组件的基本特点、使用准则,以及常见场景等的探讨来告知设计师们该如何去做出正确的选择。
 
小功能大细节|掌握选择控件设计
 
 
 
要搞清楚这些组件的使用问题,我们需要来了解一下这些组件的由来与用法场景。
 
小功能大细节|掌握选择控件设计
 
 
 
选择控件(Selection Control):是一种供用户选择不同选项的,常用于表单、设置页等。它一般分为三类:单选按钮(Radio)、复选框(Checkbox) 和开关(Switch)。
 
小功能大细节|掌握选择控件设计
 
 
 
一、选择控件的由来与用法
不论是单选按钮、复选框还是开关,他们都能在现实世界中找到事例。这些组件是将现实生活中的事物映射反应到界面设计中,使得用户可以更加简单高效地理解他们本身所代表的交互含义,通过官方定义的“建议”用来指导标准化使用。
 
小功能大细节|掌握选择控件设计
 
 
 
二、选择控件的差异
单选按钮、复选框、开关组件它们都具有不同的时效性。
 
小功能大细节|掌握选择控件设计
 
 
 
单选按钮/复选框本质上只是变输入为选择的快捷方式,当需要用户输入的内容只有几种固定的格式时,可以通过变输入为选择,这样不仅节约时间,也能避免输入出错,但这需要提托页面中的其他触发组件来保存和执行这样的操作。开关这类组件被点击后会立刻执行,并触发界面或系统中可明显被用户感知到的某些变化。
 
小功能大细节|掌握选择控件设计
 
 
 
小功能大细节|掌握选择控件设计
 
 
 
如何才能正确的选择合适的控件,这就需要从了解每一个组件开始。
 
一、 Radio 单选按钮
1. 了解单选按钮按钮的由来
单选按钮(Radio)最早的设计模型来源于老式收音机上用于频率和预设电台之间切换的物理按键。当其中一个按键被按下时,所有其他的按键都会被弹出,被按下的那个按键就成为了唯一一个处于“按下”状态的选中按钮。
单选按钮将这一物理特征进行了隐喻设计,是一种泾渭分明的表现。
但是感觉这样的说法可能有些不严谨。从物理世界演化到UI后,这个组件有了交互上的变化,UI设计中的单选按钮功能只是录入内容,并不立即执行,而收音机的物理按键却能立即触发(换台)操作,所以单选按钮的使用是在不断的演变中发展变化着,未来也许还有新的改变。
UI概念是由Xerox PARC的研究首次引入的,它是一家研发公司,应用业务涉及到常用的计算机技术,包括:以太网、图形用户界面、编程、鼠标等。Xerox Star 8010工作站是第一款在图形用户界面中带有单选按钮的设备。
 
小功能大细节|掌握选择控件设计
 
 
 
2. 单选按钮的特点
单选按钮是将所有信息条件暴露给用户,它不像开关在使用上带有猜测、探索的必要。
1)
标识性:单选按钮通常以圆形图标的形式呈现,旁边附有文字说明,用于表示选项的内容。这种设计使得单选按钮易于用户识别和操作。
2)
互斥性:仅允许用户在一组选项中选择其中一项。
3)
直观性:每个单项选择都非常直观,它会公开所有可用选项,用户能够一眼看到所有可用的选项并做出选择。如果希望用户明确阅读完所有选项,则最好使用单选按钮。
4)
拓展性:单选按钮的拓展性更强,相对于复选框、开关的布尔值,单选按钮能承载两个或两个以上的选项。
5)
默认值:单选会提供默认值选项,且默认值可以承载具体内容。
 
3.
单选组件的用法准则
单选按钮是主要用于两个或更多选项列表的选择器,列表中的所有选项是相互排斥的,用户必须清楚准确地选择一个选项。
1)当用户点击一个未选择的单选选项时,它将取消选择先前选择的任何其他选项。
2)要为用户提供默认选项,确保它对于用户来讲是最安全或者最可能的选项。
3)选择较少的情况下使用单选按钮组件更好,但选项一旦较多,例如七八个的时候就不太适合一一展开,这会占用很多空间,因此将选项收起来放在下拉选单里会比较合适。
4)清楚表明单选按钮各个状态,才能使用户更明确使用,达到设计目的。
 
小功能大细节|掌握选择控件设计
 
 
 
4. 案例场景分析
1)让用户明确知道单选、复选的区别,强调各个选项的不同
不同的选项内容,如果采用复选框,用户需要在两个差距较大的选项中去思考,延长考虑时间,使得用户更为焦躁。
 
小功能大细节|掌握选择控件设计
 
 
 
2)开启/关闭的单选状态,建议使用复选框
复选框对于绝大多数用户都是非常清楚,复选框对于在空间、视觉焦点上使用更为集中,如果只针对开启/关闭的单选状态,则不建议选择单选按钮,推荐使用复选框。
 
小功能大细节|掌握选择控件设计
 
 
 
3)每个选项都关联内容时,使用单选按钮
如果默认选项内容设计的好,会让更多人保持选择默认选项。
在表单设计中一个不错的默认选项,会让很多人保持选择默认选项,提升表单操作效率。下图案例如果采用复选框或者开关控件,用户就不得不去思考开启后是什么,还要担心理解开启/关闭后带来的影响,但对于绝大多数用户来说,系统默认内容无需改动,给用户提供的默认选择,一般是安全、方便的选项。
 
小功能大细节|掌握选择控件设计
 
 
 
4)较长需隐藏拆分的内容情况,使用单选按钮
在界面设计中,如果遇到的内容需要重新组织或者拆分时,选择使用单选按钮组件。不仅能够做到信息简洁,也能够提高用户的浏览效率。
 
小功能大细节|掌握选择控件设计
 
 
 
5)垂直排列单选,信息阅读更佳
如果选项文字名称较长,需要添加说明,这时单选组件承载的信息较多,同时使用垂直排列的方式能让用户有一致的阅读浏览方向,眼球动线移动幅度较小,信息获取体验更佳。如果选项文字较少,也可横排不占用太多的垂直空间。
 
小功能大细节|掌握选择控件设计
 
 
 
6)提供默认选项,保持视觉分量相同
单选按钮总是默认选中一个选项,不应该展示没有默认选择的单选组件。这个规则的唯一例外情况是在使用单选按钮进行用户问卷选择时,使用单选按钮在所有选项列表中要有相同的视觉分量,使用户从列表中选择任何选项的可能性是相等的。默认被选中的单选框设计可以为用户提供明确的建议。默认的选项可以引导用户做出最佳选择,并增强他们继续完成任务的信心。
 
小功能大细节|掌握选择控件设计
 
 
 
7)明确的可交互区域,让用户易于操作
单选按钮、复选框是UI设计中最小的交互式元素之一,因此它们需要有一个易于访问的点击区域。单选组件交互操作时需要让用户不仅通过单击或点击该小控件,还可以单击标签相关联的文本来选择一个选项,确保用户可以单击单选控件或标签文本上的任意一个选项时都易于操作。
 
小功能大细节|掌握选择控件设计
 
 
 
8)所有的选项要对齐
单选按钮不应该有什么子选项,单选按钮的设计初衷是让用户在多个选项中选择一个,而不是在一个选项内部进行进一步的选择。单选按钮通常与RadioGroup一起使用,用于将多个单选按钮组合为一组,确保同一组内的单选按钮只能有一个被选中。错误的排列会让用户感到困扰,所有的选项要对齐放置在同一层级。
 
小功能大细节|掌握选择控件设计
 
 
 
9)选项小于等于5个,可使用单选按钮
当选项小于5个,应考虑使用单选按钮,
用户可以不需要任何点击或输入操作即可马上浏览所有选项并直接点击选择出来。
 
小功能大细节|掌握选择控件设计
 
 
 
10)选项只有且必须一个时,使用单选按钮
当选项只能选择一个,且必须选择1个时,应使用单选按钮。
 
小功能大细节|掌握选择控件设计
 
 
 
11)单选项确保选项既全面又互斥
如果无法保证全面,需提供“其他”选项,比如在婚姻状态里,除已婚、未婚外,如果你不知道还有别的什么状态,最好提供“其他”选项作为补充,否则诸如离异、丧偶等情况会无法使用该系统。
 
小功能大细节|掌握选择控件设计
 
 
小功能大细节|掌握选择控件设计
 
 
 
二、 Checkbox 复选框
1. 了解复选框组件
复选框的物理原型来自于纸张上的多选题,例如餐厅的菜单,选多选少互不影响,并且用户倾向于用✅这个符号来勾选,这个符号从古代商号记流水账核查到现在教师批阅作业的“对勾”,无一不表示着“正确、认可”。它代表的是一种选择,而现实中的多选题,往往是非时效性的,勾选之后不会立即生效。
 
小功能大细节|掌握选择控件设计
 
 
 
复选框既可以是单个选项,也可以是可供选择的一组选项。当用户可以选择任意数量的选项,包括零个、一个或几个时可使用复选框组件。集合中的每个复选框都独立于其他所有复选框,因此选中一个复选框不会对其他复选框产生任何影响。而复选框让用户在两个选项之间进行选择,勾选后和未勾选表示则可表示“是/否、要/不要、开启/关闭…” 等结果,准确的使用复选框也需要认清复选框的各种状态,才能更好的表示选项意义。
 
小功能大细节|掌握选择控件设计
 
 
 
2. 复选框的特点
1)直观性:每个复选框通常由一个方框和一个标签组成,标签用于描述选项内容,用户可以通过点击方框来切换其选中状态。
2)非互斥性:复选框通常用户表示一组非互斥的选项,即选择一个不会影响其他选项状态。
3)多选性:复选框允许用户从一组选项中选择一个或多个,与单选按钮不同,复选框的选中状态是独立的,选项之间相互独立且相关,用户可以同时选中多个复选框。
4)公开性:复选框可公开所有可用选项,用户一眼能够看到所有可用的选项并做出选择。
5)灵活性:复选框可以用于多种场景,如在线调研、注册表单等,能够提高用户体验和效率。
3. 复选框的用法准则
1)为了方便用户快速理解,复选框的选项内容一般是一句话,不用逗号隔开。
2)父级复选框允许快速便捷选择或取消选择所有项目。
3)复选框表示状态,用户可以延迟提交的交互操作。
4)复选框作为单选状态时,操作对象和选项主体内容视觉焦点是不分开的,选择后就知道被选中了(比如登录页面中的用户需知)。
5)复选框也可直接表示选项内容的开启、关闭。
 
4. 案例分析
1) 使用复选框代表用户清楚会发生什么
如果使用单选或开关,会发现视觉干扰特别严重,一般表单内容不需要特别去强调每一个选项的开启关闭状态。如果排版受限制,可以将复选框放到标签的右侧对齐。
 
小功能大细节|掌握选择控件设计
 
 
 
2)复选框的标签文本要措辞主动
使用复选框,要保证选项后标签文本的措辞积极主动,而不是否定的。这将帮助用户理解如果打开复选框会发生什么。
 
小功能大细节|掌握选择控件设计
 
 
 
3) 提前告知用户,提示消息可减少复选框错误选择概率
如果用户必须从列表中选择一些选项,您应该在用户开始执行之前告知用户,通过显示提示类似“您应该至少选择X个选项”的消息,来减少用户复选框错误选择的机率。
 
小功能大细节|掌握选择控件设计
 
 
 
4)复选框生效需配合提交按钮
一般情况下,复选框不会像开关一样点击后立即生效,它需要配合提交按钮生效。所以用户在提交前可查看选择的内容是否正确,更有助于信息防错。如果在设置页面,复选框也可单独作为设置且立即生效。
复选组件的选项信息和复选框在一起,特别是对于批量填写或设置多个字段,使用复选框效率更高。
 
小功能大细节|掌握选择控件设计
 
 
 
5)用复选框控制表单局部细节
如果控制对象的功能是表单页面的一个局部或信息内容不多,用户也清楚了解选择后是什么,这种时候复选框更适合。我们不需要过重的给用户强调是什么,用复选框比使用开关能使得表单结构内容更清晰。
 
小功能大细节|掌握选择控件设计
 
 
 
6)多选项使用复选框
在表单中,同个问题中提供多个选项时,使用复选框。勾选能直接表明“要”或“不要”。
 
小功能大细节|掌握选择控件设计
 
 
 
7)有且只有一个明显选项时,用复选框
只有“选择”或”取消选择”一个显而易见的选项时,更适合使用复选框。
 
小功能大细节|掌握选择控件设计
 
 
 
8)存在父子嵌套关系的分组,多选项能清晰表达中间选择状态。
未全选中中间状态表示在列表中选择了多个子选项(但不是全部),这时,开关按钮不能表示部分选项被选中的状态,单选按钮亦不能表示嵌套关系。
 
小功能大细节|掌握选择控件设计
 
 
小功能大细节|掌握选择控件设计
 
 
 
三、 Switch 开关
1. 了解开关组件
开关组件是现实生活中仿照物理开关按钮在界面设计中的映射,提供了两种最简单、直接的对立选项,比如开/关、启动/禁用等。它就像生活中控制灯泡的开关,当我们去操作开关时,灯泡会点亮或者熄灭,会对事物立即产生影响。它的意符必须明确,不然用户不知道即将要启动或者关闭什么
小功能大细节|掌握选择控件设计
 
 
 
在界面设计中,开关也同样具备即时触发的特性,如打开Wi-Fi、开启暗黑模式等,
由于开关具备很明显的在用户心中扎根的隐喻心智,相较于复选组件而言,操作前后的状态更明显,感知更强烈。
开关组件提示用户在两个互斥选项中进行选择,并且总是有一个默认值。当用户必须回答是或否问题和二进制操作,如启用或禁用特定设置时,它是最合适的组件。开关组件也属于双态按钮,是指有开和关两个两种状态,是在两个状态之间切换。
 
小功能大细节|掌握选择控件设计
 
 
 
在使用开关组件时要注意需要提供足够的视觉反馈,告知用户什么状态下是开着的。
 
2. 开关组件的特点
1)直观性:开关切换组件的设计通常很直观,开关主体选项信息和开关组件是分离的,两个视觉焦点,用户可以通过滑动滑块来改变状态,而不需要阅读额外的说明和标签。
2)二元性:开关切换组件表示两种相反且互斥的状态,通常多用在表示“开启/关闭”,主要在选项中来回切换,这种二元性使得它非常适合于需要明确状态切换的场景。
3)及时性:当用户操作开关时,相关的功能和设置会立即给予用户反馈,无需额外的确认步骤。
4)易用性:开关组件简单易懂,即使技术不太熟悉的用户也能快速学会如何使用。
5)可访问性:现在的开关设计考虑到可访问性,确保所有用户,包括有视觉或运动障碍的人,都能方便地使用。
3. 开关组件的用法准则
1)当用户点击一个开关时,其对应的动作立即生效。
2)由于开关显示实际状态,所以有时状态变化会有延迟。在这种情况下,可使用"处理中"的状态动画,减少用户焦虑。
3)开关组件没有hover效果,有动作效果,用手指的切换更容易,这个组件非常适合应用于移动设备。
4)避免使用开关控制局部细节或者次要的设置,开关的视觉权重比较高,所以用它控制内容较多更为合适,比如可以将它作为总开关打开或关闭一组设置。
5) 通常不要用开关替代复选框,如果在规范中定义了复选框,则尽可能保持一致的使用规范。
6)对象名称要传达清晰,让用户能够明确感知操作后的动作开启或关闭什么。
7)拨动开关的滑块后如果状态切换失败,要马上弹回来。
8)开关的规范做法是滑块在左为“关”状态,在右边为“开”。
9)由于开关会立即执行,所以若是危险的操作需要用户再次确认。
4. 案例场景分析
1)开关的文本内容意思需传达清晰开关主体的信息和按钮是分离的,和单选、复选框不一样。
用户在点击开关按钮前,必须清晰告知用户点击后会发生什么,有时需要通过增加副标题文字内容来加以说明。
 
小功能大细节|掌握选择控件设计
 
 
 
2)立即生效的场景一般使用开关组件
在表单填写时,往往最终会有「提交」按钮作为结束态,开关作为表单字段的填写,用户点击后并不能够立即生效,而是需要再次点击「提交」按钮,这样处理会让开关的特点所滞后。所以开关组件应该提供即时生效的结果,它们不应该要求用户单击保存或者提交按钮来应用新状态。
 
小功能大细节|掌握选择控件设计
 
 
 
3)着重提醒用户有风险
开关的视觉权重较高,在复杂的表单信息中,它能够快速吸引用户注意力,给用户以视觉提醒。
 
小功能大细节|掌握选择控件设计
 
 
 
4)避免大面积使用开关,可使用它控制局部细节或者次要设置
开关在视觉感知上和按钮有些接近,所以尽可能避免在表单中大量使用开关来控制局部层级内容,推荐使用复选框来替代开关作为局部内容控制。
 
小功能大细节|掌握选择控件设计
 
 
 
5)作为高层级内容控制或信息设置
开关作为总控制来显示更高层级内容,避免web表单中过多使用开关按钮,会和其他的基本组件造成视觉干扰。少量使用既凸显其重要性,又能提升用户浏览表单的效率。
 
小功能大细节|掌握选择控件设计
 
 
 
6)避免写“开启/关闭”带动词含义的字在组件上
如果要将说明文本放在按钮里面,它们会让人搞不懂是表示当前状态还是表示切换后的状态,此时如果图形本身状态辨认度较低,就会使这个问题尤为严重。所以,在设计开关时,一定要分别用艳丽和暗淡的颜色来表示开和关状态。
 
小功能大细节|掌握选择控件设计
 
 
 
7)语序和状态要一致
用户有可能不知道当前点击状态到底是开启还是关闭。我们可以使用文案辅助来清晰地传达意图和反馈。如以下场景,在文案中添加【开启】二字结合开关按钮使用,能有效减少用户对于按钮与文案之间关系的思考。请勿使用文案是“关闭”作为开启的语序,增加理解成本。
 
小功能大细节|掌握选择控件设计
 
 
小功能大细节|掌握选择控件设计
 
 
 
 
小功能大细节|掌握选择控件设计
 
 
 
1. 单选按钮、复选框、开关组件在正确使用时需特别注意哪些?
1)选择控件的已选状态应该要比未选状态更加醒目。
2)我们把选择控件所代表的内容称为标签,标签文本都应该简洁易懂,
避免使用否定词汇,否则用户还需要绕弯理解。开关标签被误解尤为常见,如“请勿打开”、“补光灯关闭“、“延时关闭”这些都是不好的,它们都有否定词。
3)把控件图标+文字一起作为可点击区域,会使用户操作更方便。
2. 明确清楚单选按钮、复选框、开关各组件的使用方法,才能设计出更加好用易用的产品。
1)单选组件承载的信息量较多,如果希望用户对比感知到两者信息的明显不同,那么推荐使用单选组件。
2) 复选框组件适用和拓展性极强,即可以单独作为设置使用,也不用配合其他提交按钮作为表单填写的一部分。
3)开关在表单结构、各种控件内容较多时,需要页面清晰、避免过多的视觉突出,所以尽量避免让无数个开关组件在表单中使用。
理论只是指导实践的一部分,上述内容方法可能只在用户认知和易用性之间,找到一个相对平衡点,在未来的设计中具体的使用场景情况,还是要具体问题具体分析。
 
小功能大细节|掌握选择控件设计
 
 
文中主要概括总结了单选按钮、复选框、开关的使用规范及案例。设计规范只是基于产品本身建立的一个标准,为了保持后续视觉统一而提供规范化的参考。
在实际的工作设计中,设计规范主要起到指导作用,每个产品需要根据各自的属性特点和使用场景进行灵活调整,让组件规范个性化匹配自身产品的特点。
设计规范只是设计执行中一个基本准则和使用标准,遵循的同时既要根据各产品中不同的设计细节,查缺补漏、迭代优化,将产品亮点与规范达到一种平衡,在标准的基础上突出自身产品特点,让其更具有优秀的代表性。以上总结如果不妥之处,望大家交流指正,一起探讨学习。
 


作者:七色荧火
链接:https://www.zcool.com.cn/article/ZMTYzNTM4NA==.html
来源:站酷
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
 

用户界面优化的实用技巧与案例分享

ui设计分享达人 交互设计及用户体验

在用户界面设计中,即使是一些微小的调整,也能大大提升用户体验和用户的参与度。最近,我和一位学生一起优化了一款移动应用的界面设计。虽然最初的设计已经有了不错的基础,但还缺少让人眼前一亮的层次感和视觉吸引力。经过一些简单的调整,我们让设计变得更好用、更美观。在这篇文章中,我会分享设计前后的对比,并详细讲解我们具体做了哪些改动。
小调整,大提升:用户界面优化的实用技巧与案例分享
 
 
从个人资料页面的设计开始,我注意到它的布局简洁而有条理,但有几个问题让人感觉有些平淡:
  •  
    缺乏视觉层次:所有元素都有相似的视觉权重,这让用户很难快速识别最重要的操作。
  •  
    按钮样式:推荐和奖励 "按钮与布局的其他部分融为一体,失去了成为焦点和引导用户互动的机会。
  •  
    深度和间距:阴影和色彩对比的缺失造成了设计的扁平化,影响了可用性和导航功能。
 
微小改动带来的变化
小调整,大提升:用户界面优化的实用技巧与案例分享
 
 
以下是我们如何改进个人档案页面以及使其更加生动的具体调整:
  •  
    增强视觉层次:我们为 “推荐和奖励 ”按钮添加了明亮的蓝色背景并略微抬高,使其成为明确的焦点,鼓励与这一关键功能进行互动。
  •  
    改进间距和分组:调整元素之间的间距并对相关项目进行分组,使布局更有条理,帮助用户区分 “设置与偏好 ”和 “支持 ”等部分。
  •  
    使用图标和排版:我们对图标和排版进行了改进,使外观更加简洁。图标有了更多的空间,文字样式强调标题而不是副标题,使内容更易于扫描。
分析主页设计
小调整,大提升:用户界面优化的实用技巧与案例分享
 
 
现在,让我们来看看应用程序的主页。设计看起来还可以,但感觉很平淡,而且不容易浏览。原始布局的主要问题是
  •  
    视觉清晰度:设计扁平,更像是一个线框,地图图像在视觉上无法吸引用户。
  •  
    内容分组:元素的样式千篇一律,使界面感觉单调。最近地点 “和 ”交通更新 "等关键部分缺乏差异化。
  •  
    互动元素:天气警报 "等互动元素并不突出,可能会让用户对可操作的项目感到困惑。
改进主页
我们对主页进行的调整提高了可用性和参与度:
  •  
    突出行动区域:主页“、”工作 “和 ”收藏夹 "等主要按钮采用了独特的图标和间距,使常用部分易于定位。
  •  
    地图增强:对比度更强、更生动的地图,加上微妙的高低起伏,成为一个明显的焦点,同时又不会喧宾夺主。
小调整,大提升:用户界面优化的实用技巧与案例分享
 
 
  •  
    内容区分:将 “公共交通 ”和 “交通更新 ”等关键部分与对比鲜明的背景进行分组,提高视觉扫描效果。
  •  
    强调警报:交通和天气警报用独特的颜色和图标来吸引用户的注意力,帮助用户快速识别关键信息。
小调整,大提升:用户界面优化的实用技巧与案例分享
 
 
在设计中应用这些概念
如何将这些设计策略应用到你的项目中?以下是一些提示:
  •  
    确定关键元素:首先要明确哪些元素需要强调。建立一个视觉层次,突出关键操作--比如个人资料页面上的 “推荐和奖励 ”卡片。
  •  
    对类似元素进行分组:将类似的项目组织成不同的部分,如将个人资料信息与 “推荐和奖励”、“设置 ”和 “支持 ”进行分组,使布局更加直观。
  •  
    添加描述性小标题:小标题可提供清晰度,通过明确标注内容和引导用户完成选项来增强用户体验。
  •  
    使用颜色层次和对比:选择对比鲜明的颜色来营造视觉上的区别,例如使用浅蓝色背景搭配深蓝色图标,营造出协调而醒目的效果。
  •  
    小窍门:开发一个调色板,每种颜色的色调从 100 到 950 不等,以确保各元素之间的灵活性和一致性。
增强定位页面设计
让我们利用这些经验来改进下面的设计:
定位页面给人的感觉有点平淡,所以我们要努力让它更吸引人。与其使用图片,不如尝试使用图标,使整个用户界面的设计保持一致。通过添加多个部分来调整布局,也有助于组织内容,使导航更容易。
小调整,大提升:用户界面优化的实用技巧与案例分享
 
 
最初的调整会让版面看起来更有条理,但可能还是会让人觉得缺乏个性。首先,我让 “固定位置 ”部分更加紧凑。
小调整,大提升:用户界面优化的实用技巧与案例分享
 
 
然后,我设计了一个调色板,以增加独特性和个性。
小调整,大提升:用户界面优化的实用技巧与案例分享
 
 
在调色板中,选择四种搭配得当的重点色调。较浅的色调(如 50 号色调)可用于背景,而较深的色调(如 400 号色调)则可突出前景元素。
小调整,大提升:用户界面优化的实用技巧与案例分享
 
 
以下是 “地点 ”页面的最终设计,展示了设计前后的对比:
小调整,大提升:用户界面优化的实用技巧与案例分享
 
 
设计师的主要收获
  •  
    小改动,大影响:对间距、对比度和深度进行简单调整,就能显著提升用户体验。
  •  
    考虑视觉层次:利用颜色、大小和位置在界面中创造自然的流程,引导用户进行重要操作。
  •  
    创造深度和焦点:即使是增加微妙的深度,也能让界面看起来更精致、更专业、更直观。


作者:马克笔设计留学
链接:https://www.zcool.com.cn/article/ZMTY0OTA3Mg==.html
来源:站酷
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

AI 时代下,交互设计师要掌握哪些能力?

蓝蓝设计的小编

在 AI 技术迅猛发展的当下,交互设计领域正经历着深刻变革。交互设计师要想在这个新时代站稳脚跟并有所建树,需要掌握一系列与时俱进的能力。
对 AI 技术的理解与运用能力是基础。交互设计师不必成为 AI 技术专家,但要深入了解 AI 的基本原理、应用场景和局限性。例如,了解自然语言处理技术如何实现智能语音交互,图像识别技术怎样用于图像搜索和分类等。只有这样,才能将 AI 技术巧妙融入交互设计中。比如设计一款智能客服界面,设计师了解 AI 的对话逻辑后,就能优化界面布局,合理展示 AI 给出的回答,同时设计方便用户反馈和纠错的入口,提升用户与智能客服交互的流畅性。
 
用户洞察能力的深化至关重要。AI 时代,用户对交互体验的期望更高,他们渴望更个性化、智能化的服务。交互设计师要借助 AI 工具,如大数据分析、用户行为监测等,更精准地洞察用户需求和行为模式。通过分析用户在 APP 中的浏览历史、操作习惯等数据,挖掘用户潜在需求,进而设计出更贴合用户心意的交互流程。比如在一款音乐 APP 中,依据 AI 分析用户的音乐偏好,为用户精准推送个性化的歌单,提升用户的使用满意度。
 
跨学科协作能力不可或缺。AI 项目往往涉及多个领域的专业知识,交互设计师需要与 AI 工程师、数据科学家、产品经理等紧密合作。在协作过程中,要能够清晰表达自己的设计理念,理解其他专业人员的技术语言和工作内容。例如在开发一款智能驾驶座舱交互系统时,交互设计师要与工程师沟通,确保设计的交互界面符合车辆的技术架构和安全标准,同时向产品经理阐述设计方案如何提升用户体验,共同打造出优秀的产品。
创新设计思维能力是关键。AI 为交互设计带来了无限可能,设计师要敢于突破传统思维模式。例如,基于 AI 的情感识别技术,设计出能根据用户情绪变化调整界面风格和内容推荐的产品。或是利用 AI 生成式设计,快速探索多种设计方案,从中找到创新的交互形式,为用户带来前所未有的体验。
数据素养能力也不容忽视。交互设计师要学会分析和解读数据,通过数据评估设计方案的优劣。例如,通过 A/B 测试数据,了解不同交互设计方案下用户的转化率、留存率等指标,以此为依据优化设计。同时,要能从数据中发现问题和趋势,为设计方向提供数据支持。
 
在 AI 时代,交互设计师只有不断提升自身能力,融合技术与设计思维,才能创造出更具价值、更符合用户需求的交互体验,在行业中保持竞争力。

ui设计公司教你从0认识交互设计

蓝蓝设计的小编

交互设计是很多设设计师心向往之的领域,很多设计师在进入职场一两年后,会开始思考如何转型交互设计师?除了这个学科本身的魅力之外,它还赋予设计师的很多其他价值。那如何去学习交互设计呢?作为一名交互设计师,我想整理一套交互设计体系知识,结合自己的学习和项目经验写到文章中分享给大家看,希望能对大伙转行交互设计有一些些帮助!全文多达10000+字,阅读时间会比较久,感谢你的细心阅读,如你有建议可反馈留言!

 

 

 

 

 

 

 

 

1、关于设计名词

 

在全面走进交互领域之前,我们可以先了解一些基础设计名词,行业有很多与设计相关的术语名词,例如UI、GUI、UE/UX、HMI、HCI、HF、IXD、ID、VD等等。行业招聘信息里也经常会有很多名词术语,如下图。由于设计的关联性很强,很多时候我们被这些名词弄得头晕,对自己的职业规划和定位也变得模糊。

 

 

 

 

 

1.1、设计名词的分类

 

1.1.1、按照设计学科

 

从学科角度,我查阅了大量的资料,分类如下:人因工程,工业设计,交互设计,用户体验设计,视觉传达设计等学科。涵盖了国内外高校开设的学科专业。用户体验设计在行业里已经被普及,但目前在高校中还是比较少的。不过用户体验设计已然是大势所趋,越来越被重视。

 

 

人因工程:简称HF(Human Factors Engineering),是研究人、机、环境三者之间关系的学科;(美国称人类工程学,西欧称人类工效学,日本称人间工学,国内命名更多如:人机工程学,人体工程学、工程心理学等),关于这类知识大家可以看看华为设计师的课程《基于人因的用户体验设计课程》

 

 

定义1:根据国际人类工效学学会于2000年的定义:“人类工效学(Ergonomics)是研究人在某种工作环境中的解剖学、生理学和心理学等方面的各种因素;研究人和机器及环境的相互作用;研究在工作中、生活中和休息时怎样统一考虑工作效率、人的健康、安全和舒适等问题的学科。

 

 

定义2:中国企业管理百科学全书:研究人和机器、环境的相互作用及其合理结合,使设计的机器和环境系统适合人的生理心理等特征,达到在生产中提高效率、安全、健康和舒适的目的。

 

 

工业设计:简称ID(Industrial Design),指以工学、美学、经济学为基础对工业产品进行设计;工业设计又称工业产品设计学,工业设计分为产品设计、环境设计、传播设计、设计管理4类。工业设计涉及到心理学,社会学,美学,人机工程学,机械构造,摄影,色彩学等。

 

交互设计:简称IXD(Interaction Design),关于交互设计部分的详细内容,在后文再讲解,包括交互设计的发展、概念、重要性、核心要素、入门要求等;

 

人机交互:简称HCI(Human–computer interaction)或HMI(Human–machine interaction),是一门研究系统与用户之间的互动关系的学问。系统可以是各种各样的机器,也可以是计算机化的系统和软件——摘自维基百科。

 

用户体验设计:简称UED/UXD(User experience Design),是以用户为中心的一种设计手段,以用户需求为目标而进行的设计;用户体验:简称UE/UX(User experience)

 

视觉传达设计:简称VD(Visual design),是为传播特定事物通过可视形式的主动行为。大部分或者部分依赖视觉,并且以标识、排版、绘画、平面设计、插画、色彩及电子设备等二度空间的影像表现;

 

1.1.2、按照载体媒介

 

用户界面:简称UI(User Interface),是指对软件的人机交互、操作逻辑、界面美观的整体设计;是系统和用户之间进行交互和信息交换的媒介,它实现信息的内部形式与人类可以接受形式之间的转换

 

图形用户界面:简称GUI(Graphical User Interface),是指采用图形方式显示的计算机操作用户界面;是一种人与计算机通信的界面显示格式,允许用户使用鼠标等输入设备操纵屏幕上的图标或菜单选项,以选择命令、调用文件、启动程序或执行其它一些日常任务。

 

人机界面:简称HMI(Human–machine interaction),人机界面(又称用户界面或使用者界面)是系统和用户之间进行交互和信息交换的媒介, 它实现信息的内部形式与人类可以接受形式之间的转换。凡参与人机信息交流的领域都存在着人机界面。ps:HMI这个概念在上文也提到,在学科领域可用来代表人机交互。

 

Ui和GUI、HMI差别是什么,UI (用户界面)是一个广泛的概念,包括硬件和软件设计,包括GUI,HMI;GUI是用户图形界面,仅指软件视觉界面,HMI是人机界面,与人信息交流的界面。

 

1.1.3、按照设计模式

 

以用户为核心的设计:UCD(User Centered Design)是指以用户为中心的设计。是在设计过程中以用户体验为设计决策的中心,强调用户优先的设计模式;在进行产品设计、开发、维护时从用户的需求和用户的感受出发,围绕用户为中心进行产品设计、开发及维护,而不是让用户去适应产品。无论产品的使用流程、产品的信息架构、人机交互方式等,以UCD为核心的设计都时刻高度关注并考虑用户的使用习惯、预期的交互方式、视觉感受等方面。

 

以技术为核心的设计:TCD(TechnologyCentered Design)是指以技术手段为中心的设计。

 

以商业为核心的设计:BCD(Business Centered Design)是指以商业价值为中心的设计。

 

 

设计名词整理的大致就介绍这么多了,那么本文重点的交互设计和这些学科之间的关系又是怎么样的呢?用下图这个图表展示他们之间的关系。——摘自 丹•塞弗《交互设计基础》

 

 

 

 

 

 

 

 

2、了解交互设计

 

2.1、交互设计的故事

 

1959年,第一篇关于人机页面的文章问世,交互设计首以人机交的形式,作为填补缺乏适用于设计数字产品的可用技术和工具出现;1960年,Liklider通过分析人与电子计算机之间合作互动的一种预期发展,提出“人机共栖”概念;20世纪80年代初:两位工业设计师比尔·莫格里奇和比尔·韦普朗克着手设计第一台笔记本电脑GRiD Compass,他们为自己的工作创造了“交互设计”一词;这个词在10年后才开始被设计师重新发现并进入主流;1999年,国际标准化组织(ISO)发布了“以人为中心”的交互式产品设计原则和程序规范;2005年交互设计协会(IxDA)成立;2012年IxDA正式推出首次年度“交互设计奖”,交互设计才算是正式起飞。

 

 

 

 

 

 

 

 

2.2、交互设计的定义

 

关于交互设计的概念,国内外组织或学者有不同的定义,如下图:

 

 

 

 


交互设计,又称互动设计(Interaction Design, 缩写 IxD 或者 IaD),是定义、设计人造系统的行为的设计领域。在于定义人造物的行为方式(the “interaction”,即人工制品在特定场景下的反应方式)相关的界面。——来自IxDC

 

交互设计是设计交互式数字产品的、环境、系统和服务的实践,交互设计的焦点是如何设计行为,交互设计的首要目标是满足人的需求和欲望。——艾尔库伯(交互设计精髓的作者)

 

定义、设计人造系统的行为的设计领域,它定义了两个或多个互动的个体之间交流的内容和结构,使之互相配合,共同达成某种目的。交互设计努力去创造和建立的是人与产品及服务之间有意义的关系,以“在充满社会复杂性的物质世界中嵌入信息技术”为中心。交互系统设计的目标可以从“可用性”和“用户体验”两个层面上进行分析,关注以人为本的用户需求。——来自 李世国 顾振宇.《普通高等教育工业设计专业“十二五”规划教材——交互设计》2012年

 

 

 

2.3、交互设计的对象

 

最早期的设计,我们可以追溯到工业设计时期,作为设计领域​的鼻祖,它是以“产品“为设计对象,而交互设计对象是“行为”,交互设计师会关注与“行为”相关因素作为设计的考量。而不仅限于产品的物理属性(外观、结构、功能、材料);

 

以小米的“小爱音箱”为例。小米通过它将家庭中的电子设备实现了互联,它新奇的用户体验被很多用户追捧。我们可以在小米现有的音箱产品中,找到和传统音箱的一些区别;

 

 

 

 

小爱音箱系列产品已经陆续发布了5款,从初代的蓝牙音箱到触屏、语音音箱,我们可以从产品的迭代中感受到音箱交互行为(语音交互到屏幕手势操控)变化的一些特点。

 

 

 

 

 

 

当用户在使用小爱音箱的时候,已经不局限于听音乐,它作为小米Alot产品生态的连接中枢,用户更享受通过页面操控和语音交互来控制其他lot产品的快感。当用户回家,向小爱音箱发出语音指令“小爱同学,我回来了”,和音箱连接的所有lot 设备都能同步打开,当用户在回家后,还可以通过操作小爱音箱界面设置热水器的水温。

 

 

 

 

 

 

传统音箱最原始的需求是音乐播放,随着音箱使用要求的升级,人们对于声音的品质追求也变得更高了,厂商想尽方法制造出新的产品提升声音的播放质量,例如丹拿音箱的出现大大提升了声音播放的品质。

 

 

 

 

 

 

 

当用户在使用小爱音箱和家中的其他Alot产品交互的过程中,很少会在意小爱音箱本身的物理属性,他们更在乎这种创新式的交互如何改变的自己的家庭生活,譬如通过语音交互帮自己打开壁灯,打开电视、打开扫地机器人或通过触摸屏界面来设置调节其他Alot设备的运转状态等,应用到各种家庭使用场景。

 

2.4、交互设计的行为要素

 

关于交互设计的行为要素我们通过下面两个例子来解析:

 

1:理想L9后排电视手势交互操作:

之前号称对飙500万库里南的新能源汽车理想L9已经发布很长一段时间了,这辆车最大的特色就是智能座舱的全新体验升级,针对家庭使用场景的设计有很多。其中手势交互是一个比较新颖的设计点,手势交互的行为有悬停获取焦点,平移切换,两次抓握确认。

 

 

 

 

 

 

使用场景举例:一家四口去外地郊游,家里的成员哥哥想打开后排的电视机看电视打发无聊的旅途,他使用了手势交互去操作选择影视进行播放。

 

 

2:OPPO手机ColorOS系统的手势交互:

在ColorOS系统12.0版本中,新增了这个手势交互的方式,它结合智能传感器,进行无触控式的手势操作,根据系统提示通过控制手腕挥动去切换内容、完成对应的任务。

 

 

 

 

 

 

 

使用场景举例:小A使用手机看电影,突然收到一个好朋友的来电显示,他通过隔空手势操作,向上滑动手腕,完成接听了朋友的电话流程。

 

 

通过上述两个设计案例,我们可以总结交互设计的五大行为要素为:

 

 

 

 

 

 

 

2.5、交互设计的衡量指标

 

在关于交互设计定义的内容里面,提到了交互设计的指标是从可用性和用户体验两方面去分析,也就是从理性和感性的两个角度去衡量。

 

2.5.1、可用性

 

根据雅各布尼尔森《可用性101:可用性简介》文章定义:可用性是一种质量属性,用于评估用户界面的易用性。“可用性”一词也指在设计过程中提高易用性的方法。可用性由以下五个质量组件定义:

 

 

 

 

 

 

 

 

易学性:用户在第一次遇到设计时完成基本任务的难易程度如何?

如下图美团外卖:用户第一次在线上点餐时,如何快速的用最便宜的价格吃上一顿饭。用户是否能高效获取店铺满减优惠活动信息,是否快速填写地址,是否能快速选择挑选优惠券,最后进行付款。

 

效率一旦用户学会了设计,他们执行任务的速度有多快?

如下图美团外卖:当用户完成第一次点餐后,以后每次完成点餐的速度会不会更快,例如商品页有商家的满家活动提示,上一次点餐记录,可以点击“再来一单”按钮,完成选餐,选择优惠红包前,有文案提示需要先填写地址,同时有常用地址弹窗提示,可点击使用。

 

记忆性:当用户在一段时间不使用设计后重新使用它时,他们恢复熟练度的难易程度如何?

如下图美团外卖:当用户隔了很久之后再使用美团外卖来点餐,用户重新使用产品的熟练度是否有下降。

 

 

 

 

 

错误:用户犯了多少错误,这些错误有多严重,以及他们从错误中恢复的难易程度?

例如下图顺丰快递:在寄快递时,填写完所有的详细信息后,提交了订单,但发现地址和电话填错了,在运单详情页有“修改信息”按钮,点击进入寄件页面进行信息修改。

 

 

 

 

 

满意度:使用该设计的愉快程度如何?

例如在闲鱼平台购买闲置物品时,卖家的商品描述和实物有很大的差距,然后要求退货,卖家不肯,最后需要闲鱼法庭介入审理,但审理也没有足够公平和透明,最后只给了一个判决结果。这样的情形我遇到了两次。所以平台对于买家卖家的一些管理机制特别不完善,还有商品的描述是否准确也没有审查标准,完全把责任抛给买家和卖家。所以总的来说,使用起来愉悦感很低,平台信任感也很差。

 

2.5.2、用户体验

 

用户体验是用户在使用产品过程中建立起来的一种纯主观感受。我查阅了很多相关资料,这种定义还是具有普适性的。再简单的解就是:用户在使用产品去完成某项目标的过程中,使用感受是怎么样的。很多知名国内外公司为了量化用户体验指标而设计了很多数据模型,其中出现最早且具有指导意义的是国外的谷歌的量化模型:以用户为中心衡量的 HEART、以目标为导向衡量的 GSM;国内的最近几年也有很多类似量化的数据模式,具有代表性的是阿里的"PTECH"、UES、五度模型;其中谷歌的数据模型更加系统和通用,而阿里的是针对不同项目而衍生出很多量化模型。下面以谷歌公司模型为例浅谈下它们是如何去衡量用户体验指标的;

 

HEART模型出发点是做以用户为中心的,能够用于大范围的用户体验度量方法。它包含5个维度:Happiness 愉悦度:用户主观体验,用户觉得产品对其有帮助,容易操作,使用产品或者功能时总感到愉悦。Engagement 参与度:用户对产品内容感兴趣并愿意经常使用。Adoption接受度:用户看到新产品或新功能愿意进行使用。Rentention留存率:在一个时间内用户愿意回来继续使用产品或者功能。Task Success任务完成率:用户能够高效,准确地完成任务。

 

GSM模型Google的UX团队为了让HEART模型度量标准应用于实践而提出的设计方法模型,G是Goal,S是Signal,M是Metric,是遵从「目标-信号-指标」的过程来定义数据指标的方法。

 

 

 

 

 

 

 

 

 

 

3、成为交互设计师

 

前面我们提到交互设计是一门十分复杂的学科,这个领域的研究广而深,可创新性很强,设计带来的意义很大,所以很多人都比较崇尚这个领域,可如果真想走上交互设计之路,就得有项目的历练,有熟练的设计技能,有扎实的知识基础,对事物和生活的细致观察力。

 

3.1、交互设计师项目篇

 

当设计回归到实际工作项目,首先我们要知道,一般交互设计的岗位在公司的组织架构里面,它是一个比较中间的位置,他的上游有产品、用研;下游有设计和研发,交互和这些岗位是交叉的,有联系的,强如“设计驱动”的苹果公司,交互设计师也需要掌握很多其他跨专业的知识,所以实际工作中,有很多东西需要交互设计师去学习。

 

3.1.1、交互设计的项目流程

 

互联网公司的设计团队都有自己的设计开发的一套流程,但项目的核心流程大体都会经历以下三个阶段:需求—设计开发—结果验证;

 

 

 

 

需求阶段需求是项目开发的源头,我们要进行需求搜集、分析、筛选、评估、版本排期。需求的搜集可以是来自产品数据、用户反馈、设计人员洞察探索、竞品分析,然后再做需求筛选讨论,确定需求的优先级;

 

设计开发阶段

 

环节1:产品经理的文档需要列出每个版本的详细信息,包括产品创新设计或改版的背景、解决什么问题、功能的设计背景,产品目标和指标、产品策略,产品范围层(功能规格、内容、信息、规则)等;

 

环节2:设计师需要针对产品功能结合产品目标进行设计策略上的思考,进行方案输出,包括交互文档(版本号、设计描述、流程图,页面跳转逻辑,交互细节阐述、异常状态处理)、交互动态(动效演示参数图、动态demo展示)、视觉界面设计(形、色、构、字、感)等,全流程保持和前后端技术人员进行设计评审和沟通,持续评审也是为了防止后期大家互相扯皮影响工作状态和效率,但最终目的是使项目开发降本增效,减少返工。

 

环节3:设计方案输出结束之后,就是技术人员的开发,设计师也需要全程持续跟进,保证设计效果的实现,了解前端的一些页面适配规则,前后端的之间数据架构和接口传输规则。

 

环节4:前后端开发完成第一版本成品后,项目组人员(测试人员权重较高)可以开始全局测试,交互设计师在走查时,可以内部梳理一套通用的《交互走查表》进行检查,可以通过设计走查,专家测试,用户内测,用户访谈等方式,整理收集影响产品稳定性的Bug和设计细节问题,再反馈给技术员人进行修改。有条件的会进行可用性测试,检验设计的用户体验和设计可行性。

 

结果验证阶段

 

产品上线后,我们可以通过数据和用户体验来检验优劣,数据层面可以使用灰度测试、A/Btest测试等方式验证设计方案的可行性,通过数据埋点的方式获取用户的行为数据,用户体验可以使用满意度调查、NPS等方式通过问卷调研的手段来了解用户的使用感受。

 

 

 

3.1.2、交互设计的5大项目思维

 

产品思维交互设计师要有培养产品思维的习惯,产品思维能够引导我们发现很多设计点,设计出创新性的产品。做产品最核心的问题就是:用户有什么样的需求?这个需求待解决程度(用户痛点、爽点、痒点)怎么样?例如支付宝这个产品,就是改变了用户日常的付费交易方式,从现金到线上数字货币支付的转变,大大的解决了用户不用携带大量现金的需求,当然了他的功能不仅限于此,更客观的说,支付宝的出现改变了人们的生活,创造了极大的社会的价值。

 

 

 

 

 

 

 

 

用户思维产品主要作用对象是用户,通过用户获取功能需求,我们需要学习如何了解用户,了解我们的产品典型目标人群是哪一类人,了解用户的真实诉求是什么?了解用户场景是什么样的?具备用户思维,设计师可以更精准高效的输出设计方案,达到解决用户问题的目的。

 

视觉思维交互原型稿和文档是交互设计师接触最多的工作任务,它们需要定义很多内容信息,这不仅仅靠逻辑,还需要有视觉思维,将黑白交互界面的视觉重点和信息层级展示清楚。如下图所示为苏宁智慧屏项目部分功能的交互设计稿样式:

 

 

 

 

 

 

交互设计的视觉思维上关注的几个点如下:第一点要有场景的概念,比如要熟悉产品在什么样的设备上呈现,设备具有什么样的特性和要求,用户的使用产品的操作方式;第二点要有原子和模块化的概念,比如一个组件和模块主要是由哪些原子化的元素构建,如何去定义这样内容,第三点要有设计理论应用的概念,比如在界面布局时,可以通过设计的四大基本原则(对比、重复、对齐、亲密性)、格式塔原理(接近原则、相似原则、共同命运)、设计规律(黄金分割法、网格系统、系统规范)这些点去切入。

 

开发思维产品外在靠界面,内在靠代码,好用好看的设计依靠技术作为底层支撑才能最终开发上线,我们经常做设计方案评审时,会遇到被技术人员否定的情况。我们就会拿有相同设计的产品去和他理论。最终的结果就是还是做不了。但是做不了的情况大体分为两种,第一种情况是实现这个设计的背后,确实需要投入很多人力、资源去完成这项工作;第二种就是技术人员单纯的不愿意做,可如果你有开发思维,能想到这个设计背后的技术难点,能清晰的和技术人员进行讨论和协商,他们也不能或不好意思去拒绝。所以开发思维可以让我们和技术人员成为好朋友,又可以学习一些技术原理,属实不亏。

 

数据思维交互设计师对于数据要有一定的敏感度,业务数据可以帮助我们了解产品的经营状况,关注产品的总体流量,转化、营收,用户的行为数据可以帮助我们在设计迭代时提供依据,另外通过各类数据的跟踪、对比、分析能帮助我们评估设计方案的好坏以及后期设计修改的方向。

 

 

 

3.2、交互设计师技能篇

 

技能已经是交互设计师的入门要求,也是初级交互设计师进阶的基础,那这部分主要讲解交互设计师的技能兵器库,主要由设计手段、平台规范、理论知识这三部分组成。

 

 

3.2.1、交互设计的兵器库1-设计手段

 

设计软件交互原型设计:包括静态界面和动态demo设计,可以使用纸质原型、Axure RP、Fireworks、MockingBot、Flinto、Origami、ProtoPie、Hype、Principle、Proto.io、Frama等;界面设计:主流的软件有Figma、Sketch、ps,网页和客户端通用的有即时设计、Figma、Pixso等;

 

动效和三维设计:目前动效应用广泛的如AE,三维软件有C4D,blender,Rhino、更高级的如游戏引擎unity3d;

 

编程软件:网页端如标记语言HTML+CSS,脚本语言JS,移动端如iOS的Swift和Xcode,Android的studio;

 

文档工具:如常用的X-mind(思维导图)、汇报用的ppt、keynote等

 

 

设计方法设计方式这里指向用户研究部分的内容:主要有定量研究、定性研究、用户画像的构建,定量研究的可使用问卷调研、数据分析、眼动测试,定性研究可使用用户访谈、焦点小组、可用性测试、卡片分类法,用户观察法等

 

 

3.2.2、交互设计的兵器库2-设计规范

 

说到设计规范,这可能是很多设计师在交互入门的时候,比较忽略的基础知识点,首先各类平台的系统规范经过很多版本的迭代,内容特别精且多,新手设计师经常在阅读学习的过程中失去耐心。只是碰到相应的点才会想起来去看一下。目前处在设计领域最前沿的平台规范如苹果系统的《人机界面指南》,安卓系统的《材料设计》,鸿蒙系统的《设计指南》,微软系统的《设计原则》,这些平台的系统规范非常通用,覆盖的设备也很多,例如苹果系统的人机界面指南覆盖了电脑、手机、平板、手表、电视。在国内也涌现了很多平台规范,例如阿里的antdesign,腾讯的tdcdesign,字节的acrodesign等。

 

 

3.2.3、交互设计的兵器库3-理论知识

 

交互设计发展至今已经很长一段时间了,前辈们在无数的实践中总结了很多科学的设计理论。我们可以利用它们指导设计工作,例如:尼尔森设计十大原则(状态可见原则、环境贴切原则、用户可控原则、一致性原则、防错原则、易取原则、灵活高效原则、审美和简约设计原则、容错原则、人性化帮助),交互相关定律(菲茨定律、席克定律、格式塔原理、奥卡姆剃刀原则、峰终法则、帕雷托原理、米勒定律、邮编定律、序列位置效应、泰斯勒复杂性守恒定律、序列位置效应、多尔蒂阀值、雅各布定律、蔡格尼克记忆效应、冯·雷斯托夫效应等)。理论知识可以作为设计的参照标准,但用设计理论反对设计结果是很不合适的,具体问题还需要结合实际应用场景去分析解决。

3.3、交互设计师能力篇

最后一章我想和大家分享关于交互设计师的能力模型,主要分三大块,这也是实际工作中感触比较深的几个点,希望对大家能有帮助!

 

3.3.1、基础能力-学习

 

学习是一项比较基础的能力!它包括了你技法上的突破、阅读书籍获取知识、适应和熟悉工作流程;例如当你在工作中,需要设计一个页面动画效果,你学会了一个新的软件和新的实现方法;又或者当你阅读了一本书,学到了很多知识,打破了自己的认知,再或者入职新公司的时候,你需要适应新环境和工作流程。设计领域的要求更新换代特别快,就好比之前我们做设计基本都使用sketch,

还得和苹果系统捆绑,但现在像Figma等软件不光可以客户端下载使用,甚至都可以网页端协同使用。所以在任何时候都要保有一颗

做学徒的心,去学习,去适应、不断的突破自己!

 

3.3.2、通用能力-沟通、执行、总结

 

沟通、执行、总结三大能力无论是在生活还是在工作中都是比较通用的,我们在和别人交流时,需要用语言传达自己的想法,让别人或自己明白,然后去执行,根据执行的结果进行总结,变成自己宝贵的经验。例如有一次在做交互方案时,产品经理直接丢过来一个需求,然后没有说明具体的需求背景和设计方向,然后就把方案弄好了去评审,被技术人员一通乱怼,弄的大家情绪都上了头,就开始争吵起来,最后结果就是重新设计;这让我后来在做方案的时候,一直记得利用这套通用能力去处理问题;确实有效。但在培养这些能力的同时需要注意:把控情绪做有效沟通,拒绝盲目执行,反复思考总结经验,用总结能力反哺自己的沟通、执行能力。

 

 

 

 

 

 

 

3.3.3、进阶能力-洞察、思考

 

洞察和思考是交互设计师的最高级的能力,拥有这种能力的设计师往往已经能够探索到问题的本质,洞察和思考能力的培养来源对事物的探索欲,有好奇心,有细致的观察,这要求设计师要把解决问题当作是兴趣来看待;以生活中的用户使用的出行工具单车设计为例,单车上有很多设计点都体现了交互设计师的这两项能力;

 

 

 

 

 

1:单车的座位调节控制结构设计如上图是哈喽单车的不同版本的设计,第一个调节结构我们需要向逆时针向外推,才能进行座凳高低的调节,第二个调节结构我们仅需要上下方向推拉进行控制。我在使用的过程中,第二个结构操作的时候更加省力。

 

2:座凳支撑杆的身高标记设计第一个支撑杆我们可以看到是没有任何标记的,第二个支撑杆上面有对应身高相匹配的尺寸标记,相比较第一个设计,带标记的设计让用户更快的调到舒适的高度位置。

 

这个设计案例属于从结果倒推方案,因为在已有设计方案做推理分析,但是我相信项目人员在进行产品优化的时候,也肯定是洞察到“旧的坐凳设计”结构给用户带来的不便,不仅操作费力,而且这样的结构容易卡住废车;身高标记的设计肯定也是结合用户的不同身高这个需求,设计师观察用户在调节座凳高度的时候,坐上去再下来,反复的调试去选择舒适的高度,才思考出这样不错的设计方案。

总结

本文分享到这里就结束了,总的来说,想成为一名交互设计师,需要投入的成本是很大的,除了软件技能还需要有足够的知识储备,培养自己的各种思维和能力,那文章我也通过三个部分去说明了这些内容,首先我用设计领域的名词作为切入点,带大家去了解设计领域的现状和关联,对设计名词有大致的概念;其次着重的分析交互设计,介绍了交互设计的起源、定义、主要对象、五大行为要素、两大衡量标准;最后写了关于成为交互设计师一些入门要求,第一点是通过项目流程、项目思维角度,第二点是从设计技能角度,交互设计师需要有设计手段、平台规范、理论知识三大兵器库,第三点是从能力模型角度,交互设计师须具备学习、沟通、执行、总结、洞察、思考6大能力。在去往交互设计的路上,建议设计师们要保持一颗进取的心,认认真真的去学习、去实践、去进阶,提升自己的设计认知。

文章内容仅供学习参考。


作者:Q什伍
链接:https://www.zcool.com.cn/article/ZMTQzNTU1Mg==.html
来源:站酷
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

ui设计公司教你如何提升用户体验设计

蓝蓝设计的小编

UI 设计中的体验设计是一个综合性的工程,需要设计师从用户需求出发,关注每一个细节,不断优化和创新,才能打造出令用户满意的产品,在激烈的市场竞争中脱颖而出。

情绪价值在体验设计中的应用

蓝蓝设计的小编

近两年“情绪价值”这个词,相信每个人应该或多或少都有过接触,从商业空间的营销场景到后来渗透到每个领域、每个行业。 
 
先说下这个词的概念,它源于心理学和社会学, 本意为:“它指的是一个人或事物对他人情感状态所产生的积极影响和价值。这种价值不仅仅体现在短暂的愉悦感受上,更包括长期的情绪稳定、心理满足和精神支持。” 
无论是在网红还是在新型电商行业中,许多品牌强调的已经不是单一的产品功能价值,而是增加了强调在消费体验中为消费者带来的快乐、满足、归属感等等一些积极的情绪。这足以说明,无论是品牌、产品还是服务越来越注重为消费者提供情绪价值。 
 
而用户体验设计的本质其实就是让人在使用产品的过程中有非常愉悦的感觉,这一点与“情绪价值”这个词的核心也有点不谋而合。 
 
情绪价值在体验设计中的应用
 
 
相信我们都有这样的疑问:情绪价值在体验设计中重要吗,有什么具体的关系?在设计工作中的情绪价值到底重要吗?情绪价值对产品使用的提升有哪些,具体要怎么做?相信看完下面的内容,你应该会对上面的问题有答案的。 
 
一、情绪价值对用户体验的影响
首先我们可能需要了解情绪价值能给用户带来什么?申晨老师在一次分享会上有提到过情绪价值的三个方向:愉悦感、保障感、专享感。三者由浅入深影响着用户在使用产品时的情绪变化,对应到体验设计中是这样的: 
  •  
    愉悦感→影响用户的满意度
  •  
    保障感→影响用户的容忍度
  •  
    专享感→影响用户的忠诚度
 
提升用户满意度
积极情绪的诱导
 
当产品或服务能够提供情绪价值时,会引发用户的积极情绪。如下图,三种UI会给用户不同的情绪反馈,积极的情绪(右图)往往会让用户驻足停留的更长一些,即便没有需求,也会更愿意去花费一些时间去深入了解,进而带来一些拉新、浏览转化等等数据的提升 
情绪价值在体验设计中的应用
 
 
满足情感需求
 
许多产品和服务通过满足用户的情感需求来提供情绪价值。用户在使用这些产品时,会因为产品所承载的情感因素而感到满足,进而提升对产品体验的满意度。例如: 
  •  
    社交媒体的分享被赞,是一种被关注、被认可的情感需求;
  •  
    直播平台app的互动效果,也是一种渴望互动的情感需求,以此刺激观看者送出礼物。
改善用户对负面体验的容忍度
情绪缓冲作用
 
当产品或服务出现一些小问题时,之前积累的情绪价值可以起到缓冲作用。例如: 
  •  
    在使用某工具产品时,友好的客服系统会给用户比较积极的情绪积累,从而选择包容一些比较小的错误;
  •  
    还有很多错误页面的情感化设计,目的亦是如此。
引导解决问题的积极态度
 
如果用户对产品或服务有情感上的依赖,当遇到问题时,他们会更积极地寻找解决办法,而不是抱怨和放弃。例如: 
  •  
    当产品或服务偶尔出现卡顿现象时,其用户社区氛围很好,用户之间可以互相交流使用经验和解决方案,并且软件开发者也会积极回应用户的问题。这种情绪价值会让用户愿意配合开发者解决软件卡顿问题,而不是直接卸载软件。
 
情绪价值在体验设计中的应用
 
 
增强用户的忠诚度
能够在用户和产品 / 服务之间建立起情感纽带
 
  •  
    以苹果产品为例,苹果公司通过简洁、易用的设计,以及高效的客户服务,为用户提供了良好的情绪体验。用户在使用苹果产品的过程中,会逐渐对品牌产生信任和喜爱。这种情感纽带使得用户在下次购买电子产品时,更有可能继续选择苹果产品,忠诚度较高。
  •  
    一些会员制度也注重通过情绪价值来增强用户忠诚度。例如,酒店的会员计划会为会员提供优先入住、免费升级房间、生日惊喜等服务。这些措施让会员感受到特殊待遇,产生一种被重视的情绪,从而增强了用户对酒店品牌的忠诚度。
推动口碑传播
 
当用户从产品或服务中获得了高情绪价值,他们更愿意向他人推荐。例如: 
  •  
    用户在一家餐厅用餐,餐厅的服务人员热情周到,菜品的呈现方式也很有创意,让用户在享受美食的同时获得了愉悦的情绪体验。这种用户很可能会将这家餐厅推荐给朋友、家人,通过口碑传播为餐厅带来新的顾客。
  •  
    在线游戏如果能为玩家提供丰富的社交互动功能,让玩家在游戏中结交朋友、组队作战,获得团队合作的快乐和成就感等情绪价值,玩家就会积极向周围的人宣传这款游戏,扩大游戏的用户群体。
 
 
二、什么产品适合通过创造情绪价值提升使用体验
 
C端产品:在创造情绪价值的应用策略下,更容易获得显著成果
情绪价值在体验设计中的应用
 
 
 
创造情绪价值这种有效的策略,尤其在面向个人用户产品时,可以更显著提升其使用体验。例如: 
  •  
    社交类产品
    如微信、微博等,通过提供社交互动和情感连接,增强用户的归属感和幸福感 
  •  
    内容类产品
    如视频平台、音乐应用等,通过提供丰富多样的内容,满足用户的情感和娱乐需求 
  •  
    娱乐类产品
    如游戏、盲盒等,通过游戏性和不确定性,激发用户的兴趣和情感投入 
  •  
    交易类产品
    如电商平台、在线购物等,通过营造购物氛围和提供个性化推荐,增加用户的购物愉悦感 
  •  
    工具类产品
    如效率工具、健康管理应用等,通过提供情感化的设计和反馈,提升用户的使用体验和满意度 
 
那么 B 端产品是否同样适用呢?答案无疑是肯定的。随着企业数字化转型的迅速推进,B 端产品在各个行业领域当中得到了广泛的应用,用户体验的重要性越发显著。 
 
 
B端产品:创造情绪价值更有利于提高忠诚度
 
情绪价值在体验设计中的应用
 
 
创造情绪价值的方式
 
  •  
    情感设计:通过设计元素和交互方式激发用户的情感共鸣,增强用户对产品的认同感和忠诚度。例如,通过微动画、个性化推荐和人性化提示,设计师可以为用户创造愉悦的使用体验
  •  
    个性化服务与定制化解决方案:了解客户的独特需求和痛点,提供个性化的建议和支持,帮助客户解决实际问题,带来更多情感上的满足感
  •  
    优化用户体验:注重产品设计和交互体验优化,提供良好的客户服务和多种使用方式,不断优化产品功能,以提升用户的整体使用体验
 
 
创造情绪价值的重要性
 
  •  
    提升用户满意度和忠诚度:通过创造情绪价值,产品可以显著提升用户的满意度和忠诚度,从而促进续费和口碑传播
  •  
    增强产品的市场竞争力:在功能相似的产品中,提供卓越的用户体验可以成为SaaS产品的核心竞争力,帮助企业在市场中脱颖而出
 
 
三、体验设计师如何提升产品的“情绪价值”
我们可以从设计核心的三大阶段(用户研究阶段、设计阶段、测试与优化阶段)入手,来创造与提升产品的情绪价值 
 
用户研究阶段
情绪价值在体验设计中的应用
 
 
 
深入了解用户情感需求
开展定性研究
:通过用户访谈、焦点小组等方式,挖掘用户在使用产品时的情感期望。例如,在设计一款健身APP时,与健身爱好者进行深入访谈,了解他们在健身过程中的情绪变化。可能会发现,用户在完成一次具有挑战性的训练后,希望得到即时的鼓励和成就感,这就为产品设计提供了情感方向。
 
进行定量研究
:利用问卷调查等手段,收集用户对现有产品情绪体验的数据。比如,询问用户在使用某电商平台时,购物流程是否让他们感到焦虑或愉悦,以及在哪些环节有这种情绪。通过数据分析,找出用户情绪的痛点和兴奋点。
 
构建用户画像与情绪场景
 
创建用户画像
根据用户研究的结果,构建详细的用户画像,包括用户的性格、生活方式、价值观等因素,并且添加情绪维度。以一款旅行APP为例,其中一个用户画像可能是“年轻的探险爱好者,性格乐观,追求刺激,在旅行前会充满期待和兴奋”。这样的画像有助于设计师站在用户的角度思考情绪体验。
描绘情绪场景
:针对不同的用户画像,描绘他们使用产品的情绪场景。比如,对于上述旅行APP的用户,在规划行程时,他可能会在APP上查找小众景点,此时的情绪是好奇和兴奋;在旅途中使用导航功能时,希望得到精准的指引,情绪是焦虑或安心,取决于导航的准确性。这些情绪场景为后续设计提供了具体的目标。
 
 
设计阶段
情绪价值在体验设计中的应用
 
 
视觉设计方面
色彩运用
:色彩对情绪有着强烈的影响。例如,暖色调如红色和橙色通常传达活力、热情的情绪,适合用于激发用户兴趣的界面元素,如促销活动页面;冷色调如蓝色和绿色则给人冷静、可靠的感觉,可用于数据展示或需要用户集中注意力的区域。在设计金融产品界面时,使用蓝色为主色调可以让用户感到安全和信任。
图形设计
:简洁、易懂的图形能够快速传达信息并引发积极情绪。在图标设计上,要符合用户的认知习惯。例如,在社交产品中,使用微笑的表情图标表示点赞或喜欢,用户很容易理解并产生愉悦的情绪。同时,利用有趣的插画或动画可以增加产品的趣味性。如在儿童教育产品中,用生动的动画来讲解知识,能够吸引孩子的注意力并让他们感到快乐。
排版布局
:合理的排版可以提升用户的阅读体验和情绪。清晰的标题和正文层次,适当的文字间距和行高,能让用户感到舒适。在新闻类产品中,采用模块化的排版,将不同的新闻内容清晰划分,使用户在浏览时不会感到混乱,从而减少烦躁情绪。
 
交互设计方面
反馈机制设计
:为用户的操作提供及时、明确的反馈可以提升情绪价值。例如,当用户点击一个按钮时,按钮会有短暂的变色或动画效果,让用户知道操作已被接收。在加载页面时,使用有趣的加载动画代替单调的进度条,如旋转的小图标或者跳动的小球,能够缓解用户等待的焦虑情绪。
操作流程优化
:简化复杂的操作流程,减少用户的认知负担和操作失误。在移动支付产品中,尽量减少支付步骤,让用户能够快速完成支付,避免因流程繁琐而产生烦躁情绪。同时,可以增加一些引导性的交互,如新手引导教程,帮助用户轻松上手产品,提升用户的自信心和满意度。
个性化与定制化设计
:根据用户的喜好和行为习惯,提供个性化的交互体验。例如,音乐产品可以根据用户的收听历史推荐相似风格的歌曲,用户会因为产品的贴心而感到愉悦。并且允许用户对界面布局、主题等进行定制,让用户有更多的掌控感,满足他们的自我表达需求。
 
内容设计方面
文案撰写
:使用友好、易懂的文案可以拉近与用户的距离。在产品提示信息中,避免使用生硬的专业术语,而采用亲切的语气。例如,在一款智能家居产品中,当设备连接成功时,显示“哇,您已经成功连接啦,现在就可以享受智能生活啦”,这样的文案会让用户感到轻松和愉快。同时,文案的风格要与产品的定位和目标用户相匹配。
内容策略
:提供有价值、有趣的内容可以提升情绪价值。在知识付费产品中,确保课程内容不仅有深度,而且讲解方式生动有趣。对于内容社区产品,鼓励用户分享积极向上的内容,如生活中的小美好、励志故事等,营造一个充满正能量的社区氛围,让用户在浏览内容时感到愉悦和鼓舞。
 
 
测试与优化阶段
情绪价值在体验设计中的应用
 
 
可用性测试与情绪评估
进行可用性测试
:在产品原型阶段,邀请用户进行可用性测试,观察用户的操作行为和情绪反应。例如,在测试一款办公软件的新功能时,注意用户是否能够顺利使用,以及在使用过程中是否出现困惑、烦躁等情绪。可以通过用户的面部表情、言语反馈等方式收集情绪信息。
情绪评估工具
:利用情绪评估工具,如情感化可用性量表(UEQ)等,对用户的情绪体验进行量化评估。UEQ可以测量用户对产品的吸引力、易用性、可靠性等维度的情绪感受,通过数据分析,找出需要优化的情绪体验点。
 
根据反馈优化设计
迭代设计
:根据用户测试的反馈,对产品的视觉、交互和内容设计进行迭代优化。例如,如果用户在测试中表示某个界面元素的颜色让人感到刺眼,设计师可以调整颜色方案。如果用户对某个操作流程不理解,就优化操作引导。
持续关注情绪反馈
:产品上线后,持续收集用户反馈,关注用户情绪价值的变化。随着用户需求的变化和市场环境的改变,不断调整产品设计,以保持和提升产品的情绪价值。例如,在节日期间,对产品界面进行节日主题的装饰,为用户提供新鲜感和节日氛围带来的愉悦情绪。
 
四、情绪价值是否具备量化条件
可以通过以下方法对其进行量化计算
 
情感化可用性量表
情绪价值在体验设计中的应用
 
 
原理:UEQ是一种广泛用于量化用户对产品情绪体验的工具。它通过一系列的问卷题目来测量用户对于产品的吸引力、易用性、效率、可靠性和刺激度等多个维度的感受。例如,在吸引力维度上,会询问用户对于产品外观、风格是否感到喜欢;在易用性维度,会涉及用户操作产品时是否感到轻松、方便等问题。 
 
应用:在一款产品/功能的用户体验测试中,使用UEQ可以收集用户对该应用在不同维度的情绪评价。通过对大量用户反馈的数据统计,得出该应用在各个维度的量化得分,比如吸引力维度得分较高,说明产品在视觉等方面能引发用户积极情绪,而如果易用性维度得分较低,则可能表示产品的操作流程等会让用户产生负面情绪。 
 
 
净推荐值(NPS)与情绪关联量化
 
情绪价值在体验设计中的应用
 
 
 
原理:净推荐值是通过询问用户“您是否愿意将这个产品推荐给其他人”来衡量用户忠诚度。虽然NPS本身不是直接对情绪价值的量化,但它与用户的情绪体验密切相关。当用户体验到较高的情绪价值,如愉悦、满足等,他们更有可能成为推荐者,NPS得分就会升高。 
 
应用:通过定期收集用户的NPS数据,并且结合用户对功能使用体验的详细反馈(包括对产品、服务、售后等环节的情绪感受),可以间接量化情绪价值对用户忠诚度的影响。例如,如果发现NPS得分高的用户在评价中经常提及购物过程中的快乐情绪和优质服务体验,就可以推断出情绪价值在提升用户忠诚度方面起到了积极作用。 
 
 
 
  1.  
    生理指标测量
 
情绪价值在体验设计中的应用
 
 
原理:情绪会引发身体的生理反应,如心率、皮肤电导率、瞳孔大小等变化。通过专业的设备可以测量这些生理指标,以此来推断用户的情绪状态。例如,当用户感到兴奋或紧张时,心率会加快;当他们感到好奇或专注时,瞳孔可能会放大。 
应用:在用户体验实验室中,测试用户在使用虚拟现实(VR)游戏的情绪体验。通过佩戴可以监测心率和皮肤电导率的设备,观察用户在游戏不同场景下的生理指标变化。如果在某个刺激的战斗场景中,用户的心率明显上升,皮肤电导率也增加,就可以推断用户处于兴奋或者紧张的情绪状态,从而量化游戏场景对用户情绪的激发程度。 
 
虽然有量化方法,但也只有部分可被量化,完全精准量化还存在一定的挑战 
 
 
难以完全量化的原因
情绪的复杂性和主观性
个体差异:不同用户对同一产品或体验的情绪反应存在很大差异。例如,对于一款具有挑战性的游戏关卡,一些玩家可能会因为克服困难而感到兴奋和满足,而另一些玩家可能会因为觉得太难而产生沮丧情绪。这种个体差异使得很难用统一的标准来量化情绪价值。
文化背景影响:文化因素也会对情绪价值的感受产生影响。在某些文化中,含蓄的情感表达是常态,而在另一些文化中,人们可能更倾向于直接的情感反应。比如,在日本文化中,用户可能对产品的精致、细腻的设计有更深刻的情感共鸣,而西方文化中的用户可能更看重产品的创新性和个性化带来的情绪体验。
 
情绪与情境的动态变化
使用场景的多样性:用户在不同的使用场景下对产品的情绪价值感受不同。例如,一个音乐播放软件,用户在运动场景下可能更关注节奏强烈的音乐带来的激励情绪,而在睡前场景下则更看重舒缓音乐营造的放松情绪。这种随场景变化的情绪体验难以用固定的量化指标来衡量。
 
时间因素:用户对产品的情绪体验也会随着时间而变化。最初接触产品时的新鲜感可能会带来积极情绪,但随着时间推移,如果产品缺乏更新或出现问题,情绪可能会转变为消极。而且情绪的产生和消退过程很难精确量化,例如很难确定用户从感到满意到产生厌烦的具体时间节点。
虽然难以量化,但情绪价值在实际应用中发挥的作用还是很大的。 
 
 
结束语
在体验设计的广阔领域中,情绪价值犹如一股无形的力量,悄然影响着用户与产品之间的每一次互动。它不仅仅是愉悦感、保障感和专享感的简单叠加,更是用户在深层情感层面与品牌建立起的稳固纽带。通过精心设计的用户体验,我们能够触动用户的情感,激发他们的共鸣,从而在用户心中留下深刻而持久的印记。 
 
作者:木茶


作者:群核科技MCUX
链接:https://www.zcool.com.cn/article/ZMTY0OTIxNg==.html
来源:站酷
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

日历

链接

个人资料

蓝蓝设计的小编 http://www.lanlanwork.com

存档