“設(shè)計(jì)” 是個(gè)既籠統(tǒng)又模糊的詞。每當(dāng)別人說(shuō) “我是個(gè)設(shè)計(jì)師” 時(shí)，你其實(shí)沒(méi)法立馬知道他／她每天的工作究竟是干嘛的?！霸O(shè)計(jì)師” 的帥旗下，其實(shí)圍繞著許多分工迥異的角色。

從工業(yè)設(shè)計(jì)（汽車、家具等）到傳統(tǒng)印刷業(yè)（雜志、出版業(yè)等），再到新媒體科技業(yè)（網(wǎng)站、移動(dòng)端 app 等），許多行業(yè)都有設(shè)計(jì)相關(guān)的角色。由于科技公司總是需要更多地與用戶互動(dòng)界面打交道，許多新的設(shè)計(jì)職位出現(xiàn)了。例如 “UX 設(shè)計(jì)師” 和 “UI 設(shè)計(jì)師” 這樣的職位常常讓圈外人看不懂。甚至從其他行業(yè)跨界而來(lái)的設(shè)計(jì)師有時(shí)也搞不清楚它們有什么區(qū)別。

讓我們?cè)囍鴣?lái)慢慢把這些名詞背后的意思梳理清楚吧！

UX 設(shè)計(jì)師（用戶體驗(yàn)設(shè)計(jì)師）

UX 設(shè)計(jì)師首要關(guān)心的是產(chǎn)品用起來(lái) “感覺(jué)怎么樣”。任何某一個(gè)設(shè)計(jì)上的問(wèn)題都沒(méi)有單一最優(yōu)解，所以 UX 設(shè)計(jì)師要通過(guò)探索許多不同的方案來(lái)嘗試解決一個(gè)特定的用戶問(wèn)題。往寬了說(shuō)，UX 設(shè)計(jì)師的職責(zé)就是確保產(chǎn)品的每次交互都是符合用戶邏輯的。為了達(dá)到這個(gè)目的，UX 設(shè)計(jì)師常用的方法是進(jìn)行面對(duì)面的用戶訪談，并且觀察用戶的自然行為模式。

通過(guò)發(fā)現(xiàn)和定義在語(yǔ)言和非語(yǔ)言的層面影響用戶體驗(yàn)的問(wèn)題，他們改良、迭代，最終創(chuàng)造出 “最佳” 的用戶體驗(yàn)。舉個(gè)例子，為首次使用產(chǎn)品的新用戶設(shè)計(jì)一個(gè)充滿驚喜的新手導(dǎo)引，便是 UX 設(shè)計(jì)師的工作。

“定義互動(dòng)模型、用戶任務(wù)流和 UI 的細(xì)節(jié)；就使用場(chǎng)景、端到端的體驗(yàn)、互動(dòng)模型和界面設(shè)計(jì)與相關(guān)人員進(jìn)行溝通；與創(chuàng)意總監(jiān)和視覺(jué)設(shè)計(jì)師一起將 Twitter 的視覺(jué)識(shí)別融入到功能中；開(kāi)發(fā)、維護(hù)設(shè)計(jì)草稿、效果圖和其他細(xì)節(jié)。”——一位 Twitter 的 UX 設(shè)計(jì)師談及他的工作內(nèi)容。

一位 UX 設(shè)計(jì)師做的 app 界面草稿（Kitchenware Pro Wireframe Kit by Neway Lau on Dribbble）

典型作品類型：界面草稿、故事版、網(wǎng)站架構(gòu)

常用軟件工具：Photoshop、Sketch、Illustrator、Fireworks、InVision

你可能會(huì)聽(tīng)到他們說(shuō)：

“用戶注冊(cè)完畢之后。我們應(yīng)該在頁(yè)面上顯示‘謝謝’?！?

UI 設(shè)計(jì)師（用戶互動(dòng)界面設(shè)計(jì)師）

不像 UX 設(shè)計(jì)師需要關(guān)心產(chǎn)品給人的整體感覺(jué)，UI 設(shè)計(jì)師特別在意產(chǎn)品 “看起來(lái)怎么樣”。他們負(fù)責(zé)設(shè)計(jì)每個(gè)界面或者頁(yè)面，確保 UX 設(shè)計(jì)師定下的產(chǎn)品方向被用 UI 視覺(jué)語(yǔ)言充分展現(xiàn)出來(lái)。比如說(shuō)，在創(chuàng)建一個(gè)數(shù)據(jù)分析后臺(tái)界面時(shí)，一個(gè) UI 設(shè)計(jì)師也許決定會(huì)把最重要的內(nèi)容置頂，或者思考調(diào)節(jié)某個(gè)圖表最符合直覺(jué)的操作方式是 slider 還是控制鈕。

UI 設(shè)計(jì)師另一個(gè)典型的負(fù)責(zé)領(lǐng)域就是準(zhǔn)備一份綜合性的設(shè)計(jì)手冊(cè)，確保在產(chǎn)品內(nèi)出現(xiàn)的各種設(shè)計(jì)語(yǔ)言的一致性。保持視覺(jué)一致性、定義某些互動(dòng)行為（例如軟件報(bào)錯(cuò)、警告狀態(tài)等）都屬于 UI 設(shè)計(jì)師的職責(zé)范圍。

“構(gòu)建屬于 AirBnB 的視覺(jué)語(yǔ)言，并且將它們部署到網(wǎng)站的各處；編寫全網(wǎng)站層面的風(fēng)格手冊(cè)?！薄狝irBnB 的 UI 設(shè)計(jì)師如此形容他的工作。

UI 設(shè)計(jì)師和 UX 設(shè)計(jì)師之間的界限其實(shí)非常模糊。有些公司會(huì)把這兩個(gè)角色合二為一。這種做法也挺常見(jiàn)的。

一位 UI 設(shè)計(jì)師定義的某 app 的總體排版和視覺(jué)調(diào)性（Metro Style Interface 4 by Ionut Zamfir on Dribbble）

常用軟件工具：Photoshop、Sketch、Illustrator、Fireworks

你可能會(huì)聽(tīng)到他們說(shuō)：

“那個(gè)登錄／注冊(cè)的鏈接應(yīng)該被挪動(dòng)到右上角?！?

視覺(jué)設(shè)計(jì)師（平面設(shè)計(jì)師）

視覺(jué)設(shè)計(jì)師從事的是 “像素級(jí)別” 的工作。如果你問(wèn)一個(gè) “非設(shè)計(jì)師”，設(shè)計(jì)師是干嘛的，他／她首先想到的也許就是視覺(jué)設(shè)計(jì)師做的事情。視覺(jué)設(shè)計(jì)師不關(guān)心互動(dòng)界面之間是如何相連，或者用戶如何與產(chǎn)品互動(dòng)。他們集中精力做的，是繪制出優(yōu)美的圖標(biāo)、按鈕、其他視覺(jué)元素，以及合適的字體。視覺(jué)設(shè)計(jì)師總是花大力氣去改善那些常被他人忽視的細(xì)節(jié)，并且設(shè)計(jì)的時(shí)候經(jīng)常在 Photoshop 里把作品放大到四至八倍大小。

“做出高質(zhì)量的視覺(jué)設(shè)計(jì)——從概念到執(zhí)行，包括為臺(tái)式機(jī)、網(wǎng)站、移動(dòng)端做出不同的分辨率的（圖標(biāo)、圖形和營(yíng)銷材料等等）。創(chuàng)造出體現(xiàn)品牌內(nèi)涵的視覺(jué)系統(tǒng)，不斷迭代更新，部署視覺(jué)語(yǔ)言，并且將美感與生命注入產(chǎn)品?！薄雀璧囊曈X(jué)設(shè)計(jì)師這樣描述他的工作。

UI 設(shè)計(jì)師同時(shí)肩負(fù)平面設(shè)計(jì)的任務(wù)的現(xiàn)象也很常見(jiàn)。有些公司選擇不設(shè) “視覺(jué)設(shè)計(jì)師” 這一職位。

一位視覺(jué)設(shè)計(jì)師制作的排版手冊(cè)，調(diào)整每一個(gè)像素以確保完美的最終結(jié)果（iOS 7 Guide Freebie PSD by Seevi kargwal on Dribbble）

常用軟件工具：Photoshop、Sketch

你可能會(huì)聽(tīng)到他們說(shuō)：

“字間距完全錯(cuò)了！而且那個(gè)按鈕應(yīng)該往左移一個(gè)像素！”

互動(dòng)設(shè)計(jì)師（動(dòng)效設(shè)計(jì)師）

還記得在 iPhone 自帶的原生郵件 app 里，當(dāng)你往下拉刷新郵件時(shí)那個(gè)微妙的 “彈跳” 動(dòng)畫(huà)么？那就是動(dòng)效設(shè)計(jì)師的工作成果。不像視覺(jué)設(shè)計(jì)師總是跟靜態(tài)的素材打交道，動(dòng)效設(shè)計(jì)師創(chuàng)造的是 app 里的那些動(dòng)畫(huà)。他們要解決的是當(dāng)用戶的手指觸碰了以后，互動(dòng)界面應(yīng)該作何反應(yīng)。舉例來(lái)說(shuō)，他們決定菜單欄應(yīng)該怎么樣滑入，該用什么樣的轉(zhuǎn)場(chǎng)效果，以及一個(gè)按鈕應(yīng)該如何呈扇形展開(kāi)。做得好的話，動(dòng)效可以提供視覺(jué)上的操作暗示，提示用戶如何操作，并且成為互動(dòng)界面不可或缺的一部分。

“（這份工作需要）熟悉平面設(shè)計(jì)、動(dòng)效圖像、數(shù)字藝術(shù)，對(duì)字體和顏色要敏感，對(duì)質(zhì)感和肌理要有感覺(jué)，對(duì)動(dòng)畫(huà)的悟性也要高。必須要懂 iOS、OS X、Photoshop、Illustrator 、Director（或者可以替代的軟件）、Quartz Composer（或者可以替代的軟件）、3D 電腦建模和動(dòng)態(tài)圖形處理?！薄O果公司的互動(dòng)設(shè)計(jì)師這樣說(shuō)。

一位互動(dòng)設(shè)計(jì)師需要決定菜單欄以什么形式擴(kuò)散（iOS Menu Concept by Jeremey Fleischer on Dribbble）

常用軟件工具：AfterEffects、Core Composer、Flash、Origami

你可能會(huì)聽(tīng)到他們說(shuō)：

“菜單欄應(yīng)該在 800 毫秒內(nèi)從左淡入?！?

UX 研究員（用戶研究員）

UX 研究員是用戶體驗(yàn)的專家。研究員主要需要回答兩個(gè)問(wèn)題：我們的用戶是誰(shuí)，以及他們想要什么。他們的工作通常包括訪談?dòng)脩?、調(diào)研市場(chǎng)數(shù)據(jù)并且收集結(jié)論。設(shè)計(jì)是一個(gè)持續(xù)迭代的過(guò)程。研究院可以通過(guò)做 A/B 測(cè)試（譯者注：一種通過(guò)隨機(jī)分配不同版本測(cè)試效果的調(diào)研方法）來(lái)對(duì)比哪種設(shè)計(jì)更好地滿足用戶的需求。在大公司的開(kāi)發(fā)團(tuán)隊(duì)里，UX 研究員們往往有著中流砥柱一般的地位。他們通過(guò)分析巨量數(shù)據(jù)，獲得統(tǒng)計(jì)學(xué)上可靠的結(jié)論。

“和產(chǎn)品團(tuán)隊(duì)緊密合作，確定研究主題；設(shè)計(jì)出考察用戶行為和態(tài)度的調(diào)研；做一系列調(diào)研問(wèn)卷，包括許多定性試驗(yàn)和一些定量試驗(yàn)。”——Facebook 的 UX 研究員這樣描述他的工作內(nèi)容。

UX 設(shè)計(jì)師有時(shí)候也會(huì)做些 UX 研究員的工作。

典型作品類型：用戶畫(huà)像、A/B 測(cè)試結(jié)果、用戶調(diào)研與訪談

常用軟件工具：Mic、Paper、Docs

你可能會(huì)聽(tīng)到他們說(shuō)：

“我們的調(diào)研顯示，一位典型的用戶……”

前端工程師（UI 工程師）

前端工程師負(fù)責(zé)為產(chǎn)品創(chuàng)造出功能完備的互動(dòng)界面。在大多數(shù)情況下，UI 設(shè)計(jì)師把靜態(tài)的效果圖給前段工程師。接著，后者把效果圖轉(zhuǎn)化為可以用的、富有互動(dòng)性的用戶體驗(yàn)。前端工程師同時(shí)也負(fù)責(zé)通過(guò)編程，把動(dòng)效設(shè)計(jì)師設(shè)計(jì)的動(dòng)畫(huà)變成現(xiàn)實(shí)。

常用軟件工具：CSS、HTML、JavaScript

你可能會(huì)聽(tīng)到他們說(shuō)：

“我用的是 960 像素寬、12 列的網(wǎng)格系統(tǒng)?！?

產(chǎn)品設(shè)計(jì)師

產(chǎn)品設(shè)計(jì)師是一個(gè) “大包大攬” 的職位。產(chǎn)品設(shè)計(jì)師通常在產(chǎn)品 “用起來(lái)什么感覺(jué)” 和 “看起來(lái)怎么樣” 這些方面都有所涉及。

“產(chǎn)品設(shè)計(jì)師” 的角色并沒(méi)有一個(gè)嚴(yán)格的定義，在每個(gè)公司都可能會(huì)有些不同。產(chǎn)品設(shè)計(jì)師也可能會(huì)稍微做點(diǎn)前端編程、搞搞用戶調(diào)研、設(shè)計(jì)互動(dòng)界面，或者兼顧設(shè)計(jì)些平面視覺(jué)素材。產(chǎn)品設(shè)計(jì)師的工作從項(xiàng)目自始至終貫穿到底：定義最初的問(wèn)題、設(shè)定標(biāo)準(zhǔn)、然后做設(shè)計(jì)、測(cè)試、迭代不同的解決方案。有的公司希望各設(shè)計(jì)崗位之間更加流暢地合作，共同對(duì)用戶體驗(yàn)、用戶調(diào)研和視覺(jué)設(shè)計(jì)元素負(fù)責(zé)，所以故意不設(shè)置 “產(chǎn)品設(shè)計(jì)師” 這個(gè)角色。

不過(guò)，有的公司籠統(tǒng)地管設(shè)計(jì)團(tuán)隊(duì)所有人都叫 “UX 設(shè)計(jì)師” 或者直接 “設(shè)計(jì)師”。要搞清楚這個(gè)公司設(shè)計(jì)團(tuán)隊(duì)的分工，讀一讀職責(zé)說(shuō)明是最好的辦法。

“負(fù)責(zé)設(shè)計(jì)的方方面面：互動(dòng)、視覺(jué)、產(chǎn)品，并且做出原型。然后繪制好像素級(jí)別的完美效果圖，并且為網(wǎng)絡(luò)端盒移動(dòng)端的新功能做前端編程?！盤interest 的產(chǎn)品設(shè)計(jì)師這樣描述他的職責(zé)。

“我想找個(gè)設(shè)計(jì)師”

我聽(tīng)新創(chuàng)業(yè)的公司說(shuō)得最多的就是這句話。他們想找的通常是一個(gè)能干上述所有活兒的人。他們想要一個(gè)能畫(huà)好看的圖標(biāo)、為登陸頁(yè)面做 A/B 測(cè)試、按照使用邏輯排列 UI 元素，甚至要是能再做點(diǎn)前端開(kāi)發(fā)就更好了。由于要干的事情五花八門實(shí)在太多，所以我們常聽(tīng)見(jiàn)小公司要招 “設(shè)計(jì)師” 而不是某個(gè)更加具體的職位。

上述這些設(shè)計(jì)師角色之間的邊界其實(shí)一直在變化。有些 UX 設(shè)計(jì)師必須做點(diǎn)互動(dòng)設(shè)計(jì)，有的 UI 設(shè)計(jì)師要兼著平面設(shè)計(jì)師的活兒。要找到合適的人，最好的辦法是把你希望設(shè)計(jì)師在團(tuán)隊(duì)內(nèi)部負(fù)責(zé)的工作描述清楚，然后選擇一個(gè)最能體現(xiàn)這份工作的性質(zhì)的職稱。

題圖來(lái)自：mandegarweb

本文轉(zhuǎn)載自：站長(zhǎng)之家