跨專業的我是如何從0開始學UI的
猶記得當年一腔熱情，從一個非設計專業的學生考研到了設計學專業，本以為是真正踏入了設計的門檻，但是那時候才發現，真正開始學設計的日子才剛開始。
12年的時候，開開心心地帶著行李開始了讀研的日子，那個時候心思很單純，單純的喜歡設計，連未來具體要做什麼都不知道，入學之後學了一個產品設計的方向，不知不覺在公共課中到了研二，然後和學長學姐交流，也陸陸續續看著舍友開始出門實習，但是自己出來做什麼都不知道，關鍵是本科沒有系統學過設計的基礎，連軟體都沒有一個會用的，懵懵懂懂也出門找實習。那個時候校園裡還沒有普遍提過UI，大家所知道的設計出去大部分還是做工業產品設計，平面海報設計，拿著一些課堂的很簡單的作業和PS的一些練習出門找實習了（當時真的是PS都不怎麼會用，就會寫基礎的填色，框框圓圓，連鋼筆都不熟練的狀態），憑著想要學習的心理當時得到了一個平面實習的機會，在一個設計師的帶領下，教我用INDESIGN做一些報紙的排版，這份工作做了大概半年，做得很開心，但是總的出來之後發現自己其實什麼也不會，也就是那時候研二過了一半了（我們只有兩年半）開始聽學長學姐說了UI了，大家也陸陸續續討論畢業之後的從業到底走什麼方向，這個時候突然覺得自己得開始準備了，也要學習一些東西了，不然畢業之後連做什麼都不知道了，那個寒假回家之後我就開始了自己著手做設計的準備了。
階段一：軟體學習
那個時候聽大家提UI已經提的很多了，但是沒有一個人帶，也沒人系統給我們講解什麼是UI，包括在校連一些常見的UI網站大家那個時候都不知道。沒辦法我就自己在網站上搜索UI學習，當時我覺得最大的困難是除了INDESIGN，我連一個軟體都不會，就是畫個圖示都畫不出來的那種。我就開始在網站上找教程，剛開始很簡單的那種，而且教程每步必須要非常詳細，能讓我直接對摺教程一步一步畫出來那種詳細。每天下午揹著電腦去圖書館，學習兩到三個小時，最早就是畫那種扁平摺紙或者長投影的圖示，邊畫一步邊做好筆記，防止自己忘記了，那個時候一天能畫一個最簡單的就很不錯了，照著教程畫完一個之後再自己不看教程重新畫一遍加深記憶，簡單畫好了再嘗試難一些的，寒假畫了一個多月，一個月後回到學校，PS鋼筆工具，摳圖，圖層樣式，蒙版什麼的基本上都會用了，當時手機上的一套圖示我覺得自己能夠臨摹一套下來了，然後能夠靠拼圖摳圖做一套簡單的海報（審美不敢直視的那種）。
附：圖示學習教程http://www.uimaker.com/uimakerhtml/uistudy/
總的說這個時候最重要的就是堅持，軟體是每個人的基礎，但是學習軟體最好不要抱著一大本書PS教程之類的，學著學著你就放棄了，最好的是找實戰專案那種，實際做幾個圖，做幾套圖示下來，你的軟體也就差不都操作熟練夠用了，後面你可以再慢慢豐富積累。UI新手一般圖示PS或者AI先學一種就行，軟體都是相通的，介面SKETCH，也是跟著實際專案畫一遍，基本都會用了。
階段二：UI基礎知識學習（軟體加強）
帶著一個月練習的圖示以及拼拼湊湊的海報，開學之後我又去找實習了，這次目標很明確，就是找個UI實習或者助理方面的工作，可能是我的態度打動了設計師，雖然沒啥作品，還收到了幾個助理之類的實習崗位，斟酌再三，當時我去了一家知名度高的一家企業，雖然錢相對小公司少很多，離得也非常遠，但是抱著學習的心態，我還是堅持下來了。
剛進去的時候就是大量的打雜工作，先切圖，那時候還都是PS切圖為主，圖示先在PS裡面擺好，放大成1.5倍的，一張張切出來，後來有需要補充圖示的我就開始慢慢畫一些線性的圖示，比如通知，設定，重新整理這樣的圖示，跟整體風格保持統一。
畫了一段圖示之後有一次設計師忙不過來了，就分了我一些很簡單的介面讓我協助一起做，我就比對的以前的頁面，頭部多大尺寸，字型多大，內容區域左右留多少，間距多少，分割線什麼色值，多粗，自己一點點畫素的比對，把那幾個頁面認認真真做出來了，做出來一批就發現，你對頁面頭部多高，底部多高，圖示一般多大範圍，間距，色彩都有一個大概的認識。
所以對於初期學UI的人，如果你對介面一無所知，我建議可以找一個知名但是比較常規的APP，比如微信，QQ，知乎，騰訊新聞等，只挑一款，認認真真像我上面那種臨摹一遍，你就發現你對整個APP介面就有一個認識了，為什麼挑這幾款呢，首先，他們的介面樣式比較簡潔，多為色塊線條裝飾比較少，適合新手入手，其次他們有專業的使用者體驗團隊，做的產品比較專業，而且使用者量比較大風格能使用大部分使用者，能讓你初期對UI規範有很好的理解，不至於走偏了。
當時畫完一些簡單的頁面之後帶我的設計師就給我佈置了一份任務，當時我們準備做一款運動社交類的軟體，他讓我找一下市面上比較常見的一些軟體，然後挑選最好的三個產品，讓我寫了一份產品分析的報告，當時的我其實也是很模糊，並不知道怎麼下手，請教了一下設計師大概給了我一個方向，可以從功能入手，也可以從UI設計入手，我便開始嘗試起來。首先我把三款產品的功能結構全部認真看了一遍，並且自己對三款產品做了一個對比，比如先從整體結構分析，每款產品包含幾個模組，首頁是先放的分類入口還是直接就是主功能，列了一個如下的一個詳細的列表（畫這個圖可以使用XMIND），當然初期建議自己在本子上列清楚瞭解就可以，不用刻意去學習軟體，但是一定要細緻，知道自己瞭解產品框架就行。然後把三個產品的功能截圖或者文字說明或者畫框架做一個對比，你就能夠明白大概一款這樣的軟體包含了哪些功能，每個功能又包含了哪些小模組對產品就有了一個清晰的認識了。
分析完框架之後呢就開始分析UI設計了，這個時候我們可以側重於功能展示的，UI規範的，我們詳細對比三個產品，我們可以具體到每個頁面，同樣是運動頁面，他們都是怎麼展示的，畫面佔多大空間，圖示怎麼排版的，同樣是個人資訊頁面，他們的哪些內容放在上面，哪些模組放在一起，做一個對比列表，然後自己也就能明白每個頁面我們可以有哪些展示方式，不同的位置擺放大小處理突出哪些功能。最後等你整理完一套就對一個產品的功能和設計有一個清晰的認識。
做完產品功能的分析之後建議再做一個UI的分析，可以分析三個產品的風格，他們怎麼配的色，用的什麼風格的圖示，字型大小和間距是多大給了你什麼樣的視覺效果，每個模組怎麼分割，間距和色值又是多少，這樣的分析其實就是一套UI規範的行程，能讓你對風格的把控，做一款軟體如何讓自己對自己的一整套設計有規範意識。
附一個詳細的規範下載，初學者可以按照此做一份詳細的UI分析：https://www.uisdc.com/163-design-principle-and-guideline
階段三：UI實戰
有了上述的練習之後，我也算對UI有個初級的入門了，UI包括哪些東西也有個系統的認識了，UI要做哪些工作也清晰的瞭解了，但是現在遇到的最大的問題是馬上要面臨畢業了，但是我手裡連一份像樣的完整的UI作品都沒有，又怎麼能夠找到一份UI設計師的工作呢。實習完這個工作之後買上又步入暑假了，我決定還是趁著兩個月的暑假好好地準備好作品，以備秋招開始要畢業找工作。但是想來想去也不知道準備什麼好，剛開始幾天還是很浮躁的，想做款炫酷的產品，能一眼拿出去吸引別人的，發現自己連畫張詳細的UI稿都難，更別提各個功能那麼多細節了，焦慮了幾天之後也慢慢定下心來，不能總想一口吃個胖子，先選一個個人覺得還能夠上手的稍微簡單點的，比如我要做一款新聞的APP，然後自己先對他們做一個簡單的梳理，自己確認好要做哪些內容，然後自己畫一份自己能看懂的框架圖，我記得當時自己AXURE操作還不是很熟練的時候，我就直接拿筆在本子上畫，先寫清楚自己要實現哪些功能，然後每頁做什麼功能都畫出來，自己都梳理通了，再開始設計。比如我想做一款新聞軟體，我就思考我想做哪些，我對娛樂比較感興趣，我就對我的APP先定位，我主要以娛樂為主，主要功能一個是娛樂界的八卦，一個是搞笑類的視訊，可以分為這兩個模組，再做上搜索功能，搜尋裡要放上每天一些熱搜，個人中心我目前只做蒐藏，瀏覽歷史等，謝謝大模組搞清楚。然後相應的每個頁面我再拿筆把框架圖畫出來，當然你能用軟體簡單畫也很好。
功能做好之後，我要開始定風格了，我不想市面上的呆板的藍色，紅色，可以選一個自己喜歡的風格，但是要把整個風格貫穿於你的整個APP中，做底部的TAB欄就找很多別的新聞的參考看看別人都是怎麼做的，做新聞列表的時候就把新聞的軟體瀏覽一遍，看看別人的圖文怎麼排列的，間距多大，文字多大，圖片尺寸多大，電腦上做好效果，用手機瀏覽，PS可以用psplay，SKETCH作圖可以用mirror，這個時候千萬不要圖快，沒做一個模組的時候，你都要下載大量的APP對比別人的相似模組為什麼這麼做，你覺得哪種樣式最清晰，使用起來最好用，這些都要好好斟酌出來。另外不要偷懶，圖示都要自己畫，每個圖示保持線條粗細，圓角大小風格要統一，統一模組的圖示保持視覺大小一致。當你把一套APP能完整做下來的時候，你就發現，UI對於你來說你已經懂了，不再像個門外漢，還得到處問人，我想轉行學UI但沒有經驗應該怎麼學，UI要做哪些東西，你已經能夠清晰認識到，你要去做的工作崗位具體都是什麼樣的工作內容了。
階段四：UI反覆實踐
帶著為數不多的兩個練習產品，已經平時練習的一些手機主題圖示，臨摹的一些插畫複雜圖示等就踏上了找工作的道路。那個時候已經為自己能夠獨立做一套APP而開心的，但是真正到工作中才發現，自己還是太年輕了，因為一拿到產品的框架圖，水平就還處在按照框架圖的板式填上色，調調間距的水平，每次需求方說能不能想一想新的樣式都覺得對自己是很大的挑戰。當時產品還需要一些banner配圖，就覺得自己方向是UI，不應該做這些平面的東西，剛工作的心態還是非常不好的，還有些眼高手低。這樣的時間持續了好長一段時間我才發現，自己的水平一直都沒什麼提升，而且做出來的圖產品也很難認可，產品一拿出一些稍微複雜的比如個人中心做的配圖這樣樣式的我都難以下手做出來。自己的水平沒有認可，每次做的需求也都是偏打雜，做一些小的改版，小調整之類的工作，也讓自己越做越不開心。
後來有想換工作的想法，但是真到找工作才發現，這樣的水平想要找一份獨立負責APP的專案，除非是一些初創形公司，所有涉及一個人做，就是還是類似初級助理的工作。經歷些挫折之後自己的心態也開始變化，認識到自己差距真的是很大，但是那個時候還有一些迷茫，就是知道自己不足了，結果發現自己圖示也不行，banner也不行，APP也不行，想去提升也不知道怎麼提升，剛開始學的臨摹，三天打魚兩天晒網過了一段時間之後發現，軟體水平是進步了，但是實際工作還是困難。
漫無目的地摸索一段時間後開始決定，先從工作中做起，那個時候總覺得分配給我的工作都是的打雜的，做的對自己沒用，後來慢慢才想明白，哪有工作那麼好，能每次讓你擔任主導的設計工作，即使你後來成為一個高階設計師也是如此，連一些打雜的頁面都做不好，又怎麼能讓你的上司放心讓你開始做一些主要的頁面。心態慢慢平和之後，我就有了目標，認真對待分配給的哪怕是一個彈框需求，我就先去花瓣上搜索彈框的樣式，然後根據我們自己產品的特性，時間充裕的情況下精心做好，並拿去跟產品溝通調整細節，最後發現一個彈框都能做的很提現設計水平。或者過來的是個banner運營需求，我先大量蒐集這樣的圖分析一下常見的風格，並且跟運營確認下我們平時什麼樣效果好，在不影響點選率的情況下，認真把圖的視覺效果做好，初期感受最大的是，作圖儘量不要摳圖，時間充裕的最好都自己畫圖，一方面多畫幾次對自己配色，軟體能力都有提升，另一方面畫多了你自己就有自己的素材庫，緊急情況下都可以對一些素材複用。而且當你心態變好了之後，哪怕改版就優化一個圖示，一個簡單的頁面，一張預設圖補充，你都能覺得學到很多東西，因為你工作中接觸的其實是大多數APP工作的一部分。發現圖示不好了，空餘時間再針對這些圖示補一補，banner不好了，空餘時間同樣風格多畫幾張。
另外一個提升的方式就是和之前一樣，去做一個APP，有一些積累之後，現在練習APP可以建議挑一些產品試著對它進行改版，另外要學著嘗試不同的風格的製作，做的時候還是像之前一樣，下載大量的競品進行分析，每個功能進行比對，自己劃清楚框架圖對整個產品的功能進行一個梳理，圖示插畫都自己認真畫，嘗試多個不同的樣式比較哪種效果更好，細節要精細到，比如搜尋，搜尋功能包含哪些步驟，搜尋提示要怎麼做，搜尋框是收起還是一欄都是怎麼考慮的，當你有耐心做出來一兩個風格不同較大型的APP的時候，你就發現你有自信也有能力去承擔一個獨立的APP設計了。