原文作者：?geunbae-lee
原文鏈接：https://uxplanet.org/how-to-structure-your-first-ux-design-portfolio-7b51576a04df
如何創(chuàng)建你的第一份UX設計作品集
正在尋找你的第一份交互設計的工作？這篇文章可能會對你有所幫助。
引言
正在準備開始你的用戶體驗事業(yè)嗎（ＵＸＤ）？你來對地方了，在這篇文章中你能獲得一些創(chuàng)建你交互設計個人作品網頁的一些技巧。盡管我本人在這方面也還是個新人。但由于目前為止，已經有很多人邀請我看一看他們的個人網站了。我還是決定分享一些這方面我所了解的。僅僅是想表達一些個人的想法，請不要以苛刻的態(tài)度看待這篇文章，希望你花費時間能有所收獲。
#1.創(chuàng)建一個網站，而不是一個PDF文檔
首先我建議你創(chuàng)建一個個人的網站而不是PDF文檔。盡管現(xiàn)在很多公司在招聘時仍然讓你發(fā)送PDF格式的作品集，但對你和招聘者來說簡單的輸入一個ＵＲＬ（網頁地址）還是要方便的多。而且使用在線（網站）的方式更加深入有互動性。
比如，在線作品網站看見鏈接到你其他UX相關的社交網站。你還可以鏈接或插入你產品的介紹視頻，放上演示原型，這樣查看的人可以在任何時間任何地點嘗試你的產品。甚至你還可以加上吸引人的視覺效果以及其他設計相關的能表達你創(chuàng)意的東西，如視頻，動效。（如果另外你能一步一步的展示交互的過程，用Behance和Dribble 也可以）
創(chuàng)建網站的另外一個好處是可以添加埋點。添加埋點以后你可以看到誰訪問了你的網站，他們停留了多久，他們查看了哪個項目。通過創(chuàng)建網站并埋點獲得的這些豐富和有用的信息，你可以更好改進你的網頁界面，最終更好地呈現(xiàn)你的項目。
“那么，怎么樣開始創(chuàng)建我的個人作品網站呢？”
下面會介紹很多方法。由于本文的重點不是介紹創(chuàng)建網站的過程，我將只呈現(xiàn)出一些有用的信息資源。
現(xiàn)有的一些可供下載的響應式框架：
HTML 5 Bootstrap Templates?by Colorlib
?HTML5/CSS3 Templatesby Colorlib
?HTML5/CSS3 Templatesfrom Bradley Nice’s blog post
?Bootstrap Templatesby Bashooka
?Responsive Templatesby Responsive Miracle
你還可以使用其他的框架來創(chuàng)建響應式網站。最近，好像很多人用AngularJS或ReactJS比較快的創(chuàng)建網站，但是說實話，連我自己還在學這些，所以對它們我就不多做說明。如果你有興趣可以自己去了解下。
其他創(chuàng)建網頁的方式（非代碼）：
?Wix
分享一個Adam Dannaway關于設計和開發(fā)一個作品集網頁整個過程的文章--“設計和開發(fā)我的個人作品網站的過程”
#2講一個你是誰的故事
無論你是否在線申請還是通過內部員工推薦，你都會發(fā)現(xiàn)還有成百上千和你一樣想要得到這份工作的人。所以，你需要思考這個問題，
“如何包裝自己才能在眾人中脫穎而出？”
就像你寫大學申請或求職信，在你把你的所有項目內容加到你的作品網站之前，你需要知道下面幾點。
對于用戶體驗人員來說，作品集是找工作過程中最重要的一部分。如果沒有作品集，我很懷疑你是否能找到一份UX設計師的工作。這就是作品集的重要性！所以，你需要問自己一些基本的問題比如，你希望那些不了解你的人認為你是什么樣子的。
.我有什么特別之處？
.我的背景是什么？我是如何開始從事UX工作的？
.作為UX設計師，我有哪些相關的有用的技能？
.我和這份工作相關的興趣和熱情是什么？我之前的經驗和項目和這份工作有何關系？
.我所欠缺的技能和知識有哪些？-了解自己很關鍵
在你的網站在“關于我”的部分，你可以更多的介紹你是誰。在這里你也可以很好的介紹你的專業(yè)水平，你的熱情和興趣，你希望學習和提高的。最后但也是最重要，可以列出一些個人特征，比如興趣好愛，音樂品味或者其他可以顯示你自己的東西。當然，這只是選填項，不要讓它成為關鍵的部分。
除了“關于我“，創(chuàng)造一個漂亮的網站介紹頁也很重要。比如，你可以添加一個視頻或圖片，或簡短有力的描述你是誰，你追求的是什么。在點”關于我“之前，簡要又直接的描述你自己，也是一個很不錯的方式。只要你的整個網站的設計感一致且平衡（我將在后面討論視覺設計），你的網站就可能潛在的像你網站的訪問者傳達你是什么樣的設計師。
我個人比較喜歡Ivo Mynttinen的這個作品網站。這個網頁仍然存在很多關于個人的信息（雖然主頁的名字如果更突出會更好）。簡化使用的字體，使用簡單的字體，使得這種現(xiàn)代風格的設計（整頁面大圖）易讀性更高，也可以表現(xiàn)出網頁設計者對現(xiàn)在網頁設計的流行趨勢的了解。我并不是說你的個人作品網站也要與這個完全一致，你可以做更多創(chuàng)新。這里我只是想要舉個例子說明保持主頁風格整體感的重要性。
老實說，可能有一部分人看了之后會不同意“關于我”這個部分，或者認為在個人作品網站中，這個部分沒什么用。確實，很多時候人們只是直接去看你的項目，然后從項目經歷中做判斷。然而，我個人認為，個人作品網頁應當被視為是對你個人的反映（作品集網站=自我認同）而不是單純羅列你項目經歷的地方。所以我想說，嘗試特別并有創(chuàng)意，讓自己脫穎而出吧！
#3.吸引人的視覺
人們都是視覺動物，沒有人不喜歡精致的設計。在這個部分中，我想聊聊經常被你所忽視的。如果你注意到這些細節(jié)的東西，你會發(fā)現(xiàn)，你的網站質量會有很大的提升。正確的處理這些細節(jié)可以吸引更多的網站訪問者，證明你是一個設計師，你關注UX。
“那么這些小但是重要的細節(jié)是什么呢？”
是誰說個人作品網站不需要做的吸引人的？你是否是認為只有你的項目內容才重要？我可不這么想！
是的，視覺部件，如顏色，字體，布局甚至是圖片，所有這些一起營造了你網頁的感覺。如果你在該建立網頁時沒有關注這些，我建議你回頭仔細的挑選色板，文字，考慮怎樣呈現(xiàn)你的作品。
.“你的設計整體一致性高嗎？”
.“網站顏色看起來如何？是否有顏色不必要，過多吸引了訪問者的注意力？”
.“你是否使用了過多種的字體？”
.“字體大小是否合適易讀？”
.“你是否有過多的操作按鈕？”
交互設計師也是設計師，所以你需要關注這些小細節(jié)！這對于把東西做好沒有任何害處。
建議：
嘗試以網站訪問者的視角思考問題，當他們第一次來到你的網站會如何看待你的網站。你無法抓住所有細節(jié)這很正常，你需要用一個新的視角來看。除了完全依賴你自己發(fā)現(xiàn)問題，其實你還可以邀請別人看你的網站并且認真地聽取他們的意見。
#4.有清晰的導航和鏈接
導航是你的網站中最重要的部分。當你在海上漂時沒有指南針在手，你該往哪里漂？（哈哈）不管怎么樣，看網站的人需要知道點擊哪里到哪里（如，關于我，作品，聯(lián)系我等等）。不要將導航隱藏或者讓導航難以發(fā)現(xiàn)。保證訪問者能順暢的瀏覽你的網頁內容是至關重要的。讓導航清晰使得訪問者能順暢的在不同頁間切換，也可能能增加他們完整閱讀你所呈現(xiàn)內容的機會。
“典型的導航欄上有什么？”
絕大多數情況下（通常），對于一個設計師需要有以下部分：
作品集
關于我
簡歷（或者是“關于我”部分的一個鏈接）
聯(lián)系我
可選擇-其他的展示項如Dribble頁，如專業(yè)工作以外的攝影作品
其他的一些特定操作，應當容易看見和發(fā)現(xiàn)。比如下載你簡歷的鏈接應當明顯又清晰地呈現(xiàn)，因為這是最重要的一個部分。此外，你專業(yè)相關內容的鏈接也應當顯眼的呈現(xiàn)，如LinkedIn,Dribble,CodePen或Github。
#5.先呈現(xiàn)最好的項目
有的人喜歡先列出他們最近的項目，有的人喜歡先列出他們最好的項目。我認為，如果你正在找第一份UX的工作，還是首先先列出“最好的”項目（當你更有經驗，有更多項目，你可以再重新調整布局）。
“為什么要先列出我最好的項目？”
通常，先列出的項目比其他項目更更多的訪問量，在面試的時候會被更多的問到。而且先列出的項目可能最終就是反映你現(xiàn)在UX水平的項目。
（*另外一種方法是可以創(chuàng)建一個獨立的部分叫“特定項目”。有時候，這樣更好；）
#6.在每個項目板塊中呈現(xiàn)什么內容
在UX作品中放什么內容？-說了這么久，這可能是所有當中最重要的了。首先我想說的是在項目中呈現(xiàn)一堆內容，而不解釋你的UX設計過程。記住，你是在找交互設計而不是視覺設計的工作。作為一名UX設計師，你應當認真的呈現(xiàn)和解釋你的整個設計過程。
看一看那些成功獲得工作的優(yōu)秀的UX設計師，我們可以看到他們作品集內容的一些共同點。我將列出來并做一番解釋。
總述
總述部分首先應當呈現(xiàn)總述部分，解釋項目的一些基本情況。應當讓看的人能夠一下抓住產品是什么樣的，怎么樣起作用的。因為不是每個人都能有時間詳細的看你寫的項目的所有內容。如果他們對這個項目有興趣，他們可以繼續(xù)向下滾動去閱讀。
.項目的目的-你為何做這個項目
.目標-你完成和交付了什么
.方法-你如何完成的，采用的步驟
.項目歷時-是否是近期項目，歷時多久
.項目成員-姓名（或者是鏈接到他們的LinkdIn主頁）
.你的角色-在面試說項目的時候很重要（你對團隊的貢獻）
.鏈接-下載APP的，查看宣傳海報的，查看原型的，數據源等等
最后的產品展示-圖片或視頻（概要）
UX過程
這可能是“必須”中的最重要的部分。如果你的項目遵從了UX設計的過程，我建議你完整的解釋這個過程，但是得用一個精簡的形式。通過看以下的內容，訪問者應當可以能夠了解你的設計過程：
.研究-資料整理，競品分析，訪談，背景調查，問卷調查等
.構思-腦暴，思維的發(fā)散和聚合，用戶認知地圖，人物畫像等
.線框圖-思路，草圖，腦暴，可行的和不可行的，測試結果，迭代
.設計-具體的設計，測試/反饋，迭代，最終的設計
.產品原型-用戶測試，迭代，開發(fā)（如果你有做）
.在這部分當中，你和你團隊所遇到的挑戰(zhàn)，線框圖，用戶測試的部分，迭代設計都是非常重要的內容。
.額外的部分（如果你希望）
.可運作的原型Demo-允許用戶去試用
.這個項目的文章，所獲獎項，會議，獎金等-展示你在這個項目的成就和貢獻
.結論-你學到什么以及下一步你會做什么
額外的小貼士：
.用足夠大的分辨率高的圖片；
.描述從一個狀態(tài)到另一個的過渡；
.將項目中的阻礙和受到的限制包括進去（或者記在某處）-在面試的時候會很有用。順利的部分，不順利的部分，作為個人/團隊你是如何克服的；
.避免太多文字-你會有機會去解釋的；
.一般人們有兩個版本：1簡單的，關注圖片的版本；2專項研究-這也是展現(xiàn)你關注的很好的方式；
.嘗試找靈感-尋找你覺得新奇的專業(yè)的UX個人作品網站并通過比較自己的進行學習。
來看一看我的關于如何準備UX面試的文章吧！
#7.創(chuàng)建其他和設計相關的作品集
作為設計師，有時你想你的作品達到像素級完美，UI設計吸引人，有交互，有動效來展示。有時候僅僅在簡歷中寫下這樣不足以證明。有些時候，你在項目中承擔的內容不足以表現(xiàn)你的特定技能 。就像我之前幾次提到的Behance,Dribble,這些都是展示你的創(chuàng)意設計的很好的地方，與你的UX作品網站也相獨立。
我的個人Dribble賬號 https://dribbble.com/geunbae-lee
就我個人，除了有一個個人作品網站，我在Dribble上也放出了很多UI設計，動圖GIF，原型和其他的。個人認為，這些是額外的展示你熱情和水平的地方。在我面試的時候，很多人提到他們在Dribble上看到過我的設計。他們大多數告訴我他們很相信我能使用那些工具。此外，他們很欣賞我平時提升技能做的努力，比如Daily UI challenge(每日UI挑戰(zhàn)）。
#8.避免不必要的社交媒體鏈接
最后，我建議去掉你個人網頁中的那些社交媒體鏈接。但是如果你想展示你的個人生活（而不是專業(yè)相關的工作），可以放這些鏈接，但需要注意不要有奇怪的照片或內容可能影響你的形象。這是我個人的建議。
更多我寫的文章：
去這里找我：
LinkedIn? ? ?Dribble? ? ?Medium
陸陸續(xù)續(xù)好幾次才翻完的文章，終于翻完了。第一次翻譯，有待后續(xù)再改善提高翻譯能力
