UI、UX傻傻分不清楚?来一份清晰详尽的设计师分工指南

张无极

设计是一个相当广义而模糊的术语。当有人说“我是一个设计师”时,你很难知道他每天做些什么。

设计涵盖了多领域和多职责,从工业设计(汽车、家具)到印刷设计(杂志,其他出版物),再到科技行业(网站,手机应用),随处可见不同职责的设计师。而随着科技公司不断地涌入人机交互领域,应运而生了许多新的设计师角色 —— UI设计师、UX设计师、视觉设计师、交互设计师、GUI设计师等。

这么多相似的名字,你是否也跟我一样陷入傻傻分不清的迷雾中?下面就让我们一起拨开迷雾,重新认识这些新型设计师们吧。

本篇介绍的设计师有:

UX设计师/交互设计师

视觉设计师:UI/GUI设计师;平面设计师

互动设计师(动效设计师)

产品设计师

用户研究工程师(用户研究专员)

UX设计师 / 交互设计师

UX ,英文为 User Experience ,指的是用户体验。一般而言,国内 UX 设计师,也称为交互设计师或 UE 设计师(而国外的 UX 设计师指的是用户体验设计师,交互设计师指的是动效设计师)。

UX 设计师主要关注用户对产品的体验感受,确保产品逻辑的流程可以跑得通,甚至跑得顺、跑得精彩。正如一千个人眼里有一千个哈姆雷特,一个设计问题往往也没有唯一解。UX 设计师会深入场景,探索多种不同的解决方案,这种深入思考通常能产生创新方案。

一般而言,UX设计师使用一些用户研究方法 & 设计方法作为辅助,通过现场观察、可用性测试、用户访谈等用户研究方法了解用户使用行为,发现产品体验问题。

说到这里,会发现国外 UX 设计师也在做用研,有木有? 而国内这一点上其实除了有完整 UED 设计部门的较大互联网公司(分工比较明确,UX 设计师很少会去做访谈相关内容,普遍都是用研童鞋来负责这一部分),创业公司和设计咨询公司中的 UX 设计师基本上也都会兼顾用研;UX 设计师们通过头脑风暴、角色扮演、故事版等设计方法探索设计机会点,向着创造出“最好的”用户体验目标而前进,典型案例就是为新用户设计一套令人愉悦的登录流程。

总的来讲,UX设计师是设计人与信息产品的流程和关系,归根结底都要研究人、事、物的联系,它是一个囊括计算机工程、心理学、设计的交叉学科。

“进行利益相关者访谈、用户访谈,挖掘用户需求,提炼用户任务流;完整体验不同产品,挖掘交互设计模式,设计交互模式,撰写交互设计稿,并最终形成交互设计规范/UIspec;跟进视觉设计和开发,确保产品正常上线” 这可能就是UX设计师日常事项。

对于UX设计师,你可能会听到他们很自然的说:“我们应该在用户登录成功后展示一个感谢页面。”

设计产出物 :流程图,网站地图,故事版,交互设计原型图(线框图),UIspec ,交互设计规范

工具:axure,OmniGraffle,Visio,Sketch,Illustrator,Fireworks,InVision,PPT,Keynote,Photoshop

来自一位 UX 设计师(Neway Lau on Dribbble)的应用界面案例。

视觉设计师

说起视觉设计师,通常会联想到“扣像素”的处女座,相比于UX设计师梳理流程、组织信息架构等内容,他们更在意精美的图标、按钮等视觉元素以及合适的排版。视觉设计师经常在 Photoshop 中 4x 到 8x 的缩放级别中操作,细致刻画容易忽略的小细节。

一般国内而言,诸如UI设计师、GUI设计师、运营设计师、平面设计师等名称各异的设计师头衔,在不同场合也都被称为视觉设计师。听到这里,是不是已经开始迷失在这些形形色色的概念里呢,下面就让我一一来解密这些设计师吧。

1. UI 设计师 / GUI设计师

UI,英文为User Interface,指的是用户界面,也就是人与机器互动的界面。可以理解为UX的一个分支,不同于 UX 设计师需要关注产品的整体感觉,UI 设计师更关注产品以怎样的界面呈现。其实互联网领域中,UI 和 UX 设计师的界限相当模糊,在很多创业公司,这两个设计角色是合二为一的。

国内而言,目前一般把屏幕上显示的图形用户界面(GUI :Graphic User Interface)都简单称为UI。我们经常听到的UI设计师,其实指的是GUI设计师,也就是图形界面视觉设计师,负责产品或网站的图形、图标、色彩、视觉风格等,决定营造出什么样的视觉体验。从视觉层面把控产品界面设计,确保UI稿在视觉上清晰的传达UX设计师的交互设计稿,也就是高保真视觉稿。

举个栗子,在设计一个数据分析界面时, UI 设计师可以决定使用滑块还是控制旋钮,通过这样的控件来阐述图表带来的直观感受。此外 UI 设计师还负责制定视觉设计规范,确保产品设计的一致性;在规范中,明确一些UI 控件/组件的使用行为,比如错误或警告提示。

“熟悉不同分辨率的多端产品,诸如桌面端,Web 端和手机设备;能够完成高质量的视觉设计稿——从概念设计确定设计风格到详细设计,设计内容包括图标、图形界面等;执行统一的设计语言,撰写并完善网站的设计规范,为产品注入美和生活气息。” 这可能就是UI设计师日常事项啦。

对于UI设计师,你可能会听到他们很自然的说:“登录和注册链接应该移到右上角”、“这个字距不行,那个按钮应该向左移动 1 像素!”

设计产出物 :视觉设计稿,视觉设计标注规范 ,视觉设计规范文档,视觉切图

工具:Photoshop,Sketch,Illustrator,Fireworks,markman(视觉标注软件)

2. 平面设计师

平面设计师,应该可以说是设计师的起源,经常被称为美工,有时冠以品牌设计师或运营设计师头衔。在UI设计师、UX设计师等新兴设计头衔诞生前,视觉设计师其实等同于平面设计师。平面设计师从事的设计项目,具体来讲包含网页设计、包装设计、DM广告设计、海报设计、平面媒体广告设计、POP广告设计、样本设计、书籍设计、刊物设计、VI设计等,也就是各个行业都需要平面设计师,以达到提升品牌形象等作用。逼格点说,平面设计师骨子里就是玩意境的~~

近年来由于互联网催生的UI设计师热潮,越来越多的平面设计师转行为UI设计师。因为初级的UI就是平面设计的一个延续,再加上扁平化风格的流行趋势,真真是对了平面设计师的技能树,要知道平面设计师对于颜色、造型、排版等都是熟手中的熟手。

但需要注意的是平面设计师的设计——logo、海报等,更偏情感创意类,往往是天马行空的视觉创意思维,更强调感性,通过设计让用户产生情感触动,提升品牌价值;而UI设计师的设计——更偏向于产品类,基于用户需求,根据目标用户的喜好,探索设计风格,进行界面布局,归根到底UI设计师兼顾感性的同时更偏理性,通过解决问题获取更好地体验。

因此建议想转行的平面设计师可以了解一些关于界面、产品等入门知识,诸如ios\Android的各种设计规范、移动应用UI设计模式、about face 3等;也可以多多把玩手机中的有趣应用,试着理解分析下。

互动设计师(动效设计师)

每次说起互动设计师,我都无比纠结该怎么说明,英文是interaction designer,是不是觉得也可以翻译为交互设计师呢,是不是又陷入了傻傻分不清的迷雾呢。 我觉得产生这个疑问的原因,其实是国内国外行情的不同,在国外interaction designer 真的就是互动设计师,而不是国内翻译过来理解的交互设计师,而国内我们经常说的交互设计师其实在国外被称为UX设计师。

感觉自己又绕进去啦,你明白了吗?下面还是以实际案例来阐述什么是互动设计师吧,至于什么是国内的交互设计师详情可看“UX设计师”段落。

刷新 iPhone 手机邮箱应用时,还记得那个流畅平滑的转场动效吗?它就是出自互动设计师之手。不同于视觉设计师设计静态界面元素,互动设计师擅长将创意概念转化为有视觉冲击力的互动作品,比如用流畅动效,模拟用户操作界面过程。举个例子,一个应用的菜单怎样滑入、使用哪种转场效果以及按钮如何调起,互动设计师将其概念实现为有视觉冲击力的互动模型。

“精通图形设计、动态图形和数字艺术;对排版和色彩高度敏感;对材质和结构有所了解,并能够控制动态效果;了解 iOS,OS X,Photoshop 和 Illustrator ,同时能够熟练使用 Director(或同类工具),Quartz Composer(或同类工具),3D 计算模型进行动效图形设计”这可能就是成为互动设计师的必备技能了

对于互动设计师,你可能会听到他们很自然的说:“这个菜单应该从左侧淡入,时间为 800ms。”

设计产出物:互动作品,诸如gif格式图片、视频等

工具:AfterEffects,Quartz Composer,Flash,Origami

产品设计师

产品设计师又是一个宽泛的名词,顾名思义就是设计产品的,根据实际的用户/商业需求,设计实体/互联网等各类产品,以满足相应的用户/商业需求、解决对应的问题。也就是说互联网之前,产品设计师普遍研究人与环境的关系,提炼需求,设计实体产品,如家具产品、日用品等;而随着互联网浪潮来临,互联网领域的产品设计师,更多设计的是虚拟互联网产品,如网页、APP等。下面主要介绍互联网领域的产品设计师。

简单来讲,产品设计师就是一个需要为产品视觉和体验整体负责的设计师。

他的角色不易确定,并且不同的公司存在差异性。一个产品设计师可能会做少量的前端工作,组织用户研究,设计用户界面并且绘制视觉元素。由始至终,产品设计师都需明确待解决的问题,提出解决方案,然后设计、开发、测试,并不断迭代更新。一些公司希望保证不同的设计角色之间可以流畅协作,所以设置了“产品设计师”这个职位来激励整个设计团队保持整体的用户体验,包括用户研究、交互设计以及视觉设计。但其实大部分公司使用“UX 设计师”,甚至于仅使用“设计师”作为统称。有时候简单了解职位描述,可以让你更容易理解公司中设计团队是如何划分职责的。

总的来讲,产品设计师负责各个方面的体验设计工作:用研、交互、视觉,确保能够制作精确到像素的高保真原型,并且推动开发Web和移动端的新功能。

设计产出物:互联网时代前:家具产品、日用品等;互联网浪潮来临:网页、APP

用户研究工程师(用户研究专员)

“用研是用户需求的捍卫者。”

用研的目标是回答这两个紧密相关的问题:“你的用户是哪些? 你的用户需求是什么?”。通常,用研需要访谈用户,挖掘庞大的商业数据,收集并整理在其中的发现,如可用性测试、焦点小组、数据分析等。我们都知道设计是一个持续迭代的过程,所以用研们通过组织A/B 测试来筛选更符合用户需求的设计方案。一般而言,用研通常都是大公司的支柱,因为在大公司中才可以接触到足量的数据,有充足的机会统计显著的结论。

用户研究员,通常与产品团队共同明确调查目标;设计研究方案,设法了解用户行为与态度;能够使用大量的定性研究和少量的定量研究(比如调查问卷)来组织用户研究。UX 设计师偶尔也会兼顾下用研的角色的。

你可能会听到他们很自然的说:“从我们的调查可以看出,一个典型用户应该blabla。”

研究产出物:用户画像,A/B 测试报告,可用性测试报告,专家评估报告,焦点小组报告,用户访谈报告,数据分析报告等

工具:Mic,Paper,Docs,PPT,Keynote,Excel,SPSS

此文为两位译者根据原文,结合国内实际情况修改、整理出的成果,较原文有较大改动。

原文作者|Lo Min Ming    翻译|滕玥    校对|小王子Mayday

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 199,393评论 5 467
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 83,790评论 2 376
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 146,391评论 0 330
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 53,703评论 1 270
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 62,613评论 5 359
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,003评论 1 275
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,507评论 3 390
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,158评论 0 254
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,300评论 1 294
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,256评论 2 317
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,274评论 1 328
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,984评论 3 316
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,569评论 3 303
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,662评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,899评论 1 255
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,268评论 2 345
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 41,840评论 2 339

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 171,259评论 25 707
  • 随着移动互联网的迅猛发展,使得移动产品设计人员急缺。由于高薪酬,很多其他行业设计师转行做UI设计。 那么到底什么是...
    张安松阅读 2,539评论 0 33
  • 文/沐小笙 她坐在七层半的楼梯角落,再半层上是少有人问津的楼顶,而半层下是光明又嘈杂的大学生活。她压抑着自己的哭声...
    榄仁小姐写字的地方阅读 450评论 1 1
  • 最近身体一直没有休息好,总是感觉很乏,但今天早上做了个玉米饼,豆浆,果汁,蒸个包子,宝吃了不少,就是做的鱼,淡了,...
    艳儿吖阅读 270评论 0 0
  • 大雨在倾盆而下 屋檐边,有一个老奶奶 对面红灯中 小小少年在人行横道上 手里举着小伞,一蹦一跳地往前“奔跑” (文...
    李易峰女友阅读 196评论 1 3