選單

零基礎如何自學 UI 設計?

零基礎如何自學 UI 設計?

打算系統的回答這個問題。如果你正在開始學習 UI 設計,建議仔細讀一下。

正文:

在 UI/UX 這個領域,我做了差不多14年,從「使用者體驗」這個詞還沒沒有在國內流行起來開始,也帶了很多設計師,我的學生從入門到今天成長為BAT的設計總監。很多人說 UI/UX 的門檻不高、收入高,所以想學習,想轉行,這其實是誤解。

UI/UX 領域的高階設計師、資深設計師現在的確非常緊缺,很多公司都想找我推薦人,要找到合適的人挺難。一個資深的設計師,和一個資深的工程師,無論收入水平還是其他都相差不大。但是對於新手設計師,想要真正的跨過門檻,並不是那麼容易的事,因為設計做的好壞,對於專業人士來說太容易看出來了。做的好的人,和做的一般的人,差別太大,最終的產出相差也非常大。有人說 UI/UX 領域已經飽和,同樣是誤讀,不是行業飽和,而是初級的、沒有跨越門檻的設計師太多了。被人問到自己有作品,為什麼還找不到工作?原因也很簡單,不是因為有沒有作品,而是作品好不好。作品做的好與不好,太容易看出來了。

我建議如果想要入門,首先要明確的,就是不要急於求成,不要指望上個培訓班兩三個月就能出來找工作。設計需要系統性的訓練和積累,需要堅持,日積月累。任何指導都是幫助你少走彎路,但是該走的路還是得走,短不了。

下面我從基本的建議,和一個自學的指導,分成幾個部分來說(以後有機會還可以再補充):

第一部分:學習的總體建議

自學首先是掌握軟體,其次是讀設計規範和讀書,再者是大量的練習和比較對標優秀的設計,尋找實習實踐的機會,最後要思考各種各樣的瓶頸如何去應對等等。

零基礎如何自學 UI 設計?

第一點,掌握軟體。

在視覺設計中,軟體的選擇沒有很大的優劣之分,重點是要用得順手,並且應該在使用上繼續深入下去。在互動設計中,網路上也有很多順手的原型工具;文件工具方面,如果能把最基本的 Office( Word、Excel 等)用好,你就會發現用這些工具也能玩出很多花樣,我很多年以前就用 Excel 寫過互動設計的文件。所以做產品設計的關鍵不在工具本身而是裡面的內容是什麼。

另外還有一些 nice to have 的技能,比如一些前端開發的基本技能、影片處理技術等等,這些技能在未來都可能用得上,能夠提升你的競爭力。

零基礎如何自學 UI 設計?

第二點,讀設計規範。

這個對於初學者很有幫助,特別是現在各個平臺的文件也都寫得十分不錯。因為這本來就是針對開發者專門去做的,所以也很方便大家閱讀。蘋果、Google 等公司專門寫的文件、規範本身的質量是很高的,比如 iOS 的《人機互動指南》、安卓的 Material Design 等。這些品牌規範一方面是在講各種控制元件怎麼用、各種檢視如何轉換,同時也講了很多設計的思想。特別是蘋果 iOS 的《人機互動指南》中有非常深的、能對你產生幫助的一些原則、原理等內容。這些內容是必讀的,一定要有所瞭解,知道各個平臺有什麼差異,有哪些控制元件可以用。因為我們在設計中一定要避免重複造輪子,要減少使用者的學習成本,所以一定要知道基礎控制元件能夠支援哪些功能,即使要做出一些改變,也要基於這些控制元件的基本行為進行變化,這就要求我們去掌握整個平臺的情況。同時,這也是一個特別好的自學各個平臺的途徑。

零基礎如何自學 UI 設計?

第三點,讀書。

建議大家直接在豆瓣上去找使用者體驗、介面設計等相關的書籍,只要評分比較高的都不錯,值得大家去讀。然後根據自己的時間看能讀到幾本,這是很容易做到的。而且讀書並不在於數量,我建議大家快速的去讀,先瀏覽大框,再去進行大量的練習,最後反過來再去讀這些書,你就會有不一樣的收穫。

零基礎如何自學 UI 設計?

第四點,大量地練習,這也是非常重要的一點。

對於視覺設計師,要先從臨摹開始,從基礎的圖示到完整的介面,再逐漸到自己去探索去創作(後面會專門講視覺設計方案)。重點說一下互動設計師,首先自己可以去找一些典型的產品進行反向描繪,把資訊架構、互動框架、主線流程等基本方面都勾勒出來。其次,要評估產品中可能存在的互動的問題,並提出改進的具體做法。這些不是簡單的口頭語言描述或簡單的想法,一定要輸出線框圖,展現基本流程,這在某種程度上相當於你在重新設計這個產品。 然後再下一個步驟就是找一兩個具體的頁面或者流程來進行詳細的改進,並且要聚焦在細節上面。大家需要注意細節是極其重要的,此處主要訓練的是你的動手能力,對基本的元素及控制元件的運用能力。所以要找一些基本的頁面,試著重構它。把一些基本的東西去反向勾勒之後,你可以不再去看原有的產品,可以去試著自己實際地去改變最佳化,創造出新的產品來。如果能積累到多個——把不同領域的產品都做一遍,一定會有一些提升。另外,建議在每次做完之後,要再返回去看一些基本的書、設計規範,這個時候再回頭看設計,又會有不一樣的收穫。

零基礎如何自學 UI 設計?

第五點,對標優秀設計。

我們要在網上找其他人的設計,每次做完設計之後要在網上對標那些優秀、成熟的設計,隨時透過對比找出差距。我們經常會發現,大家往往在做設計的時候不知道什麼是好的設計,不知道自己處在一個什麼水平。實際上,在網上(比如 Dribbble ,各種論壇,以及一些已經上線了的產品)能找到很多優秀作品,這時候跟自己的作品對比,要朝優秀的方向努力,即使摸不到, 跳起來的程度也比別人要高很多,所以要給自己設這一道線,不斷地去對標。另外,要去吸收優秀設計師的知識和經驗分享,透過部落格、知乎等各種各樣的渠道去找到相應的分享。特別是很多人的分享都會跟現在一些產品、思想相關,這些一線設計師、產品經理的分享對大家來說都是寶貴的財富。而且也正是因為網際網路,所以才能找到這麼多相關領域的優質的分享。在一些相對傳統的領域裡是沒有地方可以去找這麼多優秀的東西的,就是因為在網際網路行業大家都願意去分享,樂意去讓更多的人掌握知識,所以要珍惜這些機會。

零基礎如何自學 UI 設計?

第六點,尋找實習和實踐的機會。

我們要建立在自己有基礎的技能之上,去實習是要去貢獻力量而不是單純的去學習。再者,要有積極上進、熱愛學習的心態,沒有人特別喜歡一個消極的人,要給別人一個幫你的理由。很多時候,一個企業或者一個團隊想要去幫一個初學者、入門者,往往是因為發現了他的一些閃光點,比如這個人學習能力很強或者特別積極上進,就好像看到了當年的自己,這個時候他就會願意去幫你。所以一定要把這種陽光的態度、努力的東西去體現出來。而不是在找到實習的機會時首先想到的是自己的得失、怎樣讓自己更輕鬆一點。此時,你的著眼點應該放在怎樣讓自己提高上面,不管是受了多大的苦、有多少的付出,都是在學習,認識到這一點是非常非常重要的。還有就是要關注各種各樣招聘的渠道,比如各種招聘網站、論壇或者知乎這樣的地方,包括一些自己很喜歡或關注的產品,有時產品裡面會臨時釋出招聘資訊,很多產品是很喜歡招聘自己的使用者的。所以如果大家有喜歡的產品,建議多去留意他們發的招聘的東西,如果剛好時間點對了,你就可能會獲得一個實習或者實踐的機會。

零基礎如何自學 UI 設計?

第七點,就是一句話:一個瓶頸接著一個瓶頸。

設計師其實就是這樣的,不管是新手還是資深設計師都是不斷地去突破瓶頸的。設計水平的提升需要大量的時間,而且很多時候你開始堅持、不斷努力去提高的時候,那段時間你是看不到自己的提升的,你每天絞盡腦汁卻發現自己的設計水平還是提升不上去。但是,只要第一,你方法對了,第二,堅持的時間夠長、用的力氣夠大,就不要管當時怎麼樣,每天把自己手頭上的事做好,每次有了新的任務、新的設計目標,一定要超額完成,一定要往自己的要求上去走。如果一個設計師每天工作完了想的是我今天的工作完成了,我都做完了,我沒什麼事做……這是非常可怕的,你要知道設計是沒有止境的,一定總有還可以提高的地方,而且每次都要給自己挑戰。最讓人討厭的是,一個設計師會說“已經沒有辦法再改進了,已經沒有把設計做得更好的空間了”。對於設計師來說,永遠都不會存在上述的情形,而應該是我沒有足夠的資源、沒有足夠的時間,但是從能力上或是從本身上我們一定是有機會把它做得更好的。所以當遇到這些瓶頸,發現自己一段時間提高不了後,我給出的建議就是沉住氣,堅持六個月後回頭看,將半年之前的狀態和現在進行比較,一下就能感覺到自己的進步。這樣六個月復六個月一直堅持下去,不超過兩三年,你的水平一定會迅速地提升。

第二部分:100天新手視覺設計師入門

這裡是一個可以參考的建議,大家可以根據自己的具體情況調整。之前聽過我知乎Live 的設計師,在微博和微信裡做了一系列學習活動 #設計師百人百天#,我會在文章結尾會附上一個具體的參與方式,也供大家參考。

所謂100天,可以自己來安排,根據自己的實際進度規劃,這裡只給一些參考。這些內容是之前講課時的部分材料,之後可能還會調整,這裡只是原始版本的。

零基礎如何自學 UI 設計?

一、圖形練習(圖形是視覺設計的基礎 共20天)

1。(5天,每天一組)功能性圖示臨摹——找5種不同風格的功能性圖示組進行臨摹,其中需包含 iOS 10 系統的功能圖示以及 Material Design 的功能圖示

零基礎如何自學 UI 設計?

(直接截知乎Live裡的圖,相當於做水印了)

2。(5天,每天5個或每天一組)扁平風格圖示臨摹

零基礎如何自學 UI 設計?

3。(5天,每天一個)寫實特效圖示臨摹

4。(5天)圖示造型創作練習:在以上三類圖示裡選擇5種圖示進行重新創作,1套功能性圖示,2套扁平風格圖示,2套寫實風格圖示,重新按照自己的想法去進行創造

零基礎如何自學 UI 設計?

二、配色練習(共10天)

1。(2天,每天兩張)配色收集+臨摹,收集好的配色設計,並進行臨摹

零基礎如何自學 UI 設計?

2。(8天,每天一張)重新配色,選擇合適的圖形及需要進行顏色搭配的圖片進行重新配色,利用自己已經收集的好的配色的方案

零基礎如何自學 UI 設計?

三、控制元件練習(共20天)

1。(10天)將 iOS 和 Android 的系統控制元件全部臨摹一遍

零基礎如何自學 UI 設計?

2。(10天,每天一個)選擇 Dribbble 上比較優秀的控制元件設計進行臨摹、

3。(10天,每天一個)圖示及控制元件動效臨摹練習:可到 Dribble 上搜索一些比較不錯的圖示和控制元件的動效進行臨摹,或是 Material Design 的動效設計

零基礎如何自學 UI 設計?

四、介面練習(共30天)

1。(10天,每天兩個介面)將 iOS 和 Android 的系統介面選擇性臨摹

2。(10天,每天兩個介面)臨摹優秀 App 的介面設計,例如: Google、Facebook 等相關產品的優秀介面

3。(10天,每天一個)臨摹介面轉場動效

零基礎如何自學 UI 設計?

五、命題創作

(每天一個題目)可以自己找,也可以訂閱 Daily UI 之類。以後有空的時候,我也會和朋友一起出一些提出。

——

可供參考的 UI Sample:

零基礎如何自學 UI 設計?

零基礎如何自學 UI 設計?

零基礎如何自學 UI 設計?

零基礎如何自學 UI 設計?

——

(互動設計的以後也會有的,以後會整理,或者著急的話從我之前講過的課程裡找也可以)

第三部分:開始實際學習

提供一個學習的途徑:

#設計師百人百天# ,找到很多同學正在進行的練習。

同時,可以在微信群裡發出自己的作品,找到同樣正在學習的人。這些都是純用來發專業內容的微信群,請不要做任何其他的使用者,不要閒聊,不需要活躍,可以發自己作品,發自己心得和教程,越少越好,只要精不要多,不要相互打擾。

——

長期來說,我很看好設計在中國的發展。設計的價值,首先將在資訊產品/數字產品中體現出來,逐漸滲透到各個行業當中。如果我們對標美國的歷史發展,會發現在上個世紀,當美國的工業開始崛起時,同樣是從滿足基礎需求,到逐漸開始注重設計轉變,所以有羅維、有後來蘋果的 Ive 等一系列的設計大師,有今天從虛擬產品到實體產品中各種各樣好設計的出現。而今天,中國正在一步步走過美國等國家的路,這是必然的趨勢。

設計是一項長期技能,而且很多領域的設計本身是相通的。如果對設計感興趣,可以從入門開始,堅持做下去,並且跟隨著行業、產業甚至時代的發展,不斷的成長。從 PC 的介面,到手機的,到各種 App 的,到車載裝置、各種智慧裝置的,到 VR 等全新互動方式和裝置的,總有設計師的用武之地。

——

第四部分:入門需要注意的地方

1.UI入門新人需要注意的重中之重是什麼?UI的設計理念是什麼?

UI 新人入門最需要注意的就是打好基礎。而不管你是做視覺設計還是做互動設計,打好基礎的唯一途徑都是大量練習。對於視覺設計來講,無論是畫圖示,還是把握整體介面風格,都需要大量的訓練作為基礎。而對於互動設計來說,大量練習意味著你需要看大量的產品,讀大量的文件,理解和吸收別人的做法,瞭解一些行業設計規範等等。

現在很多新人的一個問題是眼高手低:總想去做一些大的事情,總覺得自己的想法、概念很好,但真正開始動手的時候,才發現手上的能力跟不上大腦,這是一個特別嚴重的問題。

所以對於新人來說,重中之重就是去增強自己的動手能力,然後才是一個臺階一個臺階往下深入。

2.學習UI設計時,有無必要深入學習一些平面設計的理論知識?

這是 nice to have (有了會更好)。如果你有時間有精力,我建議你多學習一些關於平面設計的理論知識。雖然很多人平時憑藉自己的經驗和摸索也可以積累到類似知識,但如果你可以系統掌握這些理論知識,往往可以事半功倍,花更少的時間做到舉一反三。所以,只要你有精力,多學習一些相關知識是沒有問題的。

3. 一直聽說基礎和動手很重要,那基礎和動手到底是指哪方面?感覺不知從哪入門?

我在之前的回答裡也提到過,動手也分你是做互動設計的、視覺設計的還是使用者研究的,每一塊都不一樣。

如果你是做互動設計的,動手就意味著分析大量的產品,對於幾十個產品,逐個分析產品裡的資訊架構、互動邏輯等等內容,並且還要試著自己去畫線框圖,試著去理解這些產品的使用者定位,理解產品意圖,找到這裡面的問題等等。

對於視覺設計而言,動手是一個從臨摹幾十個甚至上百個圖示開始,到模仿視覺介面,最後乃至整個視覺感覺的過程。

如果是做使用者研究的,同樣的,你要去理解與產品相關的領域,瞭解現在的使用者都在做什麼,有哪些基礎的方法能夠去了解他們。你還需要掌握一些基礎概念,比如說什麼是資料分析,如何去做資料分析,這些知識在網上能找到很多教程。在瞭解這些之後,初步分析有什麼是能動手的點,比如從網上找一些資料,或者選擇一個具體的領域如電商,然後透過微博或者其他途徑嘗試抓到這些使用者的反饋,寫一些研究報告,我覺得這些都是動手。