编者按：本文专门写给没入行的设计新手，不仅介绍了一个设计团队的分工，还有团队成员的工作、常见名词和软件等，绝对是新手入门最好的基础科普手册！
△早期采用GUI设计的Xerox8010Star
△iPhone界面中的UI设计
互联网视觉设计师或UI设计师一般依附于互联网产品团队之中，而不像平面设计师或服装设计师一样成立很多平面设计公司。所以我们打交道的人不一定都是同行，而可能是互联网从业者中的其他角色，如产品经理、程序员、技术团队、运营团队等。如果我们在的团队不光是设计师，那么我们就要有充分地表达能力和耐心让周遭的人理解我们的工作。互联网视觉设计师的工作主要有移动端设计、网站设计、运营设计等。如今随着UI设计师的数量越来越多，行业越来越成熟，UI设计师所需要肩负的责任越来越多。如需要了解交互知识、懂平面设计、擅长手绘等。那么UI的定义越来越丰富，现在想成为UI设计师的门槛越来越高。
△美剧《硅谷》中的创业团队
1.高层（leader）
一个团队的领袖，由董事会、董事会主席、首席执行官CEO（ChiefExecutiveOfficer）、首席技术官CTO（ChiefTechnologyOfficer）等组成。决策公司的关键事物。
主要输出：idea
使用软件：Office
2.用研团队UR（UserResearch）
通过用户研究的手段调查老板的想法靠不靠谱。用研团队保障着公司与用户之间的联系，确保研发的产品是用户所喜欢的。研发之前、研发之中、研发之后的反馈都需要用户研究团队及时参与收集数据等。
主要输出：用户研究报告
使用软件：Office、眼动仪等
3.产品经理PM（productmanager）
产品经理细化产品逻辑，产品经理或交互设计师设计原型图，原型图用来和老板汇报和交付设计师。负责产品从无到有的企划。产品经理首先的职责是在产品策划阶段向管理层提出产品文档。产品文档PRD通常包括产品的规划、市场分析、竞品分析、迭代规划等。然后在立项之后负责进度的把控、质量的把控和各个部门的协调工作。在产品管理中，产品经理是领头人，是协调员，是鼓动者，但他并不是老板。作为产品经理，虽然针对产品开发本身有很大的权力，可以对产品生命周期中的各阶段工作进行干预，但从行政上讲，并不像一般的经理那样有自己的下属，但他又要调动很多资源来做事，因此如何做好这个角色是需要相当技巧的。
主要输出：产品需求文档（PRD）、市场需求文档（MRD）、原型图（Layout）等
使用软件：文档书写软件（Office）、原型图软件（Axure、蓝湖、墨刀等）
4.项目经理（Projectmanager）
从职业角度，是指企业建立以项目经理责任制为核心，对项目实行质量、安全、进度、成本管理的责任保证体系和全面提高项目管理水平设立的重要管理岗位。项目经理是为项目的成功策划和执行负总责的人。这个职位很多公司里可能都是由产品兼顾。项目经理负责的是进度的把控和项目问题的即时解决。
主要输出：项目进度表
使用软件：文档书写软件（Office）
5.交互设计师UX或UE（UserExperienceDesigner）
把产品需求文档（PRD）优化成可交互的原型图给设计师和技术。
主要输出：交互图（prototype）
使用软件：AxureRP、蓝湖、墨刀、AdobeXD等
6.互联网视觉设计师或UI设计师（UserInterfaceDesigner）
互联网设计师不仅仅是给原型上色，设计师会根据实际具象内容和具体交互修改板式，甚至重新定义交互等。同时要提供给技术切图或PSD。一些出现过的别名：美工、全链路设计师、全栈设计师、UID、UI设计师、视觉设计师等等都是在说我们。接到原型图或交互图后，我们会根据原型图的内容来进行交互优化、排版、视觉设计。最终和总监确认后交付开发人员。如果是对接网页项目的话，我们只需要交付给开发人员：PSD、规范。如果是对接移动端项目的话，那么我们需要交付给开发人员：切图、标注、规范。为什么给网页开发的工程师（前端）不需要切图而直接给PSD即可呢？因为前端工程师其实最早和我们的职位一起并称美工，是有PS操作能力的。
主要输出：设计稿、设计规范、切图、标注等。
使用软件：Sketch、Ps、Ae、Ai等。
7.前端开发RD（ResearchandDevelopmentengineer）
开发人员有数据库端和用户端两种，一般来说我们接触的是用户端开发，他们负责还原设计。那么做网页端的用户端开发的工程师叫做前端工程师；做安卓设备开发的叫Android工程师；做苹果设备开发的叫iOS工程师。他们都指的是用户端的开发，用户端就是我们看到的一切界面。目前用户端我们接触的就是网页、安卓、iOS三种主流设备，他们开发使用的代码不一样，所以对有些特殊效果如动效、阴影等的支持有所不同。
8.后端工程师或程序构架师RD（ResearchandDevelopmentengineer）
后端工程师主要负责什么呢？后端工程师或叫程序构架师的主要工作是做数据存储。我们平时使用产品中产生的数据，如：头像、昵称、聊天、对话、图片等，均是通过互联网传输到服务器再交换信息分发回去，那么这些资料存储的架构都是后端工程师的工作。然而遗憾的是，设计师与后端工程师的接触没有太多。
9.运营或市场拓展BD
产品完成后进入运营阶段，可能会根据运营调整产品设计或设计运营图等需求。运营更加直接面对市场，所以对市场的目的也更加明确。以此推倒出市场和运营的目的往往更加直接。而有时运营的目的盈利和产品以用户为中心的思想会有冲突，这时对设计师的要求就更高了，如何调节设计审美、运营目的、以用户为中心几种目的就成了设计师的难题。
10.测试工程师QA
测试工程师在企业中一般称为软件开发测试工程师（SoftwareDevelopmentEngineerinTest，SDET）。一般为具有1-2年经验的测试工程师或程序员。有良好经验的测试工程师可以成长为产品/项目组的测试组长（SDETLead）或软件质量经理（SQAManager），负责软件质量保证，进行测试管理和领导测试团队。测试工程师的职责就是把控软件的质量。主管与客观的都会进行把控，包括体验与视觉部分。但是通常设计师需要与测试工程师合作来完成对产品视觉部分还原度的测试工作。
11.大型互联网公司
△大型互联网公司结构图
12.中型互联网公司
△中型互联网公司结构图
13.小型互联网公司
△小型互联网公司结构图
小型互联网公司人员配备较为齐全：高管负责决策和担负产品经理的角色、视觉设计师优化交互并设计视觉后输出切图和标注并且完成设计规范、前端工程师负责实现界面还原和与数据库的对接、后端工程师负责程序构架和数据库结构、测试工程师负责测试整个程序是否可用。小型互联网公司人员很少，决策很快，但是由于每个人负责的部分太大，所以经常有学杂而学不精的地方，并且人员较少所以进步更加依靠自己。
1.Leader的工作
找投资：作为一个团队的领袖，第一要务是解决团队生存问题。所以投资是一个在产品没有完成盈利模式构建之前的好方法。我们在面试时总会看到某公司处于A轮或者B轮融资阶段。这是什么意思呢？投资根据项目成熟度分为：路演、天使轮、A轮、B轮、C轮、上市等状态。随着投资的阶段也代表着项目的成熟度。这一点大家也可以在找工作时加以权衡。
招合伙人：一个好的团队领袖不应该事事躬亲。除了CEO之外还应该找到CTO、CTOO等多个高管的人选。
2.用户研究的工作
用户研究的方式主要有以下几种：
可用性测试：通过筛选让不同用户群来对产品进行操作，同时观察人员在旁边观察并记录。可用性测试的要求是用户不可以是互联网从业者而应该是真实产品的用户群体。
焦点小组：一般有6-12人组成，由一名专业人士主持，依照访谈提纲引导小组成员各抒己见，并记录分析。并且在焦点小组的房间里会有一扇单向玻璃窗，用户是看不到里面有谁的。而在里面坐着的通常是开发团队，他们可以清晰地看到用户是如何吐槽他们的产品的，但是他们没有权利直接和用户进行解释。
问卷调查：可分为纸质调查问卷、网络问卷调查。依据产品列出需要了解的问题，制成文档让用户回答。问卷调查是一种成本比较低的用户调查方法。
用户画像：根据产品的调性和用户群体，用户研究团队可以设计出一个用户的模型，这种研究的方式被称为用户画像。用户画像是由带有特征的标签组成的，通过这个标签我们可以更好地理解谁在使用我们的产品。用户画像建立后，每个功能可以完成自己的用户故事：用户在什么场景下需要这个功能。以此，我们所设计的功能就会更接近用户实际的需要。
用户反馈和大数据分析：根据市场提供的反馈和数据得出客观的判断和合理的推测。用户反馈也是用户研究的一个重点，用户反馈主要是用户通过产品的反馈入口主动向开发者提出的意见。
△图为美剧《硅谷》中焦点小组测试桥段
3.产品经理的工作
产品经理负责协调整个团队的进程，工作十分复杂。产品经理与整个团队都要打交道。
产品经理的产出很大一部分是在沟通和协调上。如果单纯提炼输出文件，有以下几种：
MRD：即「商业需求文档（BusinessRequirementDocument）」。此文档的受众是商务、运营、市场等人员。文档表述的是产品的业务模式，明确产品的用户人群，产出内容包括产品模式、业务模式、运营模式市场模式等。
原型图：也称为线框图，即用线条、图形绘制出的产品框架。
△图为产品需求文档PRD模板
4.交互设计师的工作
交互图：表现出操作行为后，对象之间的的关系，和触发的下一步信息。与产品经理设计出来的线框图或原型图不同的是，交互设计师完成的交互图更加细腻，并且可以在手机上运行，模拟APP完成以后的使用。
△图为交互图案例
5.UI设计师的工作
优化原型图：根据具体视觉元素对交互图提出优化方案。
视觉设计：依据人机交互、操作逻辑等原理，对原型图进行界面的设计与美化。
切图：根据不同平台尺寸，输出相应倍数的图片。
标注：利用工具在输出页面上标注各个元素之间的尺寸与情况备注。
项目走查：开发完成后，选择主流机型进行画面审查工作。
视觉总结：对设计作品中的字体、字号、颜色、icon、模块等元素做出展示并说明。
△图为UI设计稿
6.前端工程师的工作
网页前端工程师：完成网页前端界面的编程工作。从视觉设计师手中接过PSD后切图并用网页代码重新组建好页面，并且和数据库端给到的接口联调，没问题后放到服务器上网站就可以访问了。使用的代码语言主要有：HTML、CSS、JS等。
苹果软件工程师：完成iOS平台上app的程序开发，并从视觉设计师手中接过切图和标注，完成客户端编译，并和后端工程师联调后上线。主要使用的代码语言有：Object-C、Swift等。
安卓软件工程师：也称为Android开发工程师。完成安卓平台上APP的开发，并从视觉设计师手中接过切图和标注，完成客户端编译，并和后端工程师联调后上线。主要使用的代码语言有：java、Kotlin等。
△图为前端HTML代码
7.后端工程师的工作
数据库编程：分为网状数据库、层次数据库、关系数据库，主要利用数据库编程来存储管理数据。主要使用的语言有：PHP、JSP、JAVA等。
△图为后端编译部分代码
8.测试工程师的工作
黑盒测试：以用户角度测试，摸黑测试。这个测试方法就是按照用户的视角摸黑测试。
白盒测试：按照产品需求文档的功能点逐一测试。
灰度测试：直接给30%的用户发送新版本升级，70%用户没有发放灰度包。这种测试方法就是把我们的产品直接发放给部分用户来听取反馈意见。
9.运营人员的工作
运营项目：运营的具体手段主要分为：渠道运营、内容运营、活动运营、品牌运营。即通过各种手段进行不同的组合，将用户与产品更好的连接，得到特定数据的增长，并完善产品价值、持续其商业价值。
△五谷杂粮运营图插画作者：冯珊珊
10.维护人员的工作
维护产品所需要硬件的状态。包括但不限于：
域名：（DomainName），将ip地址转化为便于人们记忆的英文名称等。域名是按年收费的。
11.人力资源的工作
招聘：主要流程是确定人员需求、制定招聘计划、发布信息、人员甄选、办理入职等工作。
福利薪酬管理：制定企业员工的福利薪酬制度，日常考勤、绩效考核、福利发放等工作。
1.UED
我们老听UED。UED就是：UserExperienceDesign（用户体验设计）的简称。UED是进行产品策划的主力之一，他们用自己的知识、经验、设计能力拿出设计方案。能够用自己的互联网知识来设计出行业专家想实现的操作，而付诸以商业营销。UED团队包括：交互设计师（InteractionDesigner）、视觉设计师（VisionDesigner）、用户体验设计师（UserExperienceDesigner）、用户界面设计师（UserInterfaceDesigner）和前端开发工程师（WebDeveloper）等等。
UED是以用户为中心的一种设计手段，以用户需求为目标而进行的设计。设计过程注重以用户为中心，用户体验的概念从开发的最早期就开始进入整个流程，并贯穿始终。可见，UED并不是一个特指，而是指的是全体互联网产品团队的一种思维，就是以用户为中心来做设计。这种理念贯穿到设计、代码、运营等方方面面。UED是一个以用户体验为原则的团队。
2.UCD
衡量一个好的以用户为中心的产品设计，有三个维度：
特别说明：大家可能老误会UED和UCD是某个部门的原因是因为很多大公司都设置了用户体验部门，如腾讯网UED、阿里巴巴国际UED等团队。所以UED和UCD不光特指某一个部门，更是一种团队的模式。
经过我们对上文的阅读，我们知道了互联网视觉设计师在团队中的主要职责。归纳一下，我们的工作主要是：第一，根据原型图和PRD文档优化原型图和交互图的交互设计；第二，根据需求完成视觉设计并完成设计规范；第三，根据技术的需求完成切图、标注、命名PSD、设计动效等工作；第四，有时还会担负起公司的运营设计和企业形象设计或者公司内部的平面设计等。我们的工作越来越复杂，这就要求我们掌握的知识也要越来越多。
△目前互联网设计师需要具备的三种能力
互联网设计师主要需要掌握的能力主要是以下几种：排版能力，交互知识，图标绘制，插画绘制，手绘，运营图设计能力，专题设计能力，网站设计能力，移动端规范，基本代码原理，展示作品的能力，PPT设计能力，表达能力，H5设计能力，LOGO设计等。
1.界面设计软件
AdobePhotoshop简称PS。三十年老店不会让你失望。来自一个行业具有垄断地位的公司的好处是你不用担心研发公司倒闭而软件停止更新，同样由于开发公司的实力所以PS支持Windows平台和Mac平台。这个好处是毋庸置疑的了。PS的版本三十年中数不胜数，而我们应该永远学习最新的版本。而且PS是Sketch和AI无法代替的，它的像素图形处理，它设计运营图与其他图像的能力无所匹敌。
AdobeIullstrator简称AI。同样来自母公司Adobe，拥有比PS稍微年轻一点的历史。由于他们都是Adobe旗下的软件，所以两个软件可以互通甚至直接拷贝，那么配合度要比不同厂家的软件高得多了。PS在UI设计中主要负责界面设计和图形处理，AI可以负责线性图标的设计，设计后直接拷贝进PS里即可。不能直接用AI作图的原因是AI不具备切图和标注与团队合作等多种PS可以轻松办到的事情。
看完了上两种软件你一定还是心有不甘希望用AI的矢量作图功能，配合PS可以切图标注的扩展性对吧，那么就诞生出了Sketch这款软件。在作图的功能上更加接近AI，拥有矢量图形功能，而切图标注甚至比PS更加方便快捷。遗憾的是它并非Adobe出品，所以和PS与AI的协作上差了一些。并且由于不是大公司出品总有一些不放心：比如与苹果决裂后，Sketch需要在官方购买并安装软件包而并非直接从苹果下载；比如由于PC盗版严重暂时在Windows系统下是不可用的等等。但是总之这款软件现在很受UI设计师喜爱。
AdobeXD全称AdobeExperienceDesign。集原型、设计和交互于一体的设计软件。传言将会是skech的劲敌。厂商背景决定了它支持Windows操作系统，而且XD的优势是原型图和设计都可以搞定。所以在国外比较流行，国内设计业界鲜有同行使用，所以不是必学。
AdobeFireworks列出来这款软件并不代表大家要学习，因为这款初心是为网页设计师所设计的软件已经退役了。
2.动效软件
Sketch没有动效，小伙伴怎么办？别着急，Princple出现了。这款软件可以直接点击大钻石导入Sketch文件并设计出在手机可交互的动效，堪称UI设计师的福音。但是不足之处和Sketch一样，就是不支持Windows系统。
Flinto交互原型利器，只可以Mac平台使用。
Origami交互原型和动效的一个轻巧的工具，同样只可以Mac平台使用。
Framer交互设计和原型图设计工具，偏代码方向。只可以Mac平台使用。
3.原型图工具
墨刀，国产原型图工具，语言优势加上服务器速度响应快，而且是一款Web应用，也就是说通过浏览器访问网站即可设计出原型图来。
AxureRP老牌产品经理原型图工具，有多式多样的插件可以实现多种效果的原型图。
4.前端工具
AdobeDreamweaver前段编译工具，Adobe生产，有设计和代码模式。
AdobeMuseAdobe公司生产的网站开发工具，支持可视化设计，并且生产出网页前端代码。
1.好用
以用户为中心
2.功能清晰
Don’tmakemethink
3.好看
4.好实现
无论做什么，只要你拥有一套好的方法论加上刻意练习都会获得很好的结果。互联网设计是崇尚经验的工作，随着经验的积累和方法论的沉淀，我们一定能够取得不错的进步。希望真正喜欢互联网设计的人都能够实现自己的职业目标。