不少人總是把UI和UX作品集混為一談，以為就是一個(gè)頁(yè)面、圖片的設(shè)計(jì)而已。其實(shí)，真正的UX作品集包含了很多內(nèi)容，這也是為何國(guó)外都是設(shè)置UX崗位而不是UI崗位的原因。

因?yàn)閷?xiě)公眾號(hào)的關(guān)系，我能接觸到很多設(shè)計(jì)師。在和大家交流的過(guò)程中，發(fā)現(xiàn)大家反映的普遍的疑惑點(diǎn)是：

• UI 和 UX 作品集，到底有什么區(qū)別？
• 我怎樣才能做出一份真正的 UX 作品集？
• 除了品牌、柵格、組件、顏色、用戶(hù)體驗(yàn)地圖，我還可以展現(xiàn)些什么？

今天幫大家詳細(xì)解答一下。

首先需要明確兩個(gè)關(guān)鍵定義，UI 和 UX：

• UX 是 User Experience 的縮寫(xiě)，翻譯成中文，就是「用戶(hù)體驗(yàn)」設(shè)計(jì)，它包含了交互和 UI 這兩個(gè)部分；
• UI 就是 User Interface 的縮寫(xiě)，中文是「用戶(hù)界面」設(shè)計(jì)，所關(guān)注的是界面中的字體、 icon、 間距、顏色、信息呈現(xiàn)這些的設(shè)計(jì)。

在谷歌的 UX 設(shè)計(jì)證書(shū)里非常清晰地寫(xiě)到：user experience（UX）??

這也是 UX = user experience 的一個(gè)證明。

其實(shí)在國(guó)外的互聯(lián)網(wǎng)公司，都只有 UX 設(shè)計(jì)師這個(gè)崗位。

比如，我之前在外企 PayPal（就是美國(guó)的支付寶）工作過(guò)。我的 offer 里，職位就明確寫(xiě)著：UX Desiger

對(duì)于企業(yè)來(lái)說(shuō)，只設(shè)置 UX 設(shè)計(jì)師，而不是設(shè)置 UI 設(shè)計(jì)師，是更有利的。

我們可以換位思考一下：如果你是一個(gè)公司的老板。你肯定會(huì)希望你手下的員工，創(chuàng)造的價(jià)值大于拿到的工資。

比如說(shuō)一個(gè)員工，他給你產(chǎn)生了2萬(wàn)塊錢(qián)的價(jià)值，那你可能給他1萬(wàn)塊錢(qián)的工資。企業(yè)要生存，就要盈利。所以一定是這樣的做法。

如果單純做 UI 設(shè)計(jì)師，產(chǎn)生的價(jià)值不是很多的話(huà)，那工資就不會(huì)很高；或者一個(gè)人要承擔(dān)兩個(gè)人的活，以此來(lái)降低用人成本。

那我們?cè)谧髌芳铮绾握宫F(xiàn)出我們具備 UX 設(shè)計(jì)的能力呢？

這里跟大家說(shuō)一個(gè)最底層的邏輯：展現(xiàn)合理的設(shè)計(jì)方案推導(dǎo)的過(guò)程。

什么意思？就是說(shuō)我們?cè)谧髌芳?，要能夠向面試官證明：

我們拿到一個(gè)需求之后，我們能夠去正確地分析需求的重點(diǎn)是什么？我們應(yīng)該從哪些方面去入手？

如何一步一步地推導(dǎo)、證明，這樣的方案，它就是最合理的一個(gè)方案。

然后用數(shù)據(jù)去證明這個(gè)方案在數(shù)據(jù)上確實(shí)帶來(lái)提升。

這里跟大家分享一張價(jià)值非常高的圖，是我總結(jié)了很多的經(jīng)驗(yàn)，我自己做作品集，以及我?guī)e的學(xué)員做作品集總結(jié)出來(lái)的經(jīng)驗(yàn)。

這張圖展示了?UX 作品集，它到底它要包含哪些內(nèi)容??

下面分別說(shuō)一下圖中每個(gè)部分的含義。

項(xiàng)目介紹：首先是介紹這個(gè)項(xiàng)目的基本信息、我們遇到的挑戰(zhàn)、我們的核心價(jià)值點(diǎn)。

產(chǎn)品目標(biāo)：我們要去從需求里分析得出，做這個(gè)需求我們產(chǎn)品目標(biāo)是啥。產(chǎn)品目標(biāo)有可能是通過(guò)業(yè)務(wù)分析得出的，也有可能是通過(guò)數(shù)據(jù)拆解得出的。

但是建議C 端項(xiàng)目，大家一定要落腳到數(shù)據(jù)上。B 端項(xiàng)目的話(huà)，產(chǎn)品目標(biāo)它可能不是落腳到數(shù)據(jù)上，它是助力業(yè)務(wù)上提升效率上。

用戶(hù)目標(biāo)：我們?nèi)ダ斫?，用?hù)在使用這個(gè)功能的時(shí)候，用戶(hù)的痛點(diǎn)是什么？然后通過(guò)這個(gè)痛點(diǎn)找到用戶(hù)的訴求。

我們從場(chǎng)景、從用戶(hù)調(diào)研、從后臺(tái)的數(shù)據(jù)去提煉用戶(hù)使用產(chǎn)品的訴求。

設(shè)計(jì)目標(biāo)：把產(chǎn)品目標(biāo)和用戶(hù)目標(biāo)合起來(lái)，就會(huì)得到我們的設(shè)計(jì)目標(biāo)。

什么叫設(shè)計(jì)目標(biāo)呢？就是我們作為設(shè)計(jì)師，在做這一個(gè)項(xiàng)目的時(shí)候，我們想達(dá)成什么樣的效果？

比如說(shuō)我們希望通過(guò)對(duì)用戶(hù)的引導(dǎo)，提升頁(yè)面的轉(zhuǎn)化率。這就是設(shè)計(jì)目標(biāo)。

競(jìng)品分析：有了這個(gè)目標(biāo)之后，我們?cè)偃タ锤?jìng)品是怎么做的。也就是我們自己現(xiàn)在知道我們自己要取得什么樣的效果了，然后我們從競(jìng)品里去尋找有哪一些亮點(diǎn)，是可以幫助我們實(shí)現(xiàn)我們的目標(biāo)的。

設(shè)計(jì)策略：通過(guò)結(jié)合從競(jìng)品里面找到的靈感，再結(jié)合我們產(chǎn)品自身的優(yōu)勢(shì)，總結(jié)出我們可以用哪一些方法，去實(shí)現(xiàn)我們的設(shè)計(jì)目標(biāo)。

通過(guò)以上步驟，我們找到了設(shè)計(jì)目標(biāo)，每個(gè)目標(biāo)也有了實(shí)現(xiàn)的策略（設(shè)計(jì)策略）。 接下來(lái)就是去設(shè)計(jì)交互方案。

交互方案：需要根據(jù)每一個(gè)策略，展現(xiàn)對(duì)應(yīng)的方案是什么。這樣就全對(duì)上了，一環(huán)扣一環(huán)。

UI 方案：在顏色、字體、質(zhì)感、形狀上，我們有哪些思考，讓界面更美觀、信息更突出。

方案效果：可以從這四個(gè)角度去分析。最重要是數(shù)據(jù)的提升。數(shù)據(jù)可以來(lái)源于業(yè)務(wù)，也可以來(lái)源于問(wèn)卷，最主要是用戶(hù)的滿(mǎn)意度。另外，如果有用戶(hù)的反饋、獲得晉升、老板表?yè)P(yáng)，也都可以列舉。

通過(guò)以上這些步驟，我們就可以展現(xiàn)出，我們?cè)诠ぷ髦?，擁?UX 的設(shè)計(jì)能力。

總結(jié)一下，最根本的，還是展現(xiàn)出來(lái)我們拿到需求，可以通過(guò)有理有據(jù)的分析，得到發(fā)力點(diǎn)，并通過(guò)合理的方案，擊中這些發(fā)力點(diǎn)。從而對(duì)業(yè)務(wù)產(chǎn)生正向的帶動(dòng)作用，發(fā)揮出我們作為團(tuán)隊(duì)一員的重要價(jià)值。