UI設(shè)計(jì)師想提升設(shè)計(jì)力，該怎么做？

2018-01-10 10:25:09 閱讀 283890 本文來源：網(wǎng)易UEDC

分享至：

筆者的話：文章內(nèi)容比較淺，適合剛?cè)胄械脑O(shè)計(jì)師，如在校學(xué)生和工作 1—2 年卻沒什么明顯提升的設(shè)計(jì)師。輸出的觀點(diǎn)（廢話）也比較多，所以貼心地（不得已）給你畫好了重點(diǎn)。

發(fā)現(xiàn)問題

下面進(jìn)入這次分享的主題，如何自我提升設(shè)計(jì)力。既然是要提高，那相對于之前的設(shè)計(jì)力比較而言，那你需要有發(fā)現(xiàn)作品存在哪些問題的能力。

大家可以看一下上面的這個作品，希望你們可以試著回答兩個問題：

· 你覺得這個作品怎么樣？

· 你覺得好或不好的原因？

這里我不會直接給出答案，我想提供一個解決思路：去比較一些大廠出品的成熟的同類型產(chǎn)品。

這是一個音樂播放界面的作品，我們找了網(wǎng)易云音樂和Spotify的界面來做一個對比。這樣你明顯能感受到后兩者和前面的差異。如果你還是區(qū)別不出“好和壞”，繼續(xù)問為什么？

· 為什么網(wǎng)易云音樂和 Spotify 都做了類似“毛玻璃”的背景處理效果？

· 為什么網(wǎng)易云音樂和 Spotify 的播放等按鈕都都使用統(tǒng)一的色調(diào)？

第一個問題對應(yīng)的答案可能是：需求層面上是由產(chǎn)品的氣質(zhì)決定的，設(shè)計(jì)目的上是為了營造音樂的氛圍感和沉浸感，而不是像前面那樣的“五光十色”；

第二個問題對應(yīng)到的需求和設(shè)計(jì)的目可能是：相似功能需要的平衡性，弱化視覺元素來突出重要內(nèi)容。

發(fā)現(xiàn)問題的能力很重要，而不是簡單的說好和不好。我希望通過這兩個問題的解決思路能給你啟發(fā)。初期遇到的問題，建議先多問自己為什么并分析，還可以多和一些好的產(chǎn)品去做對比。實(shí)在不行那你還可以去 Google 。最后還是無解再去請教前輩。畢竟能自己解決的的事情就不要去麻煩別人，而且從別人那直接得到答案遠(yuǎn)不及不是自己分析得來的收獲大。

總結(jié)：和優(yōu)秀的作品去對比，多問為什么？從設(shè)計(jì)技法反推出產(chǎn)品需求和設(shè)計(jì)目的。

提升的三個階段

如何才能做出優(yōu)秀設(shè)計(jì)？

答案很簡單：沒有捷徑，就是多練。練習(xí)當(dāng)然也要分階段和方法。且在練習(xí)前的審美也很重要。下面先談練習(xí)的幾個階段。然后再談審美。

一、純臨摹

你所看到的“大神”都會經(jīng)歷過臨摹階段。臨摹并不可恥，把臨摹作品據(jù)為己有才可恥。

這個階段主要適合剛?cè)胄袝r學(xué)習(xí)軟件技法，你有的那些奇思妙想最好先藏好，不要在這個階段去實(shí)踐它，你技法不過關(guān)的時候，改造出來的只會是怪物。找到一個優(yōu)秀的作品，通過一步一步的臨摹100%的去還原它，你除了能學(xué)到原作者實(shí)現(xiàn)效果的技法，更重要的學(xué)會了一個成熟設(shè)計(jì)的的審美和經(jīng)驗(yàn)（比如上圖里的配色方法和元素布局的比例）。

二、半創(chuàng)造

這個階段指的是：你有了一定的軟件技法，然后在別人優(yōu)秀的設(shè)計(jì)上加入一些自己的想去嘗試微創(chuàng)新。

這兩個作品都非常漂亮，如果沒人告訴你，基本不會知道到底先是有哪一個。相同點(diǎn)是材料的質(zhì)感和前后關(guān)系的陰影處理，不同點(diǎn)是新的配色和元素布局。左邊是 Javi Pérez 的作品，右邊是音樂的奉獻(xiàn) Rebound 的作品。當(dāng)然音樂的奉獻(xiàn)已經(jīng)是非常優(yōu)秀的設(shè)計(jì)師了，還舉這樣的案例是想讓你知道好的創(chuàng)造應(yīng)該是什么樣的。

三、純原創(chuàng)

你的技法能實(shí)現(xiàn)你的想法階段，除了需要你有一個好想法，也可能需要你擁有一些綜合技能。

這個動效作品在 Dribbble 的總排行榜上排名第四，6600次點(diǎn)贊量。已經(jīng)是 Zee Young（國內(nèi)設(shè)計(jì)師） 2015的作品了。一個好的想法配合上UI、插畫和動效這些綜合技能在這個超受歡迎的作品中發(fā)揮了巨大作用。這個就屬于原創(chuàng)作品階段，我們每一位設(shè)計(jì)師都希望到達(dá)這個階段，并能設(shè)計(jì)出屬于自己的代表作。但要明白：沒有前兩個階段，是永遠(yuǎn)沒有這一步的。

做出一個優(yōu)秀的作品具體需要的條件總結(jié)：

· 首先要有好的想法

· 擁有過硬的軟件技能

· 執(zhí)行力

執(zhí)行力

選擇你感興趣的領(lǐng)域，通過以上三個練習(xí)階段，相信第二點(diǎn)的軟件技能是一定可以過關(guān)。那執(zhí)行力和和想法從哪里來？

先聊一聊執(zhí)行了，好的想法和審美聯(lián)系密切，篇幅也比較多放后面。在工作之余的執(zhí)行力即自我驅(qū)動力。別人可以愉快地去吃雞的時候，那到底是什么樣的動力讓你你偏偏去做設(shè)計(jì)練習(xí)？我以前在微博寫過一句話應(yīng)該可以回答：想要的東西不一樣，所以付出的努力也不一樣。也就是選擇決定方式。

自我驅(qū)動力大概分為三種：熱愛型驅(qū)動、利益型驅(qū)動和目標(biāo)追逐型驅(qū)動。

熱愛驅(qū)動型：這種動力來自于內(nèi)在，你可能從心底就喜歡設(shè)計(jì)。每完成一個作品都會有一種幸福感或者成就感。人經(jīng)常在做一些自己喜歡的事情時，會進(jìn)入一種“心流"狀態(tài)。比如當(dāng)你徹夜在學(xué)習(xí)某種新的技能時進(jìn)入了一種忘我的境界，天突然就亮了，而你卻不覺得疲勞反而是興奮。（這里不是建議大家熬夜，只是舉例，但實(shí)際情況很多優(yōu)秀的設(shè)計(jì)師都是這么過來的）如果你擁有這種動力自然而然會讓你進(jìn)步。

利益驅(qū)動型：你知道專業(yè)技能的提升能夠帶來明顯的回報，為了追求職場加薪或是更好的物質(zhì)生活等都可以成為你的動力。現(xiàn)在有不少的平面設(shè)計(jì)師（甚至完全不相干的行業(yè)）轉(zhuǎn)行去做UI。少部分是由于喜歡，大部分還是覺得UI的薪酬高。不管是哪種原因，想做那就去做。不管在哪個行業(yè)，只要你做的好，就會有相應(yīng)的回報。但也要有沒做好的準(zhǔn)備，可能得到不到你所想要的。（其實(shí)平面做的好的薪酬高的也多了去了）

目標(biāo)追逐型：設(shè)計(jì)對你來說可能就是一份工作，談不上有多熱愛。你又想獲得一份不錯的薪酬，但薪酬又促成不了你執(zhí)行的動力。這個時候可以借助偶像的力量，你的偶像可以是設(shè)計(jì)行業(yè)的，也可以是任何其他行業(yè)的，只要你能在他身上發(fā)現(xiàn)閃光點(diǎn)，看著他做的越來越好步，這種類似近朱者赤的陪伴也會讓你在自己的行業(yè)付出經(jīng)歷去做的更好。

那如何加強(qiáng)驅(qū)動力？有一個詞叫刻意練習(xí)。具體的就是把上面三個階段列一個時間計(jì)劃并強(qiáng)制執(zhí)行。我們常常可以從一些網(wǎng)站上看到：UI一百天、海報365、每日一練等等，最知名的要數(shù)使用 Cinema 4D 每天制作一張圖的 Everyday 藝術(shù)家 Beeple。有計(jì)劃的去持續(xù)做一件事，一個月后就會有量變，一年后將會產(chǎn)生質(zhì)變。

好的想法源于哪里

好的想法往往來自你的記憶重組，你把符合項(xiàng)目定位的那些以前的見聞重新剪輯出來，組合并創(chuàng)造。通常情況下你可以從以下幾個方面獲取一些好的想法

多體驗(yàn)

多體驗(yàn)一些有趣的產(chǎn)品，可以經(jīng)常逛一下 App Store 和留意一些公眾號的推薦，去體驗(yàn)?zāi)切┍煌扑]的新鮮的優(yōu)秀的產(chǎn)品，保持對產(chǎn)品市場的敏感度。也可以多關(guān)注你負(fù)責(zé)產(chǎn)品的競品，分析和學(xué)習(xí)別人在交互和視覺上好的的地方。還有就是多去體驗(yàn)生活，好的設(shè)計(jì)大多來自生活。

多記錄

你看過的那些好設(shè)計(jì)、好文章、好產(chǎn)品，你喜歡的原因，使用心得都可以記錄下來。針對不同的對象，記錄的方式可以是直接收藏，也可以是臨摹+創(chuàng)造，也可以是寫文字。很多好的想法只存在瞬間，過了就不再想起。個人喜歡使用「錘子便簽」來記錄一些感想，「有道云筆記」來分類整理工作需要用到的東西。

多看

什么都看，只要是好的東西都可以看。總之就是不要局限在某一領(lǐng)域。你做UI，那你也要去看平面的東西，還有攝影、3D、建筑、美女等等，看這么多是為了訓(xùn)練你的審美，幫你開闊視野和格局。

看的轉(zhuǎn)化

當(dāng)我們看攝影，可以學(xué)習(xí)他的構(gòu)圖和色彩搭配，轉(zhuǎn)化為一些漂亮的小插畫。除了轉(zhuǎn)化原有的色彩搭配，你也可以嘗試一下其他的色彩，鍛煉你的色彩搭配能力。

比如你看平面的時候，除了學(xué)習(xí)版式和一些元素應(yīng)用，我們還可以結(jié)合3D試試。

這是我15年做的數(shù)字海報，然后用C4D包裝一下可以是這樣的。

通過C4D噪波把攝影作品轉(zhuǎn)化出來的新壁紙。

也可以把平面+3D結(jié)合做成動態(tài)的，像天貓這樣。

打開你的腦洞，多組合，多嘗試。設(shè)計(jì)的共通性和跨界性能給你帶來更多的創(chuàng)造性。

看的過程就是訓(xùn)練我們審美的過程，盡可能的找到一些優(yōu)秀的學(xué)習(xí)榜樣。如果你的參照對象只有60分，那你做出來的東西肯定是60分不到的，甚至可能只有30分。但如果你學(xué)習(xí)的對象有95分，那你以他為參照學(xué)習(xí)，那你至少有也會有80分。

看平臺首推

可以多看一些Behance、Dribbble、站酷的首頁推薦。注意正確的觀看方式，不是打開一個作品，走馬觀花的刷到底，只記住了“版式炫酷”，然后驚嘆：哇，首推作品呢，很牛X。回復(fù)個666，評論個膜拜大神。這種評論是最沒有營養(yǎng)的。不管你是吹捧也好，還是真心贊美也好，你還可以換個形容詞啊，學(xué)學(xué) behance 和 dribbble 回復(fù)個 amazing、awesome 等等（開個玩笑）。你真正需要做的是去看他的設(shè)計(jì)思路，如有需要可以一個字一個字的去解讀，看他講解設(shè)計(jì)背景，設(shè)計(jì)思路和流程，還可以看他的包裝結(jié)構(gòu)。如有不同的觀點(diǎn)，你也可以提出自己的疑問，只要你是用心思考的評論，我相信作者也會用心給你回復(fù)的。

關(guān)注牛人動態(tài)

當(dāng)你看到好的作品時可以順藤摸瓜，關(guān)注一下設(shè)計(jì)師，你可以發(fā)現(xiàn)更多你喜歡的東西。

比如在 Dribbble 上看到了這樣一個3D圖標(biāo)作品，我了解到這個作品屬翔哥的（ Celegorm），通過翔哥關(guān)注的人，我又發(fā)現(xiàn)羅子雄，通過羅子雄我又發(fā)現(xiàn)了CG領(lǐng)域的徐天華，平面領(lǐng)域的 Nodyoung，這種過程感覺就像發(fā)現(xiàn)寶藏一樣。

除了關(guān)注他們的作品動態(tài)，你也可以關(guān)注一下他們公開平臺的生活動態(tài)，比如 Instagram 和微博。看他們生活中的狀態(tài)和對待世界的態(tài)度。有人會分享外出的旅行，有人會分享新裝修好的家，新人會分享新?lián)Q的跑車...他們所經(jīng)歷的都可能是你即將體驗(yàn)的。往積極（雞湯）方向想，看到別人的法拉利，你是否會也想擁有一輛，從而會變成你進(jìn)步的動力也是好的一面。

建立一套靈感庫

把你看過的那些美好的東西收藏起來，分類越詳細(xì)越好，線上的工具你可以使用 Pinterest 和花瓣。線下你可以使用 Inboard 或者 Eagle。如果你自己的審美不夠，那還可以關(guān)注一些大咖，看他們的收集，再篩選出你喜歡的。比如花瓣上的 skys，Miedum 上的 Muzli。

綜合技能

新人面對綜合技能的時候往往會迷茫？不確定要學(xué)什么？該不該學(xué)？我想告訴你的是：不論是你在產(chǎn)品中把做用戶體驗(yàn)做到極致還是在面試官面前展示，綜合技能都會你帶來巨大的優(yōu)勢。但需要明確的是平面和UI是根基。

如果有兩個面試者同時去面試UI設(shè)計(jì)師的崗位，一個只會做UI，但能做到85分，另一個UI、3D、動效什么都會，但每項(xiàng)只有60分，那毫無疑問，第一個更有機(jī)會得要這份工作。所以先把一個領(lǐng)域研究透了，再去學(xué)習(xí)一些其他技能也不遲。當(dāng)然你若是能同時把幾項(xiàng)技能都玩的很6，那我給你小心心。

多閱讀

只顧手頭功夫也不行，還要多閱讀，你要明白設(shè)計(jì)背后的目的。

《破繭成蝶》是我在大學(xué)時候看的書，當(dāng)時非常受啟發(fā)，現(xiàn)在偶爾也會翻一下。大的方面它會給你講項(xiàng)目流程，不同的角色任務(wù)，小的方面，為什么界面是這樣布局？不是這樣又帶來什么影響。總之圍繞用戶體驗(yàn)的一切都是有原因的。比較有閱讀欲望的也可以去看《設(shè)計(jì)心理學(xué)》和《About Face》系列。好的書太多了，就不一一舉例了。反正買就對了，畢竟買書是一件極具性價比的事情（投資自己）。

進(jìn)階產(chǎn)品思維

以上單項(xiàng)技能你都get了的話，下面該提升產(chǎn)品思維。記得在大學(xué)的時候?qū)W習(xí)過一門叫《目標(biāo)導(dǎo)向設(shè)計(jì)》的課程。這門課的內(nèi)容是這樣的：開始讓我們親自出去采訪調(diào)研，然后再畫原型圖，做視覺稿，最后還要用視頻講解的方式呈現(xiàn)出來。這就讓你參與了整個產(chǎn)品流程，而不是只關(guān)注和陷入自己的視覺那一畝三分地，“上帝視角”看問題會讓你避免局限性。

這里有幾個方法可以加強(qiáng)你的產(chǎn)品思維：

參加比賽

比賽首先讓能你參與真實(shí)的項(xiàng)目，其次你還可以看到一些前輩在和你做同一個產(chǎn)品的時候，他們的是如何思考的以及使用的設(shè)計(jì)策略。還有就是和別人相互交流的獲得反饋。參加行業(yè)交流會議也可以收獲很多，比如IXDC大會，許多業(yè)界資深人士會在那里分享經(jīng)驗(yàn)。

Redesign產(chǎn)品

你可以改版自己喜歡的產(chǎn)品，也可以改版那些體驗(yàn)反人類的產(chǎn)品（據(jù)說 12306 是被改版做多的產(chǎn)品）。再設(shè)計(jì)的過程一定要注重設(shè)計(jì)流程的完整性。從產(chǎn)品定位到用戶畫像，再到交互原型和視覺界面，每個流程都不要少，最后還可以用動效包裝一下再發(fā)表出去和別人交流（代替工作中的驗(yàn)證反饋）。在設(shè)計(jì)作品中盡可能保持真實(shí)的配圖和文案，有的人確實(shí)用了真實(shí)的圖片但使用的圖片比較Low而且風(fēng)格不統(tǒng)一，這里建議要統(tǒng)一處理圖片色調(diào)和圖片里元素位置比例。

做未來的設(shè)計(jì)

VR/AR已經(jīng)火過了一段時間了，現(xiàn)在雖然有點(diǎn)退燒，但仍不妨礙它會成為人類下一個計(jì)算平臺。那個時候VR領(lǐng)域的交互設(shè)計(jì)師和3D設(shè)計(jì)師將會是稀缺人才。作為設(shè)計(jì)師也可以抓住這個機(jī)遇窗口，學(xué)習(xí)新的技能，可能會讓你找到當(dāng)初學(xué)設(shè)計(jì)時的興奮感，還有你提前掌握這些技能或許可以獲得下一波漲薪紅利。配圖為站酷大植子Daz_Qu的VR概念設(shè)計(jì)作品，他同時也分享了自己設(shè)計(jì)的詳細(xì)過程，感興趣的可以過去學(xué)習(xí)一下。

回到工作

以上說的都屬于課外活動，最終我們最后還是要回到工作中。把你學(xué)習(xí)到的技能帶到負(fù)責(zé)的產(chǎn)品中：重新梳理產(chǎn)品定位，分析線上的問題和收集用戶反饋，研究流行趨勢確定設(shè)計(jì)風(fēng)格，重新做一個產(chǎn)品改版的概念稿，最后和團(tuán)隊(duì)評審改進(jìn)不足的地方，最終主動推進(jìn)產(chǎn)品的改版，這就是設(shè)計(jì)師的主動性。

平時

沉淀自己設(shè)計(jì)經(jīng)驗(yàn)的最好方法是分享和復(fù)盤。定期的復(fù)盤，可以讓你避免在過去產(chǎn)品中犯過的錯誤，總結(jié)出問題與經(jīng)驗(yàn)，發(fā)現(xiàn)新的解決思路，從而提升個人能力。分享可以鍛煉你的產(chǎn)品構(gòu)架能力，比如寫文章和做PPT，都是要有邏輯清晰的大綱然后才是輸出的具體觀點(diǎn)，同時還可以幫助新人一舉兩得。

最后想對大家說的是：做好當(dāng)下，保持好奇心。