全链路UI 设计师的能力要求|UI/UX设计师的一百个设计思考
你好,我是小鹿。在知群做产品设计与管理。近两年,我在知乎写了不少于 10 万字的专业性回答,解决了不少互联网设计师的困惑。现在,我想把过去的一些关于 UI设计、交互设计乃至整个用户体验设计相关的思考和回答,做更系统的梳理。同时,也会找一些国外写的不错的文章,做一些翻译和拆解。一来我自己也能深度思考和学习,二来也能帮助到更多设计师朋友,给大家带来启发、思考和进步。
这篇是小鹿的专栏——「UI/UX 设计师的“一百个”系列」的第 25篇——麦子姐姐更新的「产品经理的“一百个”系列」的姊妹篇。在这个系列里有关于设计的方方面面——学习姿势、认知百科、大咖分享、转行思路、设计思考等等,希望能帮助初入设计行业的朋友们快速了解设计圈的各种知识,提升个人的能力。
很多人,尤其是想入门的小白都不太了解互联网行业的现状。
互联网行业经过这十几年的高速发展,已经逐渐饱和了(今年有很多公司倒闭、裁员),行业对设计师的要求越来越高,传统的 UI 设计已经过时了,设计师的能力需要更加全面。
比如,作为解决就业的主力 —— 中小企业来说,在面临生存的压力时,运营一款 App,是招聘产品经理+交互+ UI 3 个人,还是多花点钱,招一个能力全面的全链路设计师?
相对于传统的 UI 设计师,全链路设计师就是一个人具备整个用户体验团队的能力,具备研究+交互+视觉等多方面的能力,可以自己挖掘需求,进行市场调研,最终形成完整的设计方案,换句话说,Ta 能自己独立负责一块儿业务。对于多数公司来说,这样的设计师才有存在的价值。
下图是一个完整的设计流程:
这个设计流程,体现了现在要成为一名合格的设计师要具备的能力:
一、用户需求及调研能力
这里首先说的就是一个大家没太提到的一个能力:用户需求调研能力。
为了避免与公司的核心业务脱节,现在的设计师所承担的工作内容越来贴近业务,越来越需要设计师去亲自了解需求、挖掘需求。通过深入的调研工作指导设计师进行设计工作,这样更加科学和高效。
调研、收集需求的方法有很多,我们这里可以把它们大致分成两类:定量调研和定性调研。
两种调研方式也适用于不同的调研对象:
a)定性调研:
调研文化背景和生活习惯、人们的经验和习惯、探索人们行为背后的原因。
常见的定性调研方法有:用户访谈、实地观察等。
b)定量调研:
举个例子,当我们研究厕所海报对人们行为的影响的时候,独立变量就是设计师设计的海报,有依赖的变量就是洗手的人数,其他变量就是年龄、性别甚至还包括宗教信仰等等。
通常,我们在现实中面临的问题都会比较复杂,这两类方法会在调研的不同阶段结合使用,比如下面的这个案例就是定量调研和定性调研的方法结合使用来挖掘这个购物行为背后的需求。
二、挖掘需求的能力
一般而言,设计师需要挖掘的需求来自商业和用户。
挖掘对应的需求可以帮助设计师更好的平衡设计的商业价值和用户体验。
a)挖掘商业需求
挖掘商业上的需求,主要是了解我们的目标用户,他们可能为我们的设计买单、资源的优劣、商业愿景和产品愿景等。
b)挖掘用户需求
挖掘用户的需求主要是要了解我们的用户是谁,以及他们的痛点、需求是什么,已有的解决方案和期待的解决方案是什么等等。
常见的调研方式有问卷调查、用户访谈等等。
设计师可以根据自己的调研的对象选择合适的方式,同时也要注意规避一些错误的提问,比如避免设置一些引导性过强的提问、使用一些情感色彩比较浓重的话语等。
三、竞品调研能力
竞品分析、竞品调研,这并不是什么新鲜的词汇,不少视觉设计师也常常会应用这个工具。
通过分析竞争对手反过来引导自己更好的设计,它确实是一个有效的工具。
可惜这个工具不管是在商业分析领域还是设计领域都常常被滥用。
比如:直接复制粘贴 、取共性复制粘贴 、“融合+创新” 等,也被称为“竞品分析”,这样的竞品分析通常不能带来准确的信息,甚至会对设计活动产生误导。
竞品分析步骤
一般来说,要做一个完整的竞品分析,需要以下几个步骤:
明确分析目的是非常重要的,最后的分析报告的内容就取决于此。假如你的分析目的是想分析竞争对手在用户的整个生命流程中是怎么增强用户的粘性的,你的分析报告的内容就应该包括:
竞品分析的目的、竞品是谁、分析要点(视觉粘性、交互粘性、内容粘性)、具体的竞品分析、结论输出、优化建议。
竞品分析的类型
在进行竞品分析的时候,用户体验和商业价值的平衡要贯穿设计师工作的始终。竞品分析的类型也分为两种:针对商业的竞品分析、针对用户体验的竞品分析。
在⽤户体验趋同的情况下,不应⼀味地追求更⾼的⽤户体验,⽽是要寻求合理的商业运作⽅式。
因此,也不能忽视对商业模式的分析。市面上有不少用户体验优秀,却因缺乏商业考量而失败的产品。
- 针对于功能体验的竞品分析:内容范围、功能、交互、视觉
- 针对于商业的竞品分析:产品定位、商业模式、运营思路、盈利模式、市场推广
另外,用户体验趋同的产品,由于商业模式的不同,导致不同的发展趋势。
商业模式分析工具:
精益画布是一个比较常用的商业模式分析工具。它来源于丰田生产体系, 继承了其关注价值、减少浪费、以人为本的思想是一种用来组织、梳理、探索商业模式的工具适合于初创或小规模业务的公司。
四、用户分析能力
用户分析是我们通过对用户行为的观察、研究来指导设计。为了保证我们的设计对用户来说是有价值的,我们需要对我们的目标用户进行用户分析。
这里介绍用户分析的几个常用的方法:
- 用户旅程地图(User Journey map)
⽤户旅程地图(User Journey Map)是和⽤户画像(persona)相辅相成的⼯具,persona代表的是具体的族群,⽽体验地图是分析这个族群为了实现某个⽬标⽽经历的过程的可视化呈现⼯具。 它⽤于了解和解决客户需求和痛点,在这个过程中⽤户可能会使⽤多个设备和渠道(例如⽹站,⼿机app,社交媒体,电话, 线下客服等等)
为搭地铁去工作的孕妇制作的用户旅程图:
- 用户体验故事,又叫故事板(UX Story&Story Board)
故事板最初是源⾃于电影⾏业,早在20世纪20年代的时候,迪⼠尼⼯作室内就常常⽤故事板来勾勒故事草图。
产品的使⽤场景,⽤户的交互流程,也可以借由⼀系列连续的插画故事化地呈现出来。
⽤户体验故事(UX story)是从⽤户的⻆度对事件进⾏说明的⽅式, 故事中的事件展示了⽤户中个体验的转变。
- 用户建模(User Modeling)
⽤户建模是⼀种帮助我们「基于研究」中收集的数据归纳整合出「若⼲个」有相似⾏为、
⽬标、动机和需求的「半虚构⽤户」的⽅法,从⽽更好的帮助我们理解⽬标⽤户。
用户建模的常用方法:
• Persona(⽤户画像)
• Empathy Map(同理⼼地图)
• Affinity Diagram(亲和图)
• User Profile canvas(价值主张画布)
五、创意方法
A problem well stated is a problem half solved
一个问题被很好的定义,就解决了一半问题
——John Dewey
我们在调研完用户和商业上的需求之后,需要将用户体验上和商业利益上的诉求转化为可被解决的设计机会点,定义设计机会点是非常重要的一个步骤,它是创意的入口。
而如何定义一个好的问题,这需要科学的方法和实践积累。
- 定义设计机会点的方法
1.设计观点填空(POV &Point Of View)
是一种帮助我们发展设计观点的思考框架,将遇到的问题和挑战和用户的需求洞察,转换为可采取行动的问题陈述,帮助我们有效的进行后续的发想。
2.How-Might-We question
“我们如何能·….问句”是一套简单的工具,可以将POV 落地,转换为可具体探取行动的问题叙述。
How∶表示我们假设问题是可以解决的,只是我们尚不知道如何解决。
Might∶暗示现在讨论的想法不用太完美,指出大概有哪些方向即可,问题有无数的解法,我们可以有很宽广的创造空间。
We∶强调团队的重要,不是单一成员的努力就可以解决问题,是需要整个团队的力量才可以解决这个问题。
- 创意发散方法:头脑风暴
对于设计师来说,头脑风暴并不是一个什么新鲜词汇,这是一种用的十分普遍的迸发创意的方法,同时,也是被滥用的非常普遍的方法。
人们通常把创意发散和混乱的步骤相混淆,殊不知,创意的发散并不是指的是漫无目的的发散,而是用体系的方法找出最佳的解决方案。
一个体系的头脑风暴要经历这样的三个步骤:
1.充足的准备,包括知识储备和流程储备。
2.邀请合适的人,合适的人是指有专业背景的人、与项目相关度高的人,要尽量覆盖到每种角色,需要注意的是尽量不要邀请决策者。
3.workshop,按照:开始、发散、评估、验证的步骤来进行。
- 创意评估
在头脑风暴之后,我们会得到很多问题的解决方案,这个时候,我们就需要对这些创意方案进行评估,找到最佳的那个解决方案。
评估方法
1.消极选择 (Negative Selection)
- ⽤项⽬的⼀些限制条件来快速排除⼀些点⼦:
2.投票 (Voting)
- 投票的⽅式带有⼤量主观性,所以应该先把评判标准建⽴起来,供⼤家参考:
创意的具体描述和场景化
评估出来最佳的创意之后,需要对创意进行具体的描述,将这个创意进行场景化。
一个具体的点子描述需要有以下特征:
- 可测试
- 将人和行为分开
- 关注用户的问题
例子:
- 原型测试
创意提出来后,我们并不急于将这些点子立刻铺开行动,而是先做一个原型来测试,然后用制作好的原型测试这个创意的可行性,避免返工带来的资源浪费。
快速原型的原则是:
- 快速、低成本
- 可以迅速推倒、改变、反复测试
- 对原型不断思索的过程就是抛弃原来想法的过程最重要的是过程,而非某一个环境单独的行为或者成果
几种设计原型及其顺序:
六、用户流程及信息架构
- 用户流程图:
1.用户流程图从用户视角展现了用户如何使用产品的过程
2.用户流程图展现用户的选择以及他们将会选择的路径
3.用户流程图展现了基于用户选择的状态、页面视图和内容
- 信息架构:
任何时候都让用户知道TA在哪,如何到达某个页面,在他们完成事情之后能去什么地方。
包含组织系统、导航系统、标签系统、搜索系统。
七、图形概念和图形造型能力
数字图标由最初的简单满足图形化的易识别、易记忆到后来的拟物写实风格,人们对图标的美观度越来越重视再发展到现在兼具简洁实用与造型美感的扁平风格。
创作精致易识别的图形
易识别性是人机界面中图标创作的最重要特性,所以图标图形的创作大多数来源于真实世界的事物,这样创作出来的图形才能让用户感到共鸣。
八、色彩能力和规范能力
- 色彩能力
这里的色彩能力主要是指对色彩的概念、色彩模式(RGB、CMYK、HSB)有一定了解后,具备有审美的配色能力。
初学者常会使用的配色方式把别人的配色cpy下来直接用网站上找一组推荐配色用看感觉选色。正确的单色配色方式要考虑和周围元素的搭配色与色之间的梯度统一性和丰富性之间的平衡
考虑颜色的质感(轻薄、略有质感、厚重)。
单色配色示例:
- 设计规范能力
对于初学者来说,阅读设计规范,并将这些设计规范熟练的运用非常有帮助。
现在各个平台的文档也都写得十分不错。因为这本来就是针对开发者专门去做的,所以也很方便大家阅读。
iOS 的《人机交互指南》、安卓的 Material Design 等。这些品牌规范一方面是在讲各种控件怎么用、各种视图如何转换,同时也讲了很多设计的思想。这些内容是必读的,一定要有所了解,知道各个平台有什么差异,有哪些控件可以用。因为我们在设计中一定要避免重复造轮子,要减少用户的学习成本,所以一定要知道基础控件能够支持哪些功能,即使要做出一些改变,也要基于这些控件的基本行为进行变化,这就要求我们去掌握整个平台的情况。同时,这也是一个特别好的自学各个平台的途径。
九、界面能力
用户界面设计“USER INTERFACE DESIGN”,就是我们平时所说的UI。大家常常混淆几个概念:UE、UX、UI 、GUI、ID,我们一起看看他们之间的关系和区别:
界面能力是以一个UI设计师所必备的一项基础能力,因此它非常重要。
优美的界面设计,需要有以下的美学特征:
- 边界清晰
- 容器化
- 弹性
- 连续性
- 重复性
界面设计所要遵循的原则:
- 美学性:视觉设计应满足基本的普适美学
- 清晰:通过视觉元素传递给用户的信息及导航要清晰准确,不让用户迷失方向
- 隐喻:简化视觉认知,让用户能尽快地“认识”界面,图形元素符合用户对真实事物地联想,对用户界面地惯性感知
- 用户控制:视觉地设计要能够让用户感受到,用户是在控制界面,而不是被界面所控制,包括合理清晰、主次分明且容错性强的路径指引,清晰友好的用户反馈。
写在最后
能看到这,说明你是一个愿意学习和思考的同学。最近看到很多同学在问,互联网行业不景气,转行做UI设计师、交互设计师还有前景吗?我从来不觉得 UI 设计师、交互设计师是一个轻松的工作。不是简简单单能画几个 icon,能出一些界面,就算是优秀的设计师。真正重要的,是设计背后的思考,能解决真切的业务问题。哪怕是一个按钮上的文案,也要从业务和用户体验场景去思考和完善,而非一个作图的机器。
真正的水平不错的、实战经验丰富的、保持进步和学习的设计师,一直都是稀缺的。反之,作品集造假、浑水摸鱼很容易在工作中露馅儿,在行业里无法混下去。作为在互联网从业的设计师,应该多充电,多打磨自己,让自己的有更强的竞争力。
我所在的公司——知群,是一家互联网职业教育的公司,创始人马力老师是移动互联网第一批用户体验设计师。曾经做过豌豆荚、最美应用等知名产品。马力老师每周三晚上,会在知群做直播,主要讲互联网的岗位发展,会用不同的案例拆解和讲解:互联网产品思维、设计思维和运营思维。尽可能帮助想入行 UI 设计和提升的同学,建立更完整、更系统的认知和方法,也能知道什么样的作品才能真的打动面试官。
直播和课程是免费学习的,你可以添加知群的老师进行预约: