UI 設(shè)計師該如何展示自己的作品集?可千萬別被網(wǎng)絡(luò)上那些精美的一圖流欺騙了。今天這篇是實實在在的干貨,教你如何包裝自己的作品,如何展示給面試官看。這里講的包裝,并不是說要讓自己的作品集看起來炫酷狂拽,而是讓自己的作品有一個完整的過程。本篇文章適合求職 UI 職位的朋友以及 UI 想要轉(zhuǎn) UX 職位的朋友。什么是UI ?什么是UX ?很多人覺得UI 就是美工,就是做做圖。 exucuse me?看我不打死你。 UI 和 UX 是不能分離的,沒有好的UX,再美的產(chǎn)品也沒人愿意用,同理,沒有好的UI ,再好用的產(chǎn)品也沒人想去嘗試。所以,請謹記,UX和UI 是密不可分的。
1. 設(shè)計流程 設(shè)計流程會讓面試官覺得你是一個專業(yè)的設(shè)計師而不是美工?。?!各位朋友可以看看自己的作品集,里面有沒有至少一個項目有詳細的流程介紹?根據(jù)本蛋的長期偷窺,很多UI desingers的作品集往往只有最終效果圖,能有一些Wireframe 的都是少數(shù)。我的觀點或許跟在座的有些不同, 我認為作品集不應(yīng)該只有這些最終的炫酷狂拽屌,而且應(yīng)該讓看你作品集的人知道,你這些炫酷狂拽是怎么來的。所以,就涉及到了所謂的設(shè)計流程??吹竭@里,你可能會想說:寶寶就是面UI ,根本不需要什么過程啊,好不好看最重要。對于這個疑問,本蛋只想說,針對不同的公司,需求可能不同,但是如果你想要真正進入IXD 這個行業(yè),對于UX的了解是必須的?;蛟S你已經(jīng)了解了UX,但是你作品集里并沒有體現(xiàn),那么這不就是埋沒了你的才華嗎?一個清晰的設(shè)計流程,不僅可以讓你輕松的去講解你的設(shè)計,同時,還可以讓面試官覺得雖然你面試的是UI,但是同時你對UX的了解程度可以讓你很好的去和UX設(shè)計師合作。看到這里的朋友,可以看看自己的作品集里有沒有一個項目包含了完整的設(shè)計流程?如果沒有,本蛋這里會舉一些例子來告訴大家怎么來“完整”自己的項目。設(shè)計流程有很多種,大同小異。而如今,開發(fā)和設(shè)計開始緊密結(jié)合,很多公司在招聘的時候就會提到一些開發(fā)的方法,所以今天我要講的設(shè)計流程中會提到一些開發(fā)流程。他們分別是Waterfall (瀑布流式開發(fā))& agile(敏捷開發(fā)). (劃重點啦)。而如今agile成為主流的開發(fā)流程方法,雖然我們不是程序猿,但是我們同樣可以在面試的時候提到這些這些方法,讓面試官覺得你不僅只是個美工。 UI 設(shè)計流程可以關(guān)注:《入門必讀!UI設(shè)計的整個工作流程是怎樣的?》講了這多廢話,下面用我自己的作品舉個例子吧 (當(dāng)然這個作品我只挑重點發(fā)局部,完整版下次發(fā))題目,介紹下項目的名字,種類。
這里相當(dāng)于是一個隔頁or封面,用于起到分割的作用。
2. 設(shè)計流程Overview(劃重點?。?/strong> 在這一頁,詳細介紹你整個設(shè)計的過程,這里我寫到從了解項目-用戶研究-設(shè)計-評估-再設(shè)計,并且搶到了設(shè)計-評估-再設(shè)計是一個反復(fù)的流程,這里比較符合agile的開發(fā)方法。這一頁非常重要,因為這樣會讓面試你的人或是看你作品的人對你項目的流程有個宏觀的認識,并且知道你不僅僅只是局限在某一環(huán)節(jié)。如果你只參與了其中一部分,比如UI 設(shè)計,你可以著重強調(diào)。
3. 項目背景介紹/用戶介紹/各種背景知識介紹 這頁我選擇的是用戶介紹,用了infographic去展示我的插畫能力同時起到視覺吸引效果,說實話,沒有誰會一字一句讀這些內(nèi)容,但是有這個用戶介紹,會讓面試官對你的設(shè)計背景有更好的理解。
4. 用戶調(diào)研
作為一個交互設(shè)計師,你的作品應(yīng)該是有數(shù)據(jù)來源的,為了更好的了解用戶,你需要收集數(shù)據(jù)。這里我推薦最基礎(chǔ)的兩種調(diào)研方法,問卷和訪談。 所以,在你的作品的過程里,加上用戶調(diào)研,會使得你的最終結(jié)果非常有說服力。(沒有?沒有你可以編啊… )
5. 角色板
這個可要可不要,就是根據(jù)你的調(diào)研模擬出幾個代表性的用戶。
6. 設(shè)計需求/洞察點
當(dāng)你有一系列數(shù)據(jù)作為支撐了并且還有假定的用戶組了,你就可以列出你的設(shè)計洞察點了。
7. 頭腦風(fēng)暴
這里就是炫草圖的時候了,瘋狂的堆草圖,顯得你做了很多方案動了很多腦子?。?!頭腦風(fēng)暴怎么做?來看這份超詳細的指南:《別急著畫稿!來看這份全面細致的頭腦風(fēng)暴指南》
8. 交互模型
咱們是交互設(shè)計師,不是美工,為你的產(chǎn)品繪制一個交互模型會讓面試官覺得不明覺厲,同時更好的了解你的作品是怎么“交互”的。
9. HTA Chart & Wireframe HTA Chart 是表達層級的圖,這里也可以用flow chart代替。線框圖大家都很熟悉啦。都放進作品集里會讓人清楚的了解到你一步一步是怎么到線框圖這個步驟的。
10. UI 效果圖 圖略這里大家都有啦,就是各種炫酷狂拽屌了,但是提醒大家的是,最好放大你這個產(chǎn)品的特色進行展示。
11. 評估
對我來講,做完UI 不代表完事兒了,你還需要對你的作品進行評估,這里我用的是啟發(fā)式評估,非常快速有效的方式。把評估這一環(huán)節(jié)做進你作品集里,會讓面試官覺得眼前一亮(我猜)
12. 再設(shè)計 再次略就是把評估找出來的問題能解決的盡量解決。
13. 最終展示圖 還是略最后再來張炫酷狂拽的!就完事啦!