從零基礎如何自學 UI 設計?
除了界面 同時也包括交互部分,逐漸深入可以參考那些書籍和網站。他們需要用到哪些軟體?
2015年12月9號更新:
歡迎大家關注我的微信公眾號:ui每日推
我會在每周日更新我的視頻教程,教大家如何零基礎自學 UI ,內容包含詳細的操作技法,對設計的理解,配色,版式的運用等等,另外每天推送國內外精選的十佳 UI 作品,只需兩分鐘輕鬆提高審美!
已經有1萬人關注了,就差勤奮的你啦!請掃下面的二維碼。
http://weixin.qq.com/r/J0hgeDTE1mmprXAb9x01 (二維碼自動識別)
......................................................................................................................................................................................................................................................................................................................
正文:
看了這麼多答案,我也來講講我的自學設計之路
2011年,大學一年級的時候,我的專業是軟體工程,但是我奇怪的被分到了物理電子工程學院,老師從來不教軟體,天天教電路基礎和大學物理,由於沒興趣,我從來不去上課,就和同學們開黑打dota,這樣打了一年。
2012年,大二了,我媽有一天和我講,說以後肯定不能幫我安排工作,我突然有了危機感,如果畢業了我還沒工作,會很丟人,我父母都是教師,別人家的孩子不是出國就是考上重點大學,壓力還是很大的。當時我還掛著4門課在學校。
當時喜歡研究各種手機越獄和雨滴之類的東西,然後有一天,我打完遊戲上網的時候看到了一張圖片
當時我還不知道,《1126》,設計師叫羅子雄,現在是鎚子科技的視覺設計總監,那時候我還沒有ui設計的概念,把這個都叫做主題,它太精緻了,給我帶來極大的震撼,不僅細節完美,而且還特別嚴謹,運用了黃金分割。如果你以為我看了這個作品就開始努力學UI那你就大錯特錯了,我根本不知道這是用什麼軟體做的,我開始學習了網頁設計,研究css樣式和html,學了半個月發現好像有點不對,這是幫助別人實現效果的啊。。。然後有一天看到邵飛老師的一個視頻教程,是教你畫圖標的,需要用ps這個軟體,我跟著做了一下,完全做不下來,我就百度如何學ps,找到了李濤老師的《ps高手之路》,這樣開始一步步學習ps,每天也不上課就看視頻學習。不得不說學軟體是個漫長的過程。所幸李濤老師的講解很幽默,也就跟著學下來了。
接下來要講的是我的臨摹之路,這個相當漫長,也最為重要。因為UI設計也是設計的一種,所以它第一個要求就是你設計的東西要美,如何能美?細節是最重要的,你需要觀察,仔細的觀察你和大神的作品之間的差別,然後再想辦法實現它。現在設計之所以浮躁的原因我想就是很多人不願意也沒有耐心去培養自己的審美了。
當時站酷上有一個視頻教程叫《十分鐘UI設計》,是騰訊的設計師omega和老程一起做的,裡面的內容特別好,大家可以去搜索一下,我跟著裡面的教程做了很多練習,當時老程說,windows的圖標是很不錯的,當你能把一整套圖標都臨摹下來,你就出師了。
這是我當時跟著臨摹教程做下來的,一個比一個有進步,每個都花了一天或者半天時間完成,當達不到原作效果的時候就繼續觀察,繼續改,現在一看還有好多問題,比如第一個鉛筆的投影是黑色的很難看,第二個撞球的邊緣太銳利,很不真實,如果當時不是瘋狂修改我想問題會更多。
2013年,大三了
當我臨摹了半年以後,我認為我的ps技術已經很不錯了,跟同學說話的時候也愛吹牛,說自己是ps大神,一天一個同學下午來我寢室,說你幹嘛呢?不知道今天晚上團里要開荒?你的薩滿裝等多少了?天天日常任務也不做。。。我說我畫會圖標,他說???我說我以後想當設計師,他說你別逗了。。。我當時心想一定要堅持下來!
有一天在上站酷的時候,發現一個主題設計,再次深深震撼到了我,那時候ios7扁平風格盛行,很少有擬物的東西出現了,在看了很多千篇一律的設計以後很難被打動。
牛mo王的《心隨我動》,參加了康佳首屆主題設計比賽,我立馬跑到他站酷的主頁牛MO王的個人主頁 膜拜了他,看了他當時發的所有文章,他也是自學,我覺得太厲害了,他當時寫了好多文章,告訴大家如何自學,感觸特別深。後來我找到了他的qq,沒想到他居然同意了,真的特別興奮。。。然後我問了他一個圖標方面的問題,令我沒想到的是,他居然打開ps手把手教我如何調參數。。。一邊做一邊傳圖片給我,教我如何實現效果,他說好多東西其實非常簡單,但是沒有人告訴你的話自己很難想出來,到現在我都特別感謝他,叫他牛哥,雖然他不姓牛。。。我問他心隨我動這個主題是怎麼做出來的?他說只有積累到一定程度才可以。。。然後我默默努力,偷偷臨摹它,一天一個圖標。下面是我臨摹的《心隨我動》。
做了快一個月,其實我在最後一天偷懶了,上面的哪個大的天氣widget是用的原來的圖摳下來的。。。然後我把臨摹的給牛哥看,他當時就說,哇,好棒,你進步好快!可能沒有誰像我一樣把它臨摹了一遍,在這些過程中,我的技法運用越來越熟練了,其實做這種ui,只需要你用好圖層樣式這一個ps功能就好!剩下的就是不斷調整內陰影,投影,還有漸變,一定要注意投影的顏色,不要用黑色!要用深色,比如說黃色就用深黃色當投影,藍色就用深藍色,這樣。推薦大家去站酷看看牛哥的文章,他的分享真的是很詳細也很實用,從字體選擇到ui入門都講的特別到位,在學習路上能有他這樣的老師帶路我想我很幸運,再次謝謝他!
當ps技術熟練以後,我就想著做一些自己的東西出來,然後照著照片用ps塗抹了一張定製耳機
現在感覺陰影有一些深,線的感覺也不自然,有些發虛。
在大三後半學期,參加了小米的主題比賽,每個圖標都在網上搜索好多的圖片做參考,然後自己繪製,差不多兩個月的時間,最後入圍了決賽。
自己做主題和臨摹是有很大不同的,每個圖標做多大?用什麼顏色?這些都需要自己控制,可以看出,這個作品在這兩個方面都很差。。。當時很迷茫,自己做的東西究竟是不是設計?字體要用什麼?排版怎麼才好看?因為平時積累的東西太少了,所以真的很質疑自己。我意識到需要多看設計方面的東西,所有的都需要積累,到需要用的時候才能用到。
第一次 接觸實際項目 是大三後半學期,我的一個老師要做一款ios應用,主打背單詞功能,我們兩個人他寫代碼,我負責設計 ui 。我花了一天時間研究切圖,研究我做的圖片怎麼才能用在實際的app中,然後我模仿path做了幾個樣式出來,我們幹勁十足,前後做了好幾個版本,修改了十幾次。
這個軟體前前後後一共做了半年,對我實際項目的實踐是一個挑戰,靠這個軟體我還拿到了在京東實習的機會,大四後半學期在京東實習了半年。
期間還和同學做了一個網站叫野渡集市
現在我工作已經一年了,在北京的美餐網,自己一路自學過來,毅力很重要,我想興趣更重要,我現在還在不斷學習,因為自己的設計知識還是很不足,到這個時候要多看看ios和google的設計規範,知道ios的最小點擊區域是44pt,字體不要小於22像素,36像素適合閱讀,這些都是在以前自己很少注意到的。現在每天還在自學c4d和ae,加強自己動效方面的實力。
發一點現在的作品吧,我覺得很少有人能聽我啰嗦到現在。。
最後推薦大家一定要多上dribbble,看看國外的大神是怎麼做的,當我上dribbble以後才發現,很多國內的所謂大神不過是抄襲別人的作品而已。
/////////////////////////////////////////////// 9月25日更新 ////////////////////////////////////////////
剛才寫了一大堆然後瀏覽器崩潰了都沒了。。。只好重寫了
2天收穫了500多個贊,我真的沒有想到,還是有好多同學提問或者私信我,我在這裡做統一的解答
1.好多人問我用的是什麼軟體?是ps還是ai?
這個問題在我學ps的時候也特別困惑,我想說的是一門心思學好ps就行了,ps比ai更適合做ui設計,我都是用ps做的,當然用ai也能做出來但是會不方便,而且網上ps的教程會很多,ai就很少了,所以建議大家學好ps。
我現在工作以後使用sketch進行設計,因為公司是全mac辦公,用sketch能極大提高效率,sketch默認輸出一倍圖片,減少了標註的麻煩,而且設計稿可以讓ios工程師直接使用。(現在這個軟體只有mac能用到,這是它不好的一點,當然有條件的可以學習一下,很方便。)
這是用sketch設計的設計稿,雖然最後沒有用,但是可以看出來一個文件搞定了好多設計稿(不會說話了。。。)
2.我向大家推薦了使用dribbble來提高審美,並且了解ui設計的最新趨勢,但是說的不仔細,現在給大家分享一下我如何使用dribbble。
首先在dribbble里有一個點贊功能,叫likes。
拿我舉個例子,在我的主頁,這個地方,進去有我喜歡的作品。
這個有什麼用呢?比如我在瀏覽今天dribbble的推薦作品的時候,發現兩個超棒的作品,看下面的圖:
我們可以發現,這是兩種不同的風格,也是現在最流行的兩種
第一種設計是那種酷炫的,很有ios的風格,像自帶的應用日曆一樣,裡面有很多小的控制項,很精緻。
第二種設計現在更多得流行起來,用大的色塊,大的按鈕,大的圓角,還有流暢的動效給使用者帶來非常愉悅的感覺,有的配合了卡通形象,更加增加了親切感,這類的app有marval,還有遊戲jellies(就是那個抓水母遊戲)。
我們點擊作者的名字,到他們的主頁,看到他們更多的作品。
可以發現他們在自己的風格裡面都做的特別棒,有很多值得我們學習和研究的地方,最好能看看他們的likes,看看他們都喜歡什麼作品
比如這個大神,應該是中國人但是原諒我不知道他是誰,低調的人太多了
這個是他的主頁,可以看出來他也是第二種風格的,我們看看他的喜歡
果然,可以看到更多的大色塊和卡通的設計。也讓我們發現更多的擅長此類設計的大神。
接下來講講dribbble的搜索
當有一天老闆需要我設計一個登錄界面,但是我並沒有什麼好的靈感,
大家肯定早就注意到dribbble上有search按鈕了,我們搜索「login」,出來以下結果
這麼多的登錄界面設計,這下不怕沒有靈感了,我忘了是誰說的了,世界上沒有純粹的設計,所有偉大的作品都是以前的作品的結合和再創造,我們學習別人的想法和設計語言。
dribbble還有很多psd可以下載的,比如iphone的各種展示模型,我們搜索「mockups」或者「mockup iphone」就可以找到下載了。做展示的時候很好用。看下圖:
我做界面設計的時間也不長,只是說一些自己的理解,尤其是工作以後,那些很炫很酷的界面往往是不能實現的,我們的設計不能出格,比如在ios上你使用安卓的材料設計語言就很錯誤,但是在遵守大的設計規範的時候如何才能讓你的設計出彩?這就需要我們對細節的處理,比如path里掉下來的小卡片,或者是一個小的可愛的動畫,讓用戶能感覺到設計的精緻,現在我們也管這種小細節叫「情懷」。我們看好的作品不一定要把他實現,但是要學裡面的細節,有時一抹亮色或者一點光暈就能為你的設計點睛。
3.前面有些提到的素材有人說找不到,我幫大家把鏈接貼出來
【十分鐘設計第一季】史上最酷最接地氣兒的UI視頻教程
小課堂的設計作品-UI中國
還有就是迴音的ui分享會,牛哥的u1系列教程,我都看過,也推薦大家認真看一下。
學c4d可以看看ihdt上海映速的免費教程
(以上教程我都是一步步看過來的,還有好多跟著做了臨摹,我一直認為,如果你回答里推薦的那些素材網站你從來沒有看過那是不負責任的,推薦一大堆鏈接不如不推薦,有人評論和私信噴我我必須說他們兩句。。。)
這次更新就到此為止,祝大家每天都有進步。下次更新可能要到我動效或者c4d有大的進步的時候再來了!
最新作品更新:
dribbble:Dribbble - zfy
zcool:力力_NeverGG的個人主頁
我會經常更新的!!!!
【更新】
2017.08.03
這篇回答寫了快一年了,一直沒有更新過。想等到自己正式找到工作了再來更新。如今正式找到工作了,到了該更新的時候了。
自學完PS之後,準備了第一份作品集,之後在寒假之前開始各種投簡歷。當時我的心態很簡單:「找一份工作去實際的操練一下」,但是真相遠比你想得要艱難。
在經歷了29小時南下的火車行程,我來到了魔都上海。選上海的原因很直接,我喜歡的人在這裡。每天早晨醒來第一件事就是投簡歷,然後坐著等一天電話,不停地查看簡歷狀態。
沒有任何工作經驗的大學生在求職過程中是最沒有話語權的,你的成績你的學歷可能都不及別人相關領域工作過幾個月的工作經驗。在拉勾,智聯,大街海投的一波全部陣亡。最後我也看清了自己只能去實習的事實,於是下了一個叫「實習僧」的APP,在這個APP上找到了我在上海第一份工作。
公司是一家互聯網金融公司,2000多人也算一家大公司了。當時工作的部門是市場部,主要的工作就是設計一些運營的插畫,海報,著落頁之類的設計,在大概一個月之後迎來了我人生中第一個項目,一款公司的借貸產品。需要為它做一個產品頁,由我和帶我的那個姑娘一人出一稿,最終項目組選擇了我的設計。
接到的第一個任務,真的很開心。在和項目組對接的時候還不忘去解釋一下為什麼這麼設計。可是最後由於工程師的原因我的第一個項目沒有完整落地,打開網址之後只有一張PNG的視覺稿。
不過我也還是很高興,畢竟是第一個接手的項目啊。覺得自己在成長為獨立的UI 設計師的路上又誇上了一個台階。
之後又陸陸續續的接了各種活,每次都是我和那個姑娘一人出一稿,不過大部分他們都選擇用我的設計。私下裡我問過他們原因,他們說她的設計風格太老舊。所以後來的設計選稿總會讓我有一種搶了她風頭的感覺。
部門的經理在我入職一個月之後就找我談話說一定要把我留在公司,一個是因為我的設計風格比較新,更容易吸引用戶;二是因為覺得我有潛力可以培養起來,以後公司也可以隨意調用。我也是十分感激這位領導,是她給了我很多支持和鼓勵。才讓我對自己的設計越來越有信心。
過完年之後又在公司實習了一個月,之後就到了不得不回學校的時間。總共在這家公司實習了四個月的時間,最大的收穫就是PS AI 的使用越來越熟練,還有在面對實際的需求時應該從哪些角度考慮問題。當然還有一些職場的人際關係經驗。
在這個月,我認識了在我自學設計的路上對我最重要的人,我的師傅——知乎大V 酸梅干超人。因為我的這個自學貼,他聯繫上了我,說他在開一個設計課程,希望我可以過去聽一聽。我在了解到他的開課意圖之後,決定去上課。
有的朋友在問學習的時間,素描利用寒暑假時間學習,加起來一共三十天左右;PS從九月中旬學到十月中旬,一共三十一天;其他的設計書籍,是利用平時課後的時間看的。
現在仍在繼續學習繼續改進,希望可以找到一份工作實際的去體驗一次真正的設計流程。
這是下午剛建的站酷主頁:陳傑NeilJ的個人主頁 希望大家可以多多交流,站酷上有 很多好的資源和教程。
【正文】
自從打算開始自學UI設計開始,關注這個問題很久了,不過學習上一直比較忙,假期犯懶癌學PS這件事一直拖到大四開學才開始。到今天為止學習PS一個月,被學校催著找工作,沒日沒夜的學PS終於是趕出了自己的第一份作品,求大神們輕拍。
一開始看到@酸梅干超人大神的高贊回答,非常全面的給出了一個自學計劃。後來又看到@力力nevergg的自學帖,又給了自己力量去開始學習。大神們的教學帖都十分詳細了,我就不說方法了,下面就對自己的自學歷程做一個記錄。希望給大家一點力量,拿出你們的行動來!
初期啟蒙階段
把知乎上關於UI設計,交互設計,用戶體驗設計的高贊答案看了一遍。對「UI,UE,UX,GUI,交互設計,用戶體驗設計」這些初級專業名詞有初步的了解,知道自己未來具體想從事哪一方面的工作。有了方向和目標再去努力會節省很多時間,有需要的同學請關注我的收藏夾,有一個關於UI設計優秀回答的收藏夾。順便把大V關注一遍,他們經常會有好的回答。
接下來按照酸梅干超人的回答,按順序一步一步來,先學素描。利用兩個暑假學習了素描,加起來大概三十天。
剛開始畫的結構素描
然後是畫球體
接下來開始臨摹石膏
下一步是開始畫靜物
學畫最後一天畫的精微素描
可以看出來進步是巨大的,最開始畫的結構素描時候真是線都拉不直,最後的精微素描自己看了都覺得不想再畫第二次(虐心的過程)。不過在老師的不斷鼓勵和誇獎之下,終於是學下來了。
在學校里利用課餘的時間,看專業書籍:
《用戶體驗要素》《破繭成蝶》《寫給大家的設計書》《設計心理學》《啟示錄》這幾本是很基礎的入門書籍,都看了一遍,對未來要涉及的專業名詞有一定印象。有時間要把iOS和Android人機交互指南看一遍。
強烈推薦看羅子雄的一個TED演講,裡面提到的三個學習要素「多看,多做,多想」,直白有效。
中期練手階段
PS Ai AX這些都是初步設計軟體,可以先開始學。
PS入門視頻可以看李濤的,祁連山的,淘寶有一大堆高清視頻。
了解基本操作之後,推薦大家一個網路教學機構叫BIGD,我是淘寶買的教程,鼓勵有條件購買正版教學視頻,裡面的課程直接個人覺得還是很不錯的。每節課教你做一個icon,過程中我們要做的是不斷地熟悉基本的UI設計操作,每課的課後作業必須做,這樣對上課的內容是一個複習。
遇到一些老師教的小訣竅,把它們都記下來,前十節課是非常基礎卻非常關鍵的,值得多看幾遍,做作業過程中忘記了這個效果怎麼出來的一定要回放一下弄明白。
這是我人生中畫的第一個icon,連鋼筆都不知道怎麼用
後來找到了教程,總算是摸到了門在哪裡
跟著教程一集的畫,第二部分的作品。發在朋友圈裡被同學誇厲害,也讓我得到了及時的獎勵。機械蝴蝶是臨摹的,機械蜻蜓是原創的。
第三部分教的是交互設計和Axure的基本操作,第一次做出可以點擊的原型,雖然簡陋卻還是很激動。
第四部分是牛mo王老師的課程,對技巧的講解很少,大部分是告訴你如何去設計。我的作品如下(ps:試了一次中文格式,真心不如英文的):
可以看出,一個月的學習,雖然進步很大,但裡面的配色,排版,交互形式仍需要提升。筆記本電腦畫出來的圖在iPhone上顯示的時候飽和度都提升了。而且筆記本電腦畫圖啊時候高度會被壓縮…這一點要注意。
平時要多去dribble,behance,站酷上面找優秀的設計,然後不斷的抄襲,磨鍊自己的PS技巧。不要覺得國內的設計看不上,切勿眼高手低。我的臨摹:
下一階段是找工作,我正在進行當中。如果有內推的小夥伴也可以聯繫我呀。找到了之後我會繼續更新的。
其實在一個月之前,我為找工作還是繼續讀書的選擇糾結了很久,甚至焦慮到睡不著覺。後來我的朋友一句話提醒了我「我不知道什麼樣的選擇才是對的,但我知道去做你最想做的,然後不要後悔」
我發現停止焦慮最好的辦法就是直面你的恐懼,你的拖延,你的各種借口。然後不斷的做做做!拿出你的行動來,時間會把你的結果顯現出來。一個月沒日沒夜的畫圖,我僅僅只是摸到了UI的門,卻還沒有入設計的門,等待著我去學的東西還有很多很多。從零到一的突破我這種三本院校的學生都做成了,你們為什麼不可以呢?
所以加油吧!總有人會在合適的時候出現,帶你走出迷茫。
利益相關:UI 和 UX 設計師的課程表
打算系統的回答這個問題。如果你正在開始學習 UI 設計,建議仔細讀一下。
在 UI/UX 這個領域,我做了差不多10年,從「用戶體驗」這個詞還沒沒有在國內流行起來開始,也帶了很多設計師,見證了很多人從入門到今天成長為BAT的設計總監的過程。很多人說 UI/UX 的門檻不高、收入高,所以想學習,想轉行,這其實是誤解。
UI/UX 領域的高級設計師、資深設計師現在的確非常緊缺,很多公司都想找我推薦人,要找到合適的人挺難。一個資深的設計師,和一個資深的工程師,無論收入水平還是其他都相差不大。但是對於新手設計師,想要真正的跨過門檻,並不是那麼容易的事,因為設計做的好壞,對於專業人士來說太容易看出來了。做的好的人,和做的一般的人,差別太大,最終的產出相差也非常大。有人說 UI/UX 領域已經飽和,同樣是誤讀,不是行業飽和,而是初級的、沒有跨越門檻的設計師太多了。被人問到自己有作品,為什麼還找不到工作?原因也很簡單,不是因為有沒有作品,而是作品好不好。作品做的好與不好,太容易看出來了。
我建議如果想要入門,首先要明確的,就是不要急於求成,不要指望上個培訓班兩三個月就能出來找工作。設計需要系統性的訓練和積累,需要堅持,日積月累。任何指導都是幫助你少走彎路,但是該走的路還是得走,短不了。
下面我從基本的建議,和一個自學的指導,分成幾個部分來說(以後有機會還可以再補充):
第一部分:學習的總體建議
自學首先是掌握軟體,其次是讀設計規範和讀書,再者是大量的練習和比較對標優秀的設計,尋找實習實踐的機會,最後要思考各種各樣的瓶頸如何去應對等等。
第一點,掌握軟體。在視覺設計中,軟體的選擇沒有很大的優劣之分,重點是要用得順手,並且應該在使用上繼續深入下去。在交互設計中,網路上也有很多順手的原型工具;文檔工具方面,如果能把最基本的 Office( Word、Excel 等)用好,你就會發現用這些工具也能玩出很多花樣,我很多年以前就用 Excel 寫過交互設計的文檔。所以做產品設計的關鍵不在工具本身而是裡面的內容是什麼。
另外還有一些 nice to have 的技能,比如一些前端開發的基本技能、視頻處理技術等等,這些技能在未來都可能用得上,能夠提升你的競爭力。
第二點,讀設計規範。這個對於初學者很有幫助,特別是現在各個平台的文檔也都寫得十分不錯。因為這本來就是針對開發者專門去做的,所以也很方便大家閱讀。蘋果、Google 等公司專門寫的文檔、規範本身的質量是很高的,比如 iOS 的《人機交互指南》、安卓的 Material Design 等。這些品牌規範一方面是在講各種控制項怎麼用、各種視圖如何轉換,同時也講了很多設計的思想。特別是蘋果 iOS 的《人機交互指南》中有非常深的、能對你產生幫助的一些原則、原理等內容。這些內容是必讀的,一定要有所了解,知道各個平台有什麼差異,有哪些控制項可以用。因為我們在設計中一定要避免重複造輪子,要減少用戶的學習成本,所以一定要知道基礎控制項能夠支持哪些功能,即使要做出一些改變,也要基於這些控制項的基本行為進行變化,這就要求我們去掌握整個平台的情況。同時,這也是一個特別好的自學各個平台的途徑。
第三點,讀書。建議大家直接在豆瓣上去找用戶體驗、界面設計等相關的書籍,只要評分比較高的都不錯,值得大家去讀。然後根據自己的時間看能讀到幾本,這是很容易做到的。而且讀書並不在於數量,我建議大家快速的去讀,先瀏覽大框,再去進行大量的練習,最後反過來再去讀這些書,你就會有不一樣的收穫。
第四點,大量地練習,這也是非常重要的一點。對於視覺設計師,要先從臨摹開始,從基礎的圖標到完整的界面,再逐漸到自己去探索去創作(後面會專門講視覺設計方案)。重點說一下交互設計師,首先自己可以去找一些典型的產品進行反向描繪,把信息架構、交互框架、主線流程等基本方面都勾勒出來。其次,要評估產品中可能存在的交互的問題,並提出改進的具體做法。這些不是簡單的口頭語言描述或簡單的想法,一定要輸出線框圖,展現基本流程,這在某種程度上相當於你在重新設計這個產品。
然後再下一個步驟就是找一兩個具體的頁面或者流程來進行詳細的改進,並且要聚焦在細節上面。大家需要注意細節是極其重要的,此處主要訓練的是你的動手能力,對基本的元素及控制項的運用能力。所以要找一些基本的頁面,試著重構它。把一些基本的東西去反向勾勒之後,你可以不再去看原有的產品,可以去試著自己實際地去改變優化,創造出新的產品來。如果能積累到多個——把不同領域的產品都做一遍,一定會有一些提升。另外,建議在每次做完之後,要再返回去看一些基本的書、設計規範,這個時候再回頭看設計,又會有不一樣的收穫。
第五點,對標優秀設計。我們要在網上找其他人的設計,每次做完設計之後要在網上對標那些優秀、成熟的設計,隨時通過對比找出差距。我們經常會發現,大家往往在做設計的時候不知道什麼是好的設計,不知道自己處在一個什麼水平。實際上,在網上(比如 Dribbble ,各種論壇,以及一些已經上線了的產品)能找到很多優秀作品,這時候跟自己的作品對比,要朝優秀的方向努力,即使摸不到, 跳起來的程度也比別人要高很多,所以要給自己設這一道線,不斷地去對標。另外,要去吸收優秀設計師的知識和經驗分享,通過博客、知乎等各種各樣的渠道去找到相應的分享。特別是很多人的分享都會跟現在一些產品、思想相關,這些一線設計師、產品經理的分享對大家來說都是寶貴的財富。而且也正是因為互聯網,所以才能找到這麼多相關領域的優質的分享。在一些相對傳統的領域裡是沒有地方可以去找這麼多優秀的東西的,就是因為在互聯網行業大家都願意去分享,樂意去讓更多的人掌握知識,所以要珍惜這些機會。
第六點,尋找實習和實踐的機會。我們要建立在自己有基礎的技能之上,去實習是要去貢獻力量而不是單純的去學習。再者,要有積極上進、熱愛學習的心態,沒有人特別喜歡一個消極的人,要給別人一個幫你的理由。很多時候,一個企業或者一個團隊想要去幫一個初學者、入門者,往往是因為發現了他的一些閃光點,比如這個人學習能力很強或者特別積極上進,就好像看到了當年的自己,這個時候他就會願意去幫你。所以一定要把這種陽光的態度、努力的東西去體現出來。而不是在找到實習的機會時首先想到的是自己的得失、怎樣讓自己更輕鬆一點。此時,你的著眼點應該放在怎樣讓自己提高上面,不管是受了多大的苦、有多少的付出,都是在學習,認識到這一點是非常非常重要的。還有就是要關注各種各樣招聘的渠道,比如各種招聘網站、論壇或者知乎這樣的地方,包括一些自己很喜歡或關注的產品,有時產品裡面會臨時發布招聘信息,很多產品是很喜歡招聘自己的用戶的。所以如果大家有喜歡的產品,建議多去留意他們發的招聘的東西,如果剛好時間點對了,你就可能會獲得一個實習或者實踐的機會。
第七點,就是一句話:一個瓶頸接著一個瓶頸。設計師其實就是這樣的,不管是新手還是資深設計師都是不斷地去突破瓶頸的。設計水平的提升需要大量的時間,而且很多時候你開始堅持、不斷努力去提高的時候,那段時間你是看不到自己的提升的,你每天絞盡腦汁卻發現自己的設計水平還是提升不上去。但是,只要第一,你方法對了,第二,堅持的時間夠長、用的力氣夠大,就不要管當時怎麼樣,每天把自己手頭上的事做好,每次有了新的任務、新的設計目標,一定要超額完成,一定要往自己的要求上去走。如果一個設計師每天工作完了想的是我今天的工作完成了,我都做完了,我沒什麼事做......這是非常可怕的,你要知道設計是沒有止境的,一定總有還可以提高的地方,而且每次都要給自己挑戰。最讓人討厭的是,一個設計師會說「已經沒有辦法再改進了,已經沒有把設計做得更好的空間了」。對於設計師來說,永遠都不會存在上述的情形,而應該是我沒有足夠的資源、沒有足夠的時間,但是從能力上或是從本身上我們一定是有機會把它做得更好的。所以當遇到這些瓶頸,發現自己一段時間提高不了後,我給出的建議就是沉住氣,堅持六個月後回頭看,將半年之前的狀態和現在進行比較,一下就能感覺到自己的進步。這樣六個月復六個月一直堅持下去,不超過兩三年,你的水平一定會迅速地提升。
第二部分:100天新手視覺設計師入門
這裡是一個可以參考的建議,大家可以根據自己的具體情況調整。之前聽過我知乎Live 的設計師,在微博和微信里做了一系列學習活動 #設計師百人百天#,我會在文章結尾會附上一個具體的參與方式,也供大家參考。
所謂100天,可以自己來安排,根據自己的實際進度規劃,這裡只給一些參考。這些內容是之前講課時的部分材料,之後可能還會調整,這裡只是原始版本的。
一、圖形練習(圖形是視覺設計的基礎
共20天)
1.(5天,每天一組)功能性圖標臨摹——找5種不同風格的功能性圖標組進行臨摹,其中需包含 iOS 10 系統的功能圖標以及 Material Design 的功能圖標
(直接截知乎Live里的圖,相當於做水印了)
2.(5天,每天5個或每天一組)扁平風格圖標臨摹
3.(5天,每天一個)寫實特效圖標臨摹
4.(5天)圖標造型創作練習:在以上三類圖標里選擇5種圖標進行重新創作,1套功能性圖標,2套扁平風格圖標,2套寫實風格圖標,重新按照自己的想法去進行創造
二、配色練習(共10天)
1.(2天,每天兩張)配色收集+臨摹,收集好的配色設計,並進行臨摹
2.(8天,每天一張)重新配色,選擇合適的圖形及需要進行顏色搭配的圖片進行重新配色,利用自己已經收集的好的配色的方案
三、控制項練習(共20天)
1.(10天)將 iOS 和 Android 的系統控制項全部臨摹一遍
2.(10天,每天一個)選擇 Dribbble 上比較優秀的控制項設計進行臨摹
3.(10天,每天一個)圖標及控制項動效臨摹練習:可到 Dribble 上搜索一些比較不錯的圖標和控制項的動效進行臨摹,或是 Material Design 的動效設計
四、界面練習(共30天)
1.(10天,每天兩個界面)將 iOS 和
Android 的系統界面選擇性臨摹
2.(10天,每天兩個界面)臨摹優秀 App 的界面設計,例如: Google、Facebook 等相關產品的優秀界面
3.(10天,每天一個)臨摹界面轉場動效
五、命題創作
(每天一個題目)可以自己找,也可以訂閱 Daily UI 之類。以後有空的時候,我也會和朋友一起出一些提出。
----
可供參考的 UI Sample:
----
(交互設計的以後也會有的,以後會整理,或者著急的話從我之前講過的課程里找也可以)
第三部分:開始實際學習
提供一個學習的途徑:
在微博里,可以搜索 #設計師百人百天# ,找到很多同學正在進行的練習。
http://weibo.com/p/100808d3bc51820319eda2de3ef97b2fe82b0d?k=%E8%AE%BE%E8%AE%A1%E5%B8%88%E7%99%BE%E4%BA%BA%E7%99%BE%E5%A4%A9amp;amp;amp;amp;amp;amp;amp;amp;amp;from=526amp;amp;amp;amp;amp;amp;amp;amp;amp;_from_=huati_topic
同時,可以在微信群里發出自己的作品,找到同樣正在學習的人。這些都是純用來發專業內容的微信群,請不要做任何其他的用戶,不要閑聊,不需要活躍,可以發自己作品,發自己心得和教程,越少越好,只要精不要多,不要相互打擾。
可以加 Lily 的微信號:LilySoNice ,註明:「知乎設計師百人百天」,請她幫忙拉進群里(可以通過不一定快,請有耐心)。
http://weixin.qq.com/r/stb64hnE3USirV2B94Og (二維碼自動識別)
----
長期來說,我很看好設計在中國的發展。設計的價值,首先將在信息產品/數字產品中體現出來,逐漸滲透到各個行業當中。如果我們對標美國的歷史發展,會發現在上個世紀,當美國的工業開始崛起時,同樣是從滿足基礎需求,到逐漸開始注重設計轉變,所以有羅維、有後來蘋果的 Ive 等一系列的設計大師,有今天從虛擬產品到實體產品中各種各樣好設計的出現。而今天,中國正在一步步走過美國等國家的路,這是必然的趨勢。
設計是一項長期技能,而且很多領域的設計本身是相通的。如果對設計感興趣,可以從入門開始,堅持做下去,並且跟隨著行業、產業甚至時代的發展,不斷的成長。從 PC 的界面,到手機的,到各種 App 的,到車載設備、各種智能設備的,到 VR 等全新交互方式和設備的,總有設計師的用武之地。
----
第三部分:參考資料
我在和知乎團隊一起探索在知乎里講專業課程。我自己平時也會在大學裡兼任導師,但是相比線下的課程,我覺得專業知識和專業技能的學習,最終一定可以在線上更好的提升效率。收費的課程並不影響免費的知識輸出,我在知乎里回答了大量的設計相關問題,至今仍然在回答,可以隨時免費查閱。
以下是一些探索:
系列:7位10年經驗資深設計師的知乎分享會
7位10年經驗資深設計師的知乎分享會 - 知乎專欄
系列:設計師入門與提高
https://www.zhihu.com/lives/courses/779054594691981312
你也想成為設計師和產品經理?
https://www.zhihu.com/lives/775301847089954816
UI 和交互設計師的入門與成長
https://www.zhihu.com/lives/763703177601110016
產品設計師和產品經理的學習指南
https://www.zhihu.com/lives/774403827829837824
----
我在知乎里回答的設計類問題集合:
索引 - 知乎專欄
第四部分:入門需要注意的地方
1. UI入門新人需要注意的重中之重是什麼?UI的設計理念是什麼?
UI 新人入門最需要注意的就是打好基礎。而不管你是做視覺設計還是做交互設計,打好基礎的唯一途徑都是大量練習。對於視覺設計來講,無論是畫圖標,還是把握整體界面風格,都需要大量的訓練作為基礎。而對於交互設計來說,大量練習意味著你需要看大量的產品,讀大量的文檔,理解和吸收別人的做法,了解一些行業設計規範等等。
現在很多新人的一個問題是眼高手低:總想去做一些大的事情,總覺得自己的想法、概念很好,但真正開始動手的時候,才發現手上的能力跟不上大腦,這是一個特別嚴重的問題。
所以對於新人來說,重中之重就是去增強自己的動手能力,然後才是一個台階一個台階往下深入。
2.學習UI設計時,有無必要深入學習一些平面設計的理論知識?
這是 nice to have (有了會更好)。如果你有時間有精力,我建議你多學習一些關於平面設計的理論知識。雖然很多人平時憑藉自己的經驗和摸索也可以積累到類似知識,但如果你可以系統掌握這些理論知識,往往可以事半功倍,花更少的時間做到舉一反三。所以,只要你有精力,多學習一些相關知識是沒有問題的。
3. 一直聽說基礎和動手很重要,那基礎和動手到底是指哪方面?感覺不知從哪入門?
我在之前的回答里也提到過,動手也分你是做交互設計的、視覺設計的還是用戶研究的,每一塊都不一樣。
如果你是做交互設計的,動手就意味著分析大量的產品,對於幾十個產品,逐個分析產品里的信息架構、交互邏輯等等內容,並且還要試著自己去畫線框圖,試著去理解這些產品的用戶定位,理解產品意圖,找到這裡面的問題等等。
對於視覺設計而言,動手是一個從臨摹幾十個甚至上百個圖標開始,到模仿視覺界面,最後乃至整個視覺感覺的過程。
如果是做用戶研究的,同樣的,你要去理解與產品相關的領域,了解現在的用戶都在做什麼,有哪些基礎的方法能夠去了解他們。你還需要掌握一些基礎概念,比如說什麼是數據分析,如何去做數據分析,這些知識在網上能找到很多教程。在了解這些之後,初步分析有什麼是能動手的點,比如從網上找一些數據,或者選擇一個具體的領域如電商,然後通過微博或者其他途徑嘗試抓到這些用戶的反饋,寫一些研究報告,我覺得這些都是動手。
歡迎大家加入加入UI、UX交流QQ群:633293003,會定時舉行公開課和答疑。
我覺得已有問題沒真正提供有效的幫助,樓上各位給題主提供的心得,本質上和雞湯一樣,只能解渴不能果腹。下面是我這幾年經驗的總結和思考,雖然我並不算是最出類拔萃的UI設計師,但也希望對題主和其他新人有益。
--------------------------------分割線-----------------------------------
這兩年有些新的感觸,在公眾號里重新更新了一遍這篇文章!把很多錯誤修改和校對了一下~~歡迎大家關注我的公眾號查看更新的內容吧~~
以後新文章都會整理在這裡,有疑問可以在這裡和我提,儘可能回復
公眾號ID:超人的電話亭
http://weixin.qq.com/r/gTru9lzEAgF9rRiV92_T (二維碼自動識別)
--------------------------------分割線-----------------------------------
第一點:學習準備——啟蒙
學習一項技能,尤其是已經有一定沉澱並在各行各業有廣泛應用的技能,就一定要對它先有充分的認知。在開始正式學習前,你需要花足夠的經歷去了解和查閱它的起源、發展、應用、未來。UI作為平面設計的一部分,再往上又從屬與美術學這一大類。因此,首先要先去了解整個美術史的發展。從人類起源各個階段中,美術經歷了什麼樣的變化,在各自的時代發揮了什麼作用,近代美術史又經歷了哪些波折,平面設計藝術是如何發展壯大走進千家萬戶,並且有哪些經驗成功過度到後來的UI設計中。那些享譽中外的藝術大師有何過人之處,他們為美術學發展做出了哪些貢獻,他們的名作到底有何動人之處。
在今天的UI設計群體中,我們作為專業的設計人員,可以和別人侃侃而談雷軍的創業心得,羅胖子的工匠情懷,滴滴快滴的商業模式以及BAT在傳統行業的布局等等,各種其實並不太相干的話題,卻說不出半點藝術見解。
我們看不懂博物館展覽那些畫作,不知道梵高畫了什麼作品,抽象派到底在鬧騰些什麼,更甚者連扁平化的推動有什麼深層次的原因都不明白。如果說最近很火的二月河說大學生不看《紅樓夢》是恥辱尚有爭議性,那麼設計師無法理解前人藝術成就是絕對的悲哀,無法去辯駁的事實。
了解美術史,學會入門的美術鑒賞,目的是以正視聽。學會用多個緯度去思考美學,學會用更深入的方法來看待問題,學會從更宏觀的視角審視行業……這樣,你才能更客觀的去理解UI的發展歷程。這些知識和思想,將為你的職業生涯做出啟蒙,才更容易成為一個有內涵有深度的設計師,這當中還有諸多優點,就得靠你們自己慢慢體會。
下面推薦書目:
《藝術的故事》([英]貢布里希)(重點)
《西方美術簡史》((美)亨德里克?威廉?房龍)
近代設計史 (一下搜不到這書的地址,回頭我拍張照片)
《設計心理學3:情感設計》 (有1.2.3,都得看)
以上是我目前看過能想到的最基礎書目,如果有朋友覺得還有合適的請給我留言補充上來。
哲學有三大哲學問題,「你是誰?」「你從哪裡來?」「你要到哪裡去?」,構成了哲人在探索人世真理時的基礎框架。我們也一樣,要在階段給自己提出三個問題,並花至少一個月的時間尋找答案:
設計是什麼?設計是如何產生的?設計可以做什麼?
第二點:繪畫技巧——洞察
這個點更新了一片回答~~可以參照這個!
學手繪對於UI設計師的意義是什麼? - 酸梅干超人的回答 - 知乎曾經和很多同行爭論過,UI設計,到底需不需要手繪訓練。想必大家都知道,目前國內知名的UI設計師,站酷、http://UI.CN、追波上的大神們,很多都是草根出身,從其它行業空降來的,他們的出色是有目共睹的,似乎從某種層面上證實,不需要有繪畫基礎,也可以做好UI,也可以當大神?
圖樣拿衣服!我們來說說繪畫的問題。
美術高考主要考的三大項:素描、速寫、色彩。就是繪畫入門的三大基礎課題,我們學習的過程也是以這個順序逐步覆蓋的。如果你已經在第一部看完了那些書籍,就會知道,學習基礎繪畫的過程中,我們在紙張上對現實世界的物體進行細緻準確的描繪,也就需要我們更仔細的觀察事物。光照射的角度是如何的,在對應的形狀中表現出什麼明暗分布,在透視原理下杯口厚度的弧形是怎麼變化的。隨著繪畫的深入你就會逐漸培養一雙洞察細節的眼睛,你會對所有設計和形體做出本能的反應,分析它們的美醜,找出核心所在。
我們看看下面這樣的案例:
這是一個很簡潔的小鳥,只用幾個細節就輕鬆的表現出來,但我相信,如果要原圖照抄,有90%以上的UI設計師是畫不出精髓的(不信你們試試)。越是這般簡單的圖形,在弧度、頭身比、重心偏向這類細節上就越關鍵,如果你沒有良好的觀察能力,那麼就連抄也抄不像,你只能做出曲線都歪歪扭扭的貝西貨並自己洋洋得意的四處上傳設計媒體求贊求認可。
前面提到的這批國內的大神,其實就是在遠超常人的勤奮中積累了觀察的經驗,以此可以複製一定的風格,並能發現設計中的細節而不斷做出改正。但這就完了么?當然不是。
你們可以仔細去觀察這些沒有繪畫能力的UI設計師,他們的作品存在著很強的局限性,雖然可以很好完成熟悉領域和流行風格的設計,但是形勢是很單一,並且缺乏真正的創造力。強大的手繪能力,除了提高洞察力以外,就是為你將來創作的多元化提供更多可能,看下面案例:
比如繪製這樣的圖形,私以為沒有手繪技能無異於天方夜譚,而GAME UI的最大門檻就在這裡。你的繪畫技巧會支撐你跨過更多的門檻,在設計的道路上有更多的選擇和可能,也會支撐你走的更遠。
那麼學習繪畫要到什麼程度呢?直到你覺得可以正確繪出靜物為止。推薦去報一些高考培訓的機構,和高三孩紙們一塊兒學畫,你會提升的相當快,這個過程只需要兩三個月的時間。不要覺得可以跳過,將來成為出色設計師的成本將遠低於不學習繪畫的其他人。
還有,最重點要掌握的一個繪畫技能,我覺得是結構素描。
你就可以在紙張上對想繪製的圖形做出快速、準確的打稿,效率和延展性遠勝上機鼠繪。
手繪將貫穿你整個職業生涯,在今後的學習工作中要保持這個習慣,相信我,每到一個合適的時機,它總會給你帶來意想不到的驚喜。
第三點:掌握軟體——手段
這一步就正式開始進入學習軟體的步驟。如果學習的是UI,那麼以下幾種軟體是必不可少的:
PS、AI、DW、Sketch……其餘的根據愛好自己補充
這裡要先和大家談談,我們都知道美工對於設計師來說已經成為具有侮辱性的貶義詞,設計師們喜歡反駁,你丫才是美工,你全家都是美工。有點小理想的有志青年們都對這個稱謂充滿鄙夷,但我得給大多數人潑冷水,因為大多數設計師連一個合格的美工都夠不上。
我們知道美工代表的是一種技師的稱謂,有一定技巧但沒有創造力。可偏偏就是絕大多數人都沒有掌握足夠的技巧,這就是當前設計行業所需要面對的事實。很多設計師沒有經過前兩個步驟的熏陶的,所以在學習軟體的過程中很容易自滿,明明對軟體的掌握還很膚淺就已經恬不知恥的在簡歷中輸入」精通「二次(哎呀,好像在說我自己!)。他們的視角是狹隘的,只認為學會了PS這些工具,就學會了設計,也忽略了自己遠遠沒有達到美工門檻的界限。下面我來談談怎麼學習這些軟體。
首先看李濤視頻的前三課:李濤PS教程(全集)
只看前三課!重複強調一遍,先只看前三課,並且做好筆記把所有內容都背到滾瓜爛熟為止(我看了至少五遍以上)。這是整個UI設計行業里最基礎的知識點,光、色、解析度、色彩模式,連這些都沒有掌握你就不要想精通設計軟體和掌握它們的原理。
然後你就開始去看別的視頻教程,這時候可以去淘寶買:PS教程
幾塊錢就有一打的高清入門視頻,不要浪費時間在搜索免費的低質量視頻上。入門教程基本都是相同的,你要完整的看完和跟著學習幾個新手教程,直至對軟體使用有了初步的理解,然後再返回去看李濤的視頻剩下的內容。
那軟體要學到什麼程度?學到你可以用它臨摹出任何使用這種軟體設計的圖形。一定要記住,設計軟體只是我們用來實現設計的一種手段,過渡沉迷在軟體的研究中是本末倒置的,但如果你使用軟體連抄都抄不出來,那就是一種不需要反駁的恥辱。例如下圖:
這樣的作品,你有了足夠的觀察力,靠對軟體的掌握度就可以輕鬆臨摹,但很多已經從業數年時間的設計師連這種臨摹都做不到,原因在哪裡你們自己好好想想。軟體的掌握是為你實現更多設計方案提供可能性,不要讓軟體熟悉度這件最簡單容易的技能變成自己的短板,至少我們要成為一個合格的美工!經常自己做一些練習來測試自己對軟體掌握度在哪裡,就很容易發現問題,然後自己去查資料做研究。下面就是一個我很久以前做的軟體練習(要點開大圖,大神輕拍= =!):
好好去理解每個軟體可以實現什麼,優勢是什麼,極限在哪裡。然後你就再!也!不!會!跑去大神評論區里問:好牛逼,請問這是PS做的嗎?請和我默念這是本世紀設計界里最愚蠢的評論,不要讓它們發生在自己身上。
再嘮叨一次,軟體只是一種手段,你還並不懂設計,少吹牛逼!
第四點:設計理論——實踐
廣義上來說,到這步才是真正開始學習設計,也是讓一、二兩點作用開始充分發揮的時候。
因為看過藝術史,所以你會知道,每個時代流行的藝術創作有各自的手法特點,有共性,所以可以被歸納和總結,也就可以教授,培養出相同的作家。換句話說,美術家是可以被量產的。在理論不斷被完善的今天,要做出好的設計一樣是可以通過理論學習——實踐產生,一定不要認為這是天賦上的差距,別人比自己就更有藝術細胞。那些能被歷史銘記的藝術大師,之所以偉大,是因為他們的開創性或者作品所包含的人文精神和偉大的靈魂,而不只是一幅出色的圖畫。
前面的幾點都為你提供了足夠的實踐基礎,所以在這部才能讓你正確看待自己的潛力,不會輕易停下追求進步的腳步。只有最偉大的設計師才需要較量天賦,而成為一個優秀的設計師靠的是努力。設計是勤行,不是設計人,不入設計門。
那麼理論知識我們該學習什麼呢?首先是基礎中的基礎:三大構成(基礎含義)
每個方向都需要閱讀相應的教材,重要性無以復加,你需要在觀看的時候一邊做練習。然後才是具體設計類的書籍,記得不要再買那些無用的通篇告訴你軟體操作的書籍。
還有個差點被我忽略,本來想單當一個步驟說得,後來想想還是歸納到這裡來,那就是對於字體的認識。UI設計師普遍對字體缺乏敬畏,尤其在扁平化盛行的今天,字體的作用更加突出。只有掌握了字體的奧義,才能設計出有力的排版,才能對可讀性和觀賞性文字元號有充分的了解。比如日本二十四節氣網站就是運用字體的優秀案例:日本二十四節氣網站(原網站好像打不開了,只有圖)。推薦書目:
《商業字體設計》(方茜)(一定要看!!)
《好字體》(向玫玫) 《文字設計的原理》([日]伊達千代,內藤孝彥)
接著就是關乎排版,柵格化_百度百科、傳統網頁布局柵格化設計分析,這也是UI設計師必須掌握的基礎技巧之一。對柵格化有充分理解,就可以設計出足夠安全而和諧的頁面,下面書目:
柵格排版法(找不到了,我回去翻翻)
《版面設計的原理》([日]伊達千代,內藤孝彥) 《超越平凡的平面設計 版式設計原理與應用》([美]麥克韋德(John McWade))
還有一些相關的基礎推薦書籍,太困,記不起來,希望知友推薦:
《形式感+:網頁視覺設計創意拓展與快速表現》(晉小彥)(重點推薦)
《在你身邊,為你設計:騰訊的用戶體驗設計之道》
設計的理論書籍教會你怎麼設計,你需要在不斷接受知識的同時,馬上對它們做實驗,不停的練習,不停的產生問題並解決。在你的設計觀念足夠成熟前,絕對不要沒事上網看設計的XX法則,如何做好網頁設計你需要掌握的XX個技巧,完全就是設計界的雞湯文,它們看著其實挺有道理,但完全沒辦法給新人提供實踐指南,是用來遺忘的,即使看再多這類雞湯文,你也做不好設計。舉個本題內的例子:
這樣的回答實際上可有給你提供詳細的幫助?沒有(無意冒犯)!你的學習過程在每個方面都要系統而有調理,書籍比零碎的閱讀可以給你帶來更多的幫助和進步。
第五點:邏輯取捨——平衡
在我這個回答:視覺設計師是怎樣讓前端工程師 100% 實現設計效果的? - 酸梅干超人的回答
已經說很詳細了,作為UI設計師,是必須掌握前端的對應技能的,這不是可以完全無限制的發揮設計技藝的地方,你就要有取捨,要跟的上前端開發的邏輯,做出穩定可以被實現的設計稿。
學會HTML5 CSS3 JQ的入門,安卓、IOS的實現規範!
第六點:鑒賞模仿——超越
特地把這點放到後面,也是有理由的,前面的步奏都是一個設計師基礎素養的實現,而一個出色設計師還需要培養自己的套路和風格——站在巨人的肩膀上。
你要學會如何辨別優秀的作品,可以從多個渠道收集優秀作品和案例,首推使用:
Behance 花瓣網 (又到了求粉的季節,懶惰的可以只看我的花瓣 死翹翹的超人的花瓣個人主頁)
www.pinterest.com SDC設計師網址導航 (其它的可以在導航里逛)
學會看優秀的案例,用它們給你提供設計的燃料,然後你要做的就是抄!抄!抄!用你學過的設計理論在實現中對案例進行分析,只有發現了它們的優點並自己動手實踐實現了,才對你的提升有實際幫助。你每天抄一個案例,BANNER、ICON、APP界面,那麼不出幾個月,你就能對現有的設計形式套路了如指掌,可以設計出安全不會有太大毛病的UI設計稿,你可以輕鬆完成這樣的:
而不會做出這樣的:
同時,必須提醒一點就是,我們在設計過程中對美的追求和實際實現、用戶需要很多時候是不一致的,這是一個坑,需要有足夠的經驗去判斷什麼樣的設計已經足夠了,什麼樣的是過度設計,沒有實際意義。你不止要在網上搜索優秀的案例,一定要持續關注這些那些最簡單,但是最受歡迎的網站和應用。例如:知乎、INS、微信、淘寶等等。去不斷討論、查閱,來理解為什麼是當前的呈現式樣,而不如自己的預期。比如我寫的另一個回答的思考方式:
為什麼國內電商APP設計五花八門,界面那麼繁雜? - 酸梅干超人的回答
你要在練習和思考中進步,不要盲目的追求視覺表現,這樣的UI設計師是很難真正的成長起來。
設計的終極目的是解決問題,而不是盲目的表現自己對美的追求。所以我要新手不要去看那些只上傳飛機稿的網站:http://UI.CN、追波等等。
當前主流設計平台的趨勢就是,少數大神驅動龐大的底端設計群體,如果你已經在前幾個步奏得到提升,那麼這些網站的多數設計師已經在思想上沒法和你並駕齊驅,不要去這些地方混跡。這些網站不會有真正有價值對等的交流和見解,只有設計師在自己圈子裡找自信刷存在感的證明,你去掃兩眼評論,就知道不會有「落霞與孤鶩齊飛,秋水共長天一色」這種回答,只有「哎呀,我草,牛逼」,「請問這是用數位板畫的嗎?」,「請問這是AI做的嗎?」。這些大神的飛機稿和普通練習的迅速流傳,很可能會產生諸多的不良印象。
就拿我深深唾棄的追波來說,大量的作品沒有任何實踐價值,尤其為了吸引同行關注而過分秀技巧,秀動效。於是動效的風氣馬上在國內圈子瀰漫開,明明是連基礎排版、配色都做不好,PS都還沒捂熱,就追著趕著學習AE,開始玩轉交高大上交互特效了。具體請看下文:
[ISUX轉譯]設計追波風
當你抄了兩三個月案例,就已經有足夠多的作品集了,你已經可以打包做簡歷去應聘了。屆時你的水準將超越絕大多有數年經驗的設計師了!
第七點:閱讀思考——擴展
整個UI設計圈,還有一個很致命的缺點,就是對其它行業知識的排斥,科班畢業生尤甚。因為學生時代大多討厭學習,有藝術生這個庇護傘,就可以合理安慰自己不學習不念書那是放蕩不羈愛自由。屎丟皮啊!!
藝術史還要教會你們的一點就是,真正的大師絕對不會只是孤陋寡聞而只專註在手中的筆桿和油墨,他們不斷在認識世界,不斷在研究感興趣的知識和見解,這也就是知乎存在所要滿足的需求。不要做一個只知有設計,不知有數理化的蟾蜍,只能在你自己的井裡蹦躂。
成熟的設計不只是你個性技巧的表達,還有你對解決問題所展示出來的理性和洞見。很多設計師和同層次的其它專業人員比較起來顯得太幼稚和粗淺,癥狀也在這裡。不要只用設計的角度去看世界,去涉獵更多的專業,讓眼界更寬廣,有更多的角度去理解世界,得到的感悟將給你帶來難以估量的升華和進步。
這是可以持續一生的事業和技藝,在正確的方法下,越積累越成熟,老而彌堅。請不要再用膚淺的思想認為它是吃青飯的過度階段!
……………………
===================================================
設計是一門需要沉澱的技藝,卻恰巧遇見了日新月異的互聯網文化。這讓大家對流行極具敏感度,而開始追趕潮流,輕視正統和法則。這整個流程需要或許需要1整年的時間,但我相信,只要有足夠的耐心,是可以讓一個新手成長成為一名合格的UI設計師,請放慢你的角度不要急於求成。
更新下QQ群:5537969,有時間會在這裡講解下設計過程~~
在知乎上也碼了不少字,結合以前的回答,說說我的建議罷。
大的要點其實就這麼兩點:
1. 系統的學習與積累
2. 不斷地思考與動手
一、認識 UI 到底是什麼
很多朋友可能認為 UI 就是畫畫圖標之類的視覺工作,其實不是的。它更重要的是清晰地呈現內容,展示功能,讓人高效地工作。
一句話概述的話就是:UI 是架接機器與人溝通的橋樑。
UI 的中文名是用戶界面(User interface),而我們現在使用的大多數設備界面都是圖形用戶界面,即 GUI(Graphical user interface)。我們通過這些可視化的圖形界面來理解計算機,進行工作。
但是最初的界面可不這麼友好,那時的界面還是命令行界面,CLI(Command line interface)。計算機只是被政府或大型機構使用,在普通人眼中是完全不能理解的存在。
(命令行界面,Bourne shell interaction on Version 7 Unix)
而喬布斯一直渴望計算機能進入尋常百姓家。在 1979 年,他「命運般」地參觀了施樂公司,然後做了一回搬運工……使得圖形界面被應用在 Macintosh 上,還引入了滑鼠。蘋果電腦大肆宣傳其創新的交互界面,Macintosh 的誕生開啟了一個新的時代。而那時的界面設計也奠定了現在的計算機界面。你可以發現很多設計,過了幾十年依舊被保留了下來。
(1984 年面世的 Mac OS System 1.0)
因此 UI 設計師的首要任務是設計一個個圖形界面,為的是讓人們能夠清晰、高效地使用軟體。
二、優秀的 UI 設計師要掌握些什麼
我非常鼓勵大家學習多方面的知識,而不是視覺就只盯著視覺,交互就只盯著交互。可以在跨學科的學習中慢慢樹立自己的專業方向,然後目標成為「T 型」設計師,擁有知識面的廣度和專業知識的深度。
我前段時間梳理了一個「UI 設計知識庫」:
(以上內容來自我的專欄:認識 UI 設計師 - UIcircle 。紅字是我認為 UI 設計師第一階段必須要具備的知識和能力。)
三、這麼多東西該怎麼學
其實我已經通過上圖將知識點很好的歸類了,你可以將上圖更細分,一個個攻破。
我在這也不能具體地說該怎麼學畫畫、怎麼學平面,知乎上已經有很多優秀的回答,希望真正好學的人可以自己整理,然後制定適合自己的學習計劃。
以前還有談過這個問題也可以應用:怎樣一次性地將事情做好,從而避免返工和重複? - Hindy 的回答
一、從整體出發,確切理解自己要做的事。
二、理清事情的思路,知道自己如何去做,保證每時每刻都知道自己在做什麼。
三、落實到每個細節。
四、邊學邊不斷地積累
這部分我可以通過分享三個回答來說明。
第一個是我對於「設計師如何積累素材庫」的回答:
http://www.zhihu.com/question/34871414/answer/61038912
摘錄大步驟如下:
第一步、選擇優秀的網站
第二步、整理收藏夾
第三步、如何在工作中應用這些收藏素材
(想看詳細請點原回答鏈接)
第二個是 Junjun Shi 對於「設計師如何記筆記」的回答:
http://www.zhihu.com/question/33540753/answer/57366832
摘錄大綱如下:
1. 為什麼記筆記?
2. 筆記對設計師或設計學生意味著什麼?
關鍵字:思路,積累,總結。
3. 怎樣記筆記?
這裡我用具體實例來分析。
(想看詳細請點原回答鏈接)
第三個是我「分享的設計書單」:
http://www.zhihu.com/question/31065632/answer/51279339
(請點原回答鏈接查看。有好的書,也歡迎大家推薦給我)
關於我自己的故事分享請看這:自學設計是怎樣的一種體驗? - Hindy 的回答
UI,現在真的是很火啊,很多人都認為UI設計可以拿高薪,便擠破腦袋的想要入門。
我個人認為,首先你需要考慮好為什麼學習UI,僅僅因為錢的話,還是再想想吧。畢竟對自己的工作是否有興趣,這個事情很重要,它關乎你的效率、熱情和成就。我真心希望你是考慮好了,覺得喜歡才學習UI的。至少我自己是因為真的喜歡,真的熱愛,做起來也十分開心。
我呢,不是什麼大神,但是都經歷了從對於UI一無所知,它之前相對於我只是一個名詞,而現在也成為了一名UI設計師。可能對於如何自學UI,大神的答案會比我更專業,但是我可能更知道對於一點沒有基礎的小白,你們要的是什麼。我說的是你幾個月要有的計劃,以及要做出的作品。我本人在從事UI之前,考慮了很久,也搜索了很多資料,你們所思考的所迷茫的我都懂。
如果你們問我,要入門UI要不要報班,我覺得這個因人而異。我自己曾經嘗試過自學,看了很多大神的建議,他們說的我都看懂了,但是當時還不知如何下手,後來就咬牙報了培訓班(嗚嗚,是不是很沒有骨氣啊)。但是現在,我想說的是,如果你意志力夠強,按照我下面寫的東西一步步做,不用報班,也可以入門UI(我相信按我說的做這些東西,真的不用再報班)。我不能保證你拿多少的工資,但是你肯定能有自己的作品集,並且可以拿著這個去面試。至少你能真正的入門。(因為我是培訓班畢業的,所以我知道都需要做什麼,每一步都怎樣做)。
先來點高大上的,整點事
1什麼是UI(其實直接百度就可以)
UI,即用戶界面(User Interface)是系統和用戶之間進行交互和信息交換的媒介。它實現信息的內部形式與人類可以接受形式之間的轉換。
簡而言之,UI設計師就是設計用戶界面。一般我們手機上app的界面都是UI設計師需要設計的。
通俗易懂點說,UI就是做界面的,最重要的部分是app界面,看到手機里各種app沒?大部分展現在你面前的東西,都是UI設計師需要做的。
2UI設計師需要會哪些軟體
如果你做好了從事UI行業的準備,那我們首先需要了解設計師手中的鋤頭,沒有鋤頭怎麼種地呢?嫻熟的技法,是完美展現設計作品的必備作品。
PS,這個不用說,最常用也是普及最廣的軟體。其他的軟體不會,這幾也需要你掌握,這個事入門UI的必要工具。
AI,有些設計師習慣用它,稍微了解對面試有幫助,也有一些效果的實現上AI比PS要快。
AE,圖形視頻處理軟體,一般適用於一些動畫和特效。
Sketch,現在很火的一款軟體,有一些公司要求作圖用這個軟體。軟體都是相通的,如果很好的掌握PS,上手這個也是很快的。
Axure,做原型圖用的,一般產品經理常用。
我們當時主要學的是ps,我覺得其他都可以不會,這個你必須會。
3What should I do?
重點來了,說了那麼多廢話,到底怎麼做才是王道!
1)需要自己在網上找一些PS視頻,自學一下PS.網上免費的課程還是挺多的,推薦李濤的視頻,深入淺出,旁徵博引。
我自己總結的呢,我們自學ps呢要有側重點,UI和傳統意義的定義不太一樣,我覺得美工主要是修圖摳圖,而UI設計師主要做的是畫圖。你需要重點掌握的ps工具是選擇工具,選框工具,移動工具,可以畫出各種圖形的形狀工具。這幾個工具用的比較多。
2)如果你ps掌握的差不多了,就開始畫圖吧,親。
先臨摹一些線性小圖標。去花瓣上,搜索一下線性圖標,你可能第一眼看,發現很簡單,但是千萬不要眼高手低,一定要自己畫,因為真正的手機上的圖標,不是你看著差不多就行的,一定要準確,不要有虛像素。最初,你可以把圖放下面,直接在上面作圖,盡量要做到一致。真的沒有看著那麼簡單。這些都是基本功。一定要紮實了。
這就是線性圖標。
3)其次要臨摹一些寫實圖標,雖然現在以扁平化為主流,但是寫實圖標也可以鍛煉自己的功底。
我做這些大概用了2周。一周線性圖標,一周寫實圖標。然後第三周,老師就開始讓我們自己寫實物體了,我當時畫了一輛車。你們猜猜哪個是我畫的哪個是原圖?
其實我想畫變形金剛的,但是老師說大概3000個圖層,我想想臣妾可能做不到就放棄了。但是當時想想自己真的很厲害哈,零基礎2周自己就畫來一輛車!所以這些圖標一定要畫!
4)做完這些就可以嘗試臨摹一些界面了,這也是最重要的部分
這是我在花瓣上隨便找的,這展示的就是界面。
先推薦一些比較好的app,國內有哪些非常有設計感的 App?
然後搜索一下各個系統的規範,尺寸規範-圖翼網(TUYIYI.COM) - 優秀UI設計師互動平台
多下載一些app,然後多思考,它們的優點和缺點,UI作為一個設計職業需要的是很好的審美能力,軟體可以學,規範網上更多的是,設計意識是一種需要長期積累培養的能力,甚至需要天賦、需要很好的審美工地和藝術表現技術。
UI並不止審美,還需要配合產品,交互,程序,以團隊成員的身份完成商業目標。所以,一定要多思考,提高了自己的審美才是最重要的事。
然後臨摹一些好的界面,並且思考其中的邏輯關係。
臨摹後就是自己設計了。參考規範,再找一些自己喜歡的界面設計幾套界面。注意,每套最好做個10張左右,每一套做之前你要考慮它的交互關係,最好自己做出思維導圖,因為界面不僅僅有美觀,交互才是最重要的。有一定的邏輯關係,然後再開始設計。
設計之後,找朋友什麼的,或者放到網上讓網友們都看看,讓大神們指導指導,讓自己不斷的進步。再適當的包裝下。做出自己的作品集。作圖過程中一定要多思考,多總結,多對比。大概做個5套左右就可以了。做出5套後,再去設計網站上看看他們都是怎麼包裝的,俗話說人靠衣裝嘛。我就有個同學界面做的不太好,只是很會包裝,最後找了個8000的工作。
5)做完界面,其實大頭就做完了,接下來就需要做一些網頁。其實如果界面成功搞定,網頁的設計就難不倒大家了。
網頁也需要參考規範,先臨摹,再自己做幾張。
6)除了這些,大家還可以做一些錦上添花的作品,比如設計個表情,幾張banner等,可以根據你的喜歡自己做一些,這些都非常有意思的。
將自己的作品發表到網上,形成自己的作品集,你就可以去面試了~~~~~
4規範及設計原則
關於iOS和安卓的規範,網上有很多,規範都只是參考。iOS和Android有自己的設計規則和偏好。一般,每款機型的狀態欄高度、導航欄高度、標籤欄高度、圖標尺寸/字體/字型大小/顏色都有嚴格的規定。原則上一般要求一致性,準確性,布局合理化等。
5網站以及書推薦
網站:Dribbble,Behance,站酷,花瓣,UI中國好多
書:《設計之下》—搜狐新聞客戶端的用戶體驗設計。共三部分,全面講解了用戶體驗設計的流程和方法。第一部分為「交互設計」,闡述了從項目啟動、解析需求到原型設計的過程,並且總結了交互設計的要點:大局觀、操作流程簡捷、形式新穎且統一、各種特殊情況等。第二部分為「視覺設計」,闡述了界面、顏色、圖標、質感、動畫、切圖等具體方法,以及如何與開發/測試工程師們合作、尋找平衡設計與技術的方法。第三部分為「他們眼中的優秀設計師」,通過產品經理、程序員、運營、市場經理的視角,闡述了如何成為一名優秀的設計師。
《在你身邊,為你設計》—騰訊的用戶體驗設計之道。本書內容包括:設計理念、設計方法、用戶研究、體驗設計、設計流程和工具,以及團隊成長與管理等方面的知識與經驗分享。
《觸動人心》本書是《Tapworthy: Designing Great iPhone Apps》的中文翻譯版,本書告訴你如何從iPhone的角度來思考應用設計。本書能幫助你理解如何設計iPhone應用,要創建一款觸動人心的應用,需要如何去綜合思考設計、心理、文化、人體工程和可用性問題。在書中,你會看到大量的真實應用的設計實例和思考過程。除大量實例外,本書用通俗易懂的語言,對整個iPhone應用設計方法也做了系統的闡述。
這些幾乎涵蓋了我幾個月的學習成果,我現在在一家還不錯的設計公司工作,工資10k,小小設計師一枚,哈哈。但是我真的非常開心,因為我真的是喜歡設計才學習的,所以在學習的過程我也很努力,悟性也比較高。但是業餘時間也會堅持臨摹,有時間就刷設計網站。也請大神多多指點。也希望大家多多交流,多討論設計的問題,共同進步~~
大學是計算機專業,純寫代碼專業。大二做了計算機愛好者協會會長,周末有一些活動,叫PS課,是我的幾個能力很強會PS的小幹事講的,我每次站在後面,看到做出來的效果都好炫酷。後來我們舉辦了PS設計大賽,作品都是P照片,大賽辦完,我還是不會PS 。
天真的我以為自己做過學生幹部,做過會長,出來工作我好歹也能找個小領導的工作做做。大三大四備研(管理學專業)的我,讓我離代碼的世界漸行漸遠。所以考研失敗後畢業來到深圳,投了各種工作的簡歷,找不到工作,我覺得生活徹底的把我拋棄了。
最後拉下我的老臉去了一家淘寶店做客服,我一個大學本科,我的老臉啊(哭T-T)那段時間,我一直思考一個問題,我要選擇什麼工作崗位才是不會被輕易替代的。
進到淘寶店開始做客服,我就開始學PS(客服都要會),學了一個多星期,摳圖,鋼筆什麼的我都會了。(其實只會最初級的操作,我記得我當時摳圖是用削皮擦擦掉的,特別喜歡用修補工具去修圖,反正就一點一點弄)
在這家淘寶店工作期間,我發現我們幾個客服老是被老闆罵,這也不對那也不對,反正都是不對。只有一個人老闆不罵她,就是美工。我當時覺得醍醐灌頂,這就是我一直在思考的不可替代的工作啊,至少是老闆重視的啊。
可是靜下心來,我專業計算機,如果去換做美工,大學四年真是白學了。思來想去最後覺得還是選擇設計和代碼相結合的網頁設計比較穩妥,既不用丟掉代碼能力也可以做到設計。
可是父母不給我錢去學,那會身份證也丟了,一個大深圳,沒有身份證,可能當時太年輕太無知,覺得沒有身份證就沒辦法找工作了。最後找了一份服務員2200的工作,和公司商量,我只上夜班,然後到外面學校去學網頁設計,4500的學費最後和學校商量分期付款,每個月1000,當時是有多窮可想而知。學習那段時間都是早上九點到下午四點,然後回宿舍繼續睡,晚上六點上班,上班到凌晨兩點。學了Photoshop,Flash,Fireworks,Dreamweaver。堅持了半年。結課。
去了同學待得公司,做一部分設計,也寫一部分後台前端代碼,還做些seo方面的工作,公司要開分公司,我給他們做了官網,自己設計,自己寫代碼,包括最後的SEO也是我在做。在這家公司的這段時間,用的設計仍然還是停留在對於軟體很熟悉的階段,至於創作自己如何用圖形做矢量運算之類的設計是真的不會,做了一些banner 圖,停留在比較初級的階段,但當時覺得炫酷翻了。
安逸久了,便會尋找初心。感覺自己偏離了純設計的路,純設計被我耽擱的久了,都不會做圖了。思前想後,最後決定繼續攢錢深造設計。當時在原畫,產品,UI(我是這個時候一次接觸到的UI和產品,發現公司原來還有這種職位)三個方向猶豫不決。原畫去考察了好幾個學校,學費太貴,對於非藝術專業進階太難了,放棄。產品和UI想了很久,還是覺得UI技術在手天下我有,而且和我的網頁設計契合也非常高。產品我也心動,最後還是覺得沒有牢靠的技術,全憑思維能力進階,厲害的人太多了,遂放棄。
考察了幾家學校,最後選了北京的兩家做最後的決定。在去學校之前也一直在自學AI(在那幾年的印象里AI就是做印刷用的,那會app還沒火起來,支付寶都沒有流行起來,我知道支付寶還是充話費便宜轉賬不用手續費還信用卡n快才用的支付寶,決定學AI還是CDR探究了很久,最後學了AI現在看來是對的)。離開之前還帶了設計的徒弟,又自學了一遍設計工具的那些條條框框。
去到北京那幾個月,高強度的訓練,互聯網的專業流程,之前不會做的,不敢想的,老師都教了。直到現在那會老師教的知識包括流程之類的也還在用。真的感謝那段時間設計能力的大幅度提升。學了新的軟體AE,AXURE ,Mind manager 。AI簡單的過了下,攤手。
接著又結課了,做智能手錶,在阿里。那會一直用AI做原型圖,AI就是那會憋過來的。那會sketch雖然出來了,但是大家仍然在用PS做圖,規範會用keynote來做。手錶做了一年。期間報了原話班,想學完那個我畢業之後最想學的心愿。
那會感覺自己做了一個大項目感覺自己滿了,什麼都學不進去了。在國外待了一年多的樣子了,偶然進朋友的站酷,我當時,內心是崩潰的。我們在北京一起深造設計。那會她好多都還不懂,現在做的圖比我的還好看還炫酷。我知道,我不思進取了。
我的內心波動著,我的初心還是設計,純設計。哪怕是做一些邊邊角角關於設計的我也煩透了。而那會正好設計改版的網頁。做了幾版,顏色沒有差錯,但是我就是覺得差點什麼,感覺有些單調,用色不夠大膽。可是不敢多用色成為了我的軟肋似得,怎麼做都是通篇一色或兩色。
等到我再次進到朋友的站酷,看到她更新了幾張手繪圖。我的內心,終於躁動的不行了。決定辭職回國繼續完成中止了的原畫課程。一學就是十個月。中間痛苦彷徨不知道學完能否有效果。我就這樣,煎熬了十個月。
學完繼續出國工作,一直到現在。一直在用sketch,目前AI已經用的很熟練了,在用AI畫一些插畫。這是我以前相都不敢想的事情。用色也大膽起來了。也開始學新的設計風格。也終於不用為設計不出來好東西發愁了。也終於有時間繼續寫我的自學設計的公眾號。目前還想學的是C4D和Principle,AE高級動效,AI插畫表情包,字體設計,logo設計。你看我還有好多需要學習進階的。
只要喜歡,不管是不是零基礎總有學不完的
————————暫時先寫到這裡,後面我會更零基礎需要如何自學的方法!————————
9-23晚
不好意思,拖了很久,繼續更~
看了上面很多答案,都寫了一些,還寫了很多入門方法之類的,比較多也比較雜。
我簡單的歸納一下我作為一個過來人認為的好的方法,畢竟我也走過很多曲折的路。
1、在學習 UI 設計之前,需要有一個系統的認知,然後再去學習設計方面的內容、規則,慢慢把知識庫填充完整,並了解互聯網一個完整項目的工作流程。
首先:需要了解什麼是UI設計
我發現很多人都不了解什麼是UI設計師,覺得做設計用PS的都叫UI設計師。很多學UI的同學都學了很久UI了還不了解UI設計是主要做什麼。
UI設計是解決並設計人機交互界面的設計師,機器界面包括很多,無線端(手機,手錶,pad,手環等),PC端,智能電視,車載錶盤,VR,AR,甚至KTV的點歌台等。很多設計師都覺得UI設計師是做APP的,也有HR或者老闆認為UI是做設計相關的比如平面,視覺方面的都屬於UI來做。其實都是錯誤的認識。
在整個項目流程中,UI設計起到一個重要的環節,UI不是一個簡單的畫圖仔,UI是一門系統的學科和涉及到多方位的綜合體設計師。
上面這些知識在你進入UI設計這一行開始之前你都需要做一個系統的了解和認知,至少做到心裡有數。每一個都是龐雜的知識體,綜合起來就是UI。
其次:了解UI設計的工作內容和要掌握的「端」的規範
1 . 工作內容比較多,放一張圖來解釋全部
圈2是一整個工作流程中需要做的一些工作,圈3是產品上線後會繼續做的一些事情。初學者應該了解到出設計稿只是我們工作中的一部分內容。
2. 各個「端」的規範。手機端分蘋果和安卓,pad端,手錶端,這三個統稱無線端。重點是蘋果和安卓的設計稿適配,目前主流都是設計蘋果750*1334px尺寸適配到安卓720*1280px尺寸。(好處是只用出一套圖)目前出來了iphone X,適配方面同樣是高度增加,留出安全寬度,沒有特別的地方,知識類似loading頁活動頁需要單獨調整高寬。PC端因為瀏覽器的不同,有一個安全寬度,這個需要特別注意。目前主流的端就是這兩個。設計規範網上一搜一大堆,我就不貼鏈接了。
最後:了解UI設計的工作流程
1.用戶研究(人群定位,期望)
2.需求分析(競品分析,產品痛點,功能分析)
3.交互原型(輸出原型圖,完善交互稿)
4.配色方案選定,定產品風格
5.輸出設計稿,根據項目周期來裁定設計稿的輸出,如果是敏捷開發,會根據模塊切割來輸出,這對設計師要求更高一點,如果周期不急,會出完一整套出來。
6.一部分圖或者一套圖出來會大家一起過一下,直到修改出圖滿意為止。
7.設計規範制定,為了前端哥哥不亂寫樣式。
8.切圖,分別按照蘋果和安卓的切不同的圖。蘋果現在一般都是二倍三倍圖,安卓會直接用到蘋果的二倍圖,一些按鈕會切.9格式的圖。
9.查看前端哥哥的樣式還原度,有沒有按照你的設計稿來。
大部分的項目大多都是這樣,有一些公司只會讓UI做4,5,6這幾部分。攤手。
了解了上述的UI設計師大概的情況,你再做出是否要進入UI行業才是明智的選擇。
2、一個合格的 UI 設計師,除了技法是完美展現產品價值的必備條件外,設計師需熟練掌握 ps、sketch等常用軟體。
需要掌握的軟體:
PS:目前面向win系統主流軟體,做出炫酷效果的必學軟體。優點:能做出各種效果,缺點:點陣圖,不利於做二倍三倍圖的縮放適配。
SKETCH:面向mac系統主流軟體,主要針對做app快捷高效的必學軟體。優點:矢量,輕量級UI設計專屬功能,快捷高效,方便扁平化設計。缺點:只能做扁平化效果。畫插畫不方便(鋼筆工具好傻)。
AI:矢量軟體,畫插畫,字體設計,icon設計。(在阿里我們用AI畫的所有的原型和交互)
AE:做動效,比如loading。現在許多大廠都比較看重app裡面的小動效。
AXURE:做原型圖,雖然市面有許多替代軟體,但是這款是必學的。(你不能保證每個公司都接受你的小眾原型產品)
C4D:適合出效果的活動圖,banner效果裡面。能讓你從眾多設計師中脫穎而出。
Principle:交互demo效果展示,比較實用。
An(flash):能做出一些交互效果,個人覺得使用場景比較少,會一點點就可以了。
我覺得熟練使用前面四個,基本上工作上面就沒有軟體關這一說了。然後再加上一些設計技法,設計技巧,工作上基本上就沒什麼問題了。
設計技法,技巧:比如毛玻璃效果,雙色調,mbe,波點等。
3、UI 設計師需要有一定的畫圖基礎,可以通過臨摹來不斷提高自己的畫圖水平。作為設計,我們需要參與腦暴,當腦暴後產品需求和原型出來需要有一定的設計思路和理解能力,這樣才能來定出比較好的風格,元素,顏色等,so,一個UI設計師做出好的作品需要前期好的準備。
首先 UI需不需要手繪
很多轉行的設計都有個疑問,是否需要會手繪會素描。這個其實不是必須的。但是這些有助於你理解設計的美和設計規律,而且能提升你對設計的感知能力。所以如果有條件,可以抽一定時間加以學習,素描,手繪板,水彩,油畫都可以,相對於零基礎的來說,美術方面不需要美術基礎的素描最合適了。對於初學者,這些就夠了。
其次 初學者階段的環環相扣
有了系統的認知+熟練的軟體操作+設計技法+美術基礎,你再通過一定量的臨摹,就可以做出比較好的作品了。中間缺少一個,可能就會在後期會出現偏差,比如你缺少系統認知,你可能會學到平面的設計或者偏前端的設計。你缺少熟練的軟體操作,你在做設計的時候經常會出現卡殼不會做,影響你的設計效率。缺少設計技法,簡單的毛玻璃你可能都不會做。缺少美術基礎,光影關係你都會找不準。所以說這些環環相扣。也有人講好好臨摹,在臨摹中去學習前面的四點,出來混設計,前面的四點早晚都是要去學的。走都沒學好,就學著跑,將來工作的時候你一定會飛的很幸苦。
大家大可引證身邊的例子,同為一個學習班的人,為什麼大家都是一樣的學,別人卻做的比較好看,而自己卻稍遜一籌,你如果對她之前的經歷多多了解一下,一定是她之前是藝術相關專業,或者從小有繪畫基礎,或者從事相關設計工作,或者對藝術早已耳濡目染等,她一定是在這之前就有美術基礎或者認知等。
PS:對於臨摹的看法,很多人都說多臨摹就能量變到質變,可是有時候事情不是這樣的。在我們日常工作時的確是和點線面長期糾纏,但是我仍然認為它們必定有可遵循的邏輯規則,並且假以時日,就能通過練習而掌握到其中的規律並運用自如。另一方面,我又感覺它們的不可捉摸,有時候花幾天都未必能做出的效果,別人有可能兩分鐘就想到了,前提是他的經驗也未必比我的豐富。這其中的差別,根本無法用量化的辦法來做出說明。所以說帶著思考去臨摹才會讓設計感覺更佳精進,臨摹也不一定是要追求數量的。
最後 要有清晰的設計思路和靈感
好的理解能力能有助於你完成工作任務,前期的頭腦風暴,邏輯分析,功能探討,都比較燒腦。拿到產品需求,原型圖之後,怎麼出圖定風格,定顏色,做方案,都是有分析方法的。設計不是沒有來由的,都是有理論支撐的。無論是運營banner還是h5,app,web,都是有關鍵詞擴散到所有設計的細枝末節,這些都需要你有清晰的設計思路。
等到完成這一步,差不多可以自己設計一些東西了。如果設計思路這一步你無法突破,就仍然會停留在臨摹照搬的層面。怎麼提高自己的設計思路,我會在公眾號水谷的雪上面更新。
所有的都齊全了後,認知正確,軟體熟練,技法嫻熟,審美ok,思路清晰。剩下的就是靈感了。沒有靈感,有時候你需要找到靈感的突破口,借用一些形式,有現實中的借用,有實際項目案例的借用,這些都是一個大的思路方向,細了講就太多東西了。
至此,上面這些你差不多都瞭然於胸,我們便可以開始進階了。剩下我們還需要做幾件事情。
1、需要日積月累的審美,學習,練習,思考,探討,這是UI設計者需具備的審美意識。
入門後,以後的工作都是日復一日,年復一年。我們該如何精進自己的技能。我個人認為,更多的是審美,學習,練習,思考,探討。
審美:這裡的審美是個動詞,你看到好看的比如icon頁面什麼的收集在花瓣里,保證每天的一個審美的標準,看多了,你就知道自己要做到什麼標準。等到哪一天用到這些圖,還是你靈感素材的小倉庫。
學習:剛開始入門的時候學的比較梗概,深入後,你需要進一步打磨每個點的設計。我們可以看下阿里設計專家(花瓣賬號:skys)所關心的設計的各個點(以app為例)是什麼:
作為設計專家,關注了app這麼多細緻的點,每個點都很講究,然後你可以比對自己關注的點,就知道差距在哪裡了。還有哪裡需要學習就不用講了吧。至於怎麼學習,對於突破了初級想進階到中級或者高級的設計師來說都會遇到瓶頸,比如我,做到一個階段會發現我配色的問題,做設計出來混久了差了什麼總是要還的。這就和上面的對應起來了,我缺美術基礎,我再重新去學了畫畫相關的設計。同樣,分析到自己瓶頸的問題,就對症下藥。比如我最近在做很多字體。我在考慮要不要跟著劉兵克老師學學字體設計。這個階段需要對不同的點深入研究做好,也要找相應最好的老師來學。不要進階時候學的半吊子。
練習:我覺得這個需要針對性吧,我會對個人覺得太薄弱的地方做練習,比如我之前覺得我3D做的效果不太好,練習很多圖層樣式,現在看著一張圖可以直接畫了。包括2.5D,練習了一點點不多,最近工作畫了20多個2.5D的icon,心裡想幸好有練習過。
思考:現在好多效果你都會了,頁面也會了,就要深入思考用戶的可用性,用戶數據反饋,藝術效果的結合與分拆等這些。
探討:設計師之間相互探討對於設計來說會更好一點,畢竟閉門造車會在設計的認識方面比較拘泥於自我。拿出來,哪裡不好設計之間會有更加專業的意見提供給你。我之前用keynote做視頻就是設計朋友搗鼓我做的,自己學,自己剪視頻,自己剪背景音樂,做出來後,感覺有設計朋友真好。
2、一個互聯網產品的設計,除了需要了解產品、還需要知道什麼是用戶體驗和交互設計, 這樣才能更有效地推進合作流程,保證一個產品既美觀又有良好的用戶體驗和交互設計。
個人覺得自己在交互和用戶體驗上面鑽研的比較少,但是在阿里做手錶的時候,我們許多的腦暴,過稿,交互用戶體驗都是按照一些做過很多遍的工作。也佔到了我們前期工作的將近一半的樣子。貼上阿里UED的文章,以表達我的內心想法。
0到100:在創業環境中,設計價值沉澱三部曲|平面-UI-網頁|觀點|阿里巴巴_B2B_UED - 原創文章 - 站酷 (ZCOOL)
阿里巴巴(中國站)用戶體驗設計部博客 " 向UXD轉型
這兩篇文章也是我對UI設計師擁有高級技能的一些看法。但是個人還是覺得,設計的重心應該圖好看,圖都做不好的話,奉勸暫時不要每天用戶體驗滿嘴跑。
網址貼的比較少。後面我會更新,每個大體的設計點需要學習比較厲害的設計師的ID。研究厲害設計師的發展和設計,才會變得更厲害哦。
10-1 晚
安利一個我的公眾號:主要講自學UI。
水谷的雪
http://weixin.qq.com/r/gTtvd_nEA7R8ra0U926T (二維碼自動識別)
感覺各位大神該說的都說了,我想先跳出來講一個關於UI設計的誤區。
UI設計是美工么?
根據http://uxdesign.cc今年的趨勢預測,Our Fascination with Pixels is Almost Over(譯:我們痴迷於像素完美的設計時代已經走向尾聲)[From: The State of UX in 2016]指的就是今後的界面,不會再是「被精心設計過的」了。文章中也指出,人們對於固定的UI模式的適應度已經到達了很舒適的程度,不會再有交互方式上的大革新。我個人的理解就是,固定的UI就像是人們使用剪刀一樣,不會有人質疑剪刀的設計本身了,而是考慮如果做更好的更輕更快的剪刀。那麼回歸到做UI設計的問題,我認為好的UI設計師越來越會是對不同交互模式,UI組件甚至是互聯網產品有清楚認識的設計師,而這個設計本身,不同於純粹的藝術創作。感覺在美國,目前的大趨勢也是如此。UI設計師已經不再是從設計專業畢業的只做設計的人,而是有著系統思維的,了解互聯網產品細節的,向上能理解複雜大系統向下能調整小按鈕的設計師。
1. 隨時收集靈感,緊跟設計大潮
http://uxdesign.cc說的Everything will look the same這個觀點,他們不是第一個提出的。相信如果你關注過這些年UI的變遷模式,就會清楚的看到從skeuomorph(擬物化設計)到現在流行的Flat design(扁平化設計),是有一個變遷過程的,而每當一個設計趨勢在產品實踐中被肯定,這個趨勢就會被大量的使用,比如Google的Material Design,雖然本身的採用率並不高,但是卻做火了Card(卡片設計)。想要獲取最新的UI設計風潮,要特別吐血推薦幾個資源:
- Panda - Daily News and Inspiration - 這是一款Chrome上的插件,現在也有了手機app。每天會匯總來自各個不同資源如Dribbble,designer news等得各種設計資源,新UI設計等等。每次你打開一個新的tab,都會看到這些資源,耳濡目染之下,想不知道現在流行什麼都難。
- Muzli Design Inspiration - 和panda非常相似的資源,來源稍有不同而已
- Awwwards - Website Awards - 個人認為是比Dribbble更好的學習UI設計的資源,雖然只有網頁設計,但是有點評有評分,讓你知道一個設計哪裡好哪裡不好
2. 多讀書,讀好書
推薦一個UX的書單,以及下載地址。所有書都是英文版的,中文版網上應該也可以找到
網盤鏈接:http://pan.baidu.com/s/1ntjHoyl 密碼: gkx3
- Design of everyday things - Don Norman (用戶體驗界的鼻祖的大作,必讀)
- About Face - Alan Cooper (有幸見過作者,北美各大產品設計類專業教科書)
- Storytelling for User Experience - Whitney Quesenbery (對我的幫助並不是特別大,可能講故事我比較擅長,但是我的學生都說受益匪淺)
- Designing for Interaction - Dan Saffer (另一本教科書級別的讀物,交互設計入門+經典必讀)
- Sketching User Experience - Bill Buxton (和作者聊過計,很有想法的一本書,很多實用的技巧,也經常被用做教科書)
- Don"t make me think - Steve Krug (和Don Norman的書一樣,已經有些年頭了但依舊是經典中的經典,做用戶體驗做產品的人都應該讀讀。這本和Don Norman的書都有中文版,只是我這裡沒有)
- Universal Principle of Design - William Lidwell (我會推薦學生讀的書,講設計的一些基本原則的,很厚。我認為了解任何原則和標準都是為了知道什麼時候應該打破常規的,這本書對我來說更是一本工具書)
- Designing for Emotions - Aarron Walter (作者是MailChip的用戶體驗總監,算是一家很奇特的公司,遠離矽谷和其他科技中心卻能非常成功。他們的用戶體驗也算是業界標杆。這本書暢想了產品設計的一個很高境界)
- Lean UX -Jeff Gothelf (很火的一本書,我推薦和另一本叫Lean Startup的書一起看。輕量級用戶體驗的實踐方式,現在矽谷很火的創業公司基本都是這個流程。如果感興趣Lean這個流程,也可以看看Scrum相關的書)
- Emotional Design - Don Norman (還是Don Norman的書,深層次剖析了用戶的情感需求以及如何為這些情感需求做設計,屬於稍微高級一點的讀物,我個人非常喜歡)
3. 做幾個Redesign項目
設計的重點是分析問題解決問題,需要 實踐才能有進步,可以去behance上面看看大家是怎麼做的。關於這部分我有空了再上來補充吧。
————————
看來這次我也要從知乎的標準開場白開始了——
謝邀!
其實我在UI設計上還不算有經驗誒,不過在大學期間常年自學各種感興趣的領域包括UI所以在「從零開始自學」上還算有點心得吧。
因為本人大學專業跟CS , 互聯網 以及設計毫無關係,但自己偏偏對這幾部分很感興趣,所以都得自己尋找資源自學了……
這裡也想說第一點就是
1. 隨時隨地保持的學習狀態和學習主動性。
自學的機會很多,生活里,你結識一個朋友、看一場電影、讀一本書、瀏覽一個網站、看一則廣告,隨處都暗藏著學習的機會,不一定能學到具體的技能,但至少可以領略到一些精神和獲得一些專業上的靈感~
2. 掌握一定基礎理論和基本技能
你可以自己找書看,各種設計專業的書籍 可以具體從構圖、排版、色彩、圖形等方面入手了解一些基礎知識。然後學習UI設計常用的軟體,Adobe系列的 Photoshop、Illiustrator算常用的了,如果對web感興趣還可以玩玩Flash,Dreamweaver甚至是html5……
3. 練習,一定要堅持不懈的練習!
設計、編程在我眼裡都是需要動手才能練就出來的本事,只看書滿腦子理論完全不行。
- 設計基本功上,你可以有計劃的練習手繪,提高painting能力我認為對做設計,包括ui設計,是有好處的。
- 從模仿開始,可以先臨摹一些教材上的範例,現有的優秀界面,優秀設計師的作品;在此基礎上,時不時可以加上自己的想法情感,搞點原創。
總之,就是要堅持練習,多動手,一定會從中獲得很多經驗!
4. 我認為可以和3結合使用,多看優秀作品,多向同行學習。還是那句話,即使不能學到具體某項技能,也能獲得行業中的某些精神,培養出自己和行業兼容的調性,培養鑒賞和審美力。
我貢獻下我chrome收藏夾里的一些內容吧。
國內的我知道,站酷(ZCOOL) 還蠻多交流分享機會的,有些線上活動和比賽也可以參加下,當練練手。
國外的,Dribbble - Popular 算最有名的了吧。
除此還有
FFFFOUND!
Color Trends + Palettes :: COLOURlovers
Online Portfolios on Behance
siteInspire - Web Design Inspiration
Mobile UI: How to Redesign the Spendometer iPhone App (Part 1)
Adobe Photoshop Tutorials from Beginner to Advanced
50 Totally Free Lessons in Graphic Design Theory
lovely ui
以上,邊看邊練習吧。
工具性的 Kippt 我覺得可以當作設計師的evernote來用哈
5. 既然是UI設計,還是建議了解甚至是熟悉下各個操作系統的設計規範、風格。並善於體驗每個OS下的優秀App,分析下別人的優秀之處。
6. 做UI設計少不了了解一些用戶體驗,交互設計易用性的知識。UI設計不只是要做得「漂亮」,更要讓用戶在交互使用是覺得愉悅、自然、貼心。
所以可以參考點UX書籍或網站
舉幾個栗子
經典的一本:
Don"t Make Me Think: A Common Sense Approach to Web Usability, 2nd Edition: Steve Krug: 9780321344755: Amazon.com: Books
Getting Real: The smarter, faster, easier way to build a successful web application: Jason Fried, Heinemeier David Hansson, Matthew Linderman: 9780578012810: Amazon.com: Books
UX Magazine | Defining and Informing the Complex Field of User Experience (UX)
Usability Geek
不過,某些理論也不能完全迷信。在具體項目中還是要結合實際情況和用戶特性來分析的。
7. 學習就是一種習慣,養成這種習慣就好了。
比如我大學把手機換成google四兒子的初衷就是用來看各種app在Android原生環境下設計和交互風格的,當然我本來就喜歡google風格。我很喜歡體驗各種軟體,手機上電腦上裝很多軟體,經常都是為了向他們學習。
以上很多點都是方法論,我覺得自學其他領域也合適。
不過我覺得我學得不算好因為某幾條踐行得不夠很是慚愧啊,還需努力啊- -
以下提供可實操的UI設計教程,我將其整理成冊,以後你就不用到處去找了。
個人觀點:十分建議自學UI設計
網上有關UI設計的教程及其豐富,用最少的時間或金錢成本,完全可以得到更多的收穫。如果你需要有人鞭策、哄著你才能投入學習,請直接跳過以下回答。學習這事自己不主動,神也救不了你。
但是題主可能比較迷茫的是,學習UI設計到底該學些什麼?希望以下這些學習資源,可以讓你很好的入門,並達到初級設計師的水準,整理於此供你參考。
以下學習資源,總預算不超過1000元,集中時間2個月就能學完。非常適合預算較少、但想要系統自學UI設計、獲得高質量學習體驗的同學。
〇、學前熱身——掌握設計通識理論
UI設計在某種角度而言,算是平面設計的一個分支,其目的都是為了信息的傳達及交流。在具體的視覺設計執行過程中,其就是處理圖像、文字、色彩、這些視覺元素以及排版構成。
如果你未有系統學習過平面設計,你可過一遍以下的設計通識理論,以此完善你的理論知識體系。
字體排印,存在於我們閱讀的書籍、網站,以及日常生活之中。掌握以下字體排印需要注意的細節,你便能製作出更好的平面設計。
&>&>全文閱讀:平面設計自學入門教程:字體排印篇(1/5)
http://weixin.qq.com/r/lzj85H-EFiJprTuH922F (二維碼自動識別)
初學平面設計,總覺得色彩搭配晦澀難懂。不過值得慶幸的是,早有專家學者歸納出了如下的色彩理論,能夠幫助你更好的認識理解色彩。
&>&>全文閱讀:平面設計自學入門教程:色彩篇(2/5)
http://weixin.qq.com/r/lzj85H-EFiJprTuH922F (二維碼自動識別)
設計沒有好的排版,信息傳達就會受阻,不但影響閱讀效率,甚至導致頁面凌亂不堪。通過學習本文所講解到的「5個排版構圖基本原則」,很快你就能達到專業設計師的水準。
&>&>全文閱讀:平面設計自學入門教程:排版構成篇(3/5)
http://weixin.qq.com/r/lzj85H-EFiJprTuH922F (二維碼自動識別)
無數令人驚嘆的設計作品,都離不開線條、圖形、形態、肌理這些最為基礎的視覺元素。接下來,我們就從0開始,學習其中的門道。
&>&>全文閱讀:平面設計自學入門教程:設計的基本原理(5/5)
一、技法修鍊——徹底掌握UI設計軟體
這一階段的目的,是掌握UI設計的常用軟體,主要以學習Photoshop為主,熟悉其軟體操作界面,用作UI界面設計繪製。然後AE軟體是用作動效的,也需要你適當了解。如果你有Mac電腦,往後可以再學習一下sketch這款軟體。
PS軟體基礎:photoshop CS6零基礎入門教程 (必學,用於界面設計)
Sketch軟體基礎:Sketch中文用戶手冊(目前只有Mac版本,Win用戶學PS就行了)
AE軟體基礎:AE零基礎中文入門教程(必學,用於UI動效設計)
以上幾個教程非常細緻,能夠幫你一掃軟體知識盲點。
二、理論+實踐——深入學習UI設計核心知識。
這一階段的目的,是掌握UI相關的設計規範,樹立UI設計的思維方式。同時再輔以大量的UI設計臨摹練習,在鞏固軟體技法的同時,加深對設計思維的理解。
1.理論——學習UI設計理論,及設計規範。
掌握UI設計的核心思維方式,學習為什麼要這樣設計,以及怎麼開始UI設計的的背後邏輯,及其指導思想。
書籍:《設計之下》(掌握UI設計流程,以及設計規範)
書籍:《界面設計模式(第2版)》、《交互設計沉思錄》
iPhone尺寸規範
2.實踐—UI圖標設計
深入學習歸納物體材質、光影、透視結構;並用PS軟體繪製表現的技法。
UI圖標設計:《精品ui圖標製作教程》
3.實踐—UI交互設計
UI設計的核心知識一是交互,二是視覺,所以這一部分的知識非常重要!
UI交互:《sketch交互設計入門到精通教程》
4.實踐—UI動效設計
把靜態的界面,按一定的規則、邏輯通過相關軟體動態的展示出來,讓其他介面人員更直觀理解UI設計師的成果和理念。
UI動效設計:《《UI動效設計教程-AE軟體》》
5.實踐—界面設計,做大量的UI臨摹練習
此階段,你可以參考或CollectionUI,或UI中國,裡面有一些優秀的作品及經驗分享,從中臨摹以提升你的軟體技法,或從中學習別人產品開發流程、以及UI輸出經驗。
三、後期提高——多看優秀設計作品,保持與行業的交流分享。
這一階段就是通過多看優秀的設計作品,更多的豐富設計理論知識,保持著長期學習的狀態,讓自己與時俱進。
Dribble:Show and tell for designers
Behance:Behance
書籍:視覺設計書籍推薦(豐富更多的設計理論知識)
站酷:打開站酷,發現更好的設計!
以上幾個分享的教程和書籍,完全足夠你掌握UI設計的技能,並找到相應的設計工作。你把上面的所有學習教程買下來,也不會超過1000塊。最後不要忘了,善用搜索引擎,是高效自學UI的關鍵!
關於我
@酷coo豆 ,平面設計學習日記網站長,非科班平面設計師,對自學設計有著深刻的見解。樂於分享自學平面設計的相關書籍、教程、經驗等資源參考,希望和初學平面設計的你一起進步,歡迎訂閱我的專欄。
最後推薦:職業平面設計教程、自學提升書單匯總
(完)
寫在前面——僅為基礎入門指導。
不缺錢,沒有設計師熟人好友,找個培訓班因該能少走不少彎路,節省不少時間。
(解釋一下培訓班,一般人身邊能有設計師朋友指導入門的不多,自己完完全全從零開始是很茫然的,雖然培訓班肯定不值那個價錢,但是一個淺淺的入門應該還是可以的,前提是自己還是用心學.)但是決定性因素在自己,就像上學同一個班,差別很大。就像2個差別很大的學校,也都有牛逼的學生。
一、學習基礎軟體操作
如果沒有PS 基礎,請百度搜索PS教程。
(李濤的ps教程不錯你可以看一下)(一邊看,一邊跟著做,動手很重要)(軟體可以是別的比如AI,方法是一樣的)
二、磨練技能,動手練習
找一些自己喜歡好看的圖標、APP、網站截圖下來,儘可能百分百臨摹複製出來。
(不懂就看教程,百度,進各種設計、UI群,問別人,問朋友。百度和教程是第一位的,盡量少問別人,問多了會煩的。尤其是重複的問題,新手有時候簡單的操作記不住不會,因此勤做筆記,一個一個步驟細緻一點,確保下次還能按照步驟重來一遍)
這裡臨摹幾套完整的APP很有必要,
1、熟練你的軟體操作能力
2、對基本界面布局的理解
3、發現很多不上手做就注意不到的問題
最直接的效果就是你可以開始上手做東西,而不是做一些四不像的半成品。(因為你已經做了好幾套成熟而完整的作品了,臨摹的也是你做出來的)(很有必要強烈推薦)
你平時都是怎樣進行設計技能練習的? - 用戶界面設計
三、提高審美、拓展思路、開闊眼界
瀏覽各種設計類的網站(站酷,優設、UI中國。。。)看別人的學習經驗,下載收集設計類的素材。
學習 Photoshop 或者網頁設計,有哪些網站值得推薦? - 網頁設計 (Web Design)
UI中國-專業界面交互設計平台
站酷 (ZCOOL)
優設-UISDC: 優秀網頁設計聯盟-SDC-網頁設計師交流平台
花瓣 http://huaban.com/calvinzhong/ 可以求粉么?
設計達人 | 愛設計,愛分享。
Iconfont-阿里巴巴矢量圖標庫 超大圖標庫
可能這裡是別人的飛機稿,練習,項目上線以後才發布的稿件、很多是對新趨勢的嘗試,產品的改版、還是相對完整的作品。這也是有一定價值的。
而且網站還有更多的內容是別人的經驗總結(快速解決某些問題,掌握某些知識的利器),教程和各種精美實用的素材。(不建議花太多精力學習——某些過於炫技的東西)
四、規範自己的工作流程
下載各平台的設計規範(安卓,蘋果,WP)仔細研讀,並在練習中加以注意,應用。
Material Design中文版_Material Design中文教程_Material Design開發中文手冊[PDF]下
Android L (5.0)界面(附PSD)
[ISUX轉譯]iOS 9人機界面指南(一):UI設計基礎
[ISUX轉譯]iOS 8人機界面指南(一):UI設計基礎
這些東西,看個N遍都不為過。自己看著辦。
以上一 二 三 四 應同時穿插進行,沒有優先順序和那個更重要。
自己覺得差不多了,就可以開始對已有的APP,網站進行修改設計,發現優點與不足。變成自己的東西。自己嘗試做自己想法的東西,發表在 你經常瀏覽的設計網站上,接受別人的提意見,贊同,表揚。
五、嘗試自己做相對完整——圖標、APP、網頁
這是對之前所學的總結,也是以後找工作的鋪墊
準備找實習的工作(這是一邊工作一邊學習的過程,私以為這個階段學習比工資更為重要)
如何找實習的工作?
在這個階段——這是一個技術活,作品可以展示很多東西
1、創作的作品整理一下思路,可以附帶一些文字內容。
2、整理好你之前的臨摹的作品
簡歷應著重表現你單獨完成的APP、網頁的經歷
作品質量和數量體現-你學習的態度
實習的工作 目的不是薪水,是學習。
在實習中有了項目經驗,公司對你好,有的學,那就好好乾,對你不好,沒啥好學的,那就跳槽。
跳槽的重點,你仍然需要學習,所以盡量不要找只有一個你一個設計師的公司,沒有交流沒有學習不會愉快的。
更具體的方法和資料
以下為轉載 ——以下為轉載—— 以下為轉載—— 以下為轉載 ——以下為轉載 —— 以下為轉載 ———————————————————————————————————本人不是虎哥
寫在之前:這篇教程內容比較多,如果你是新手,能堅持每個知識點都搞明白的話,起碼要半年的時間~~!、
如果你進來隨便看一看就走了,那不能怪別人,是你自己不努力~!~~已經有很多新人在這裡學完找到了高薪工作。
今天來談談這個話題,學UI第一階段到底要掌握哪些知識和技能。
我們先來劃分一下啊,學UI要分幾個階段來學:
初級階段——&> 中級階段——&> 高級階段
QQ群里大多數學生都還在入門階段,感到很迷茫,不知道從哪裡開始學起。網上的海量信息,全是教程,都不知道先看什麼,後學什麼。非常的無助。
小編擁有多年UI設計實戰經驗,大大小小也做了很多項目,借這個機會,給新人們指引一個方向,希望能幫助到大家。
入門階段,就像一張白紙一樣,乾乾淨淨,也很茫然。所以才會有那麼多的培訓學校,教給大家的都是最基礎的入門的知識。
很多人在群里會問,我是自學還是報班啊。這個問題回答的嘴都軟了。
答:你如果定性比較弱,需要人逼著才學的進去,又不差錢。那麼就報班吧,這樣入門比較快。選擇學校的時候先去聽聽,在問問大家,不要被忽悠~!~如果你自學能力還不錯,又差錢。那麼還是自學好了。
下面我們來講講自學,因為小編從業多年都是自學。誰叫咱是窮孩子,交不起16800的學費。
話說這錢可以買一台高配的MACBOOK PRO 15
上邊這2篇文章看完以後,是不是大致明白了一些什麼了。
先來說說UI設計入門階段,用什麼軟體。工欲善其事,必先利其器對於入門階段的童鞋來說,不要糾結那麼多,先把Photoshop玩熟練再說吧。因為在日常工作中,用的最多的就是PS了,可以這麼說,做UI界面基本上用它就夠用了。所以入門階段的你,不要瞎操那麼多心了,專心學習PS吧.
軟體安裝(建議購買正版軟體,以下下載僅供學習使用)- Photoshop CS6下載
- Photoshop CC(安裝文件+破解教程+破解補丁)
- 怎樣安裝Photoshop畫筆,形狀,動作,濾鏡等插件
- psd 縮略圖查看插件
配置Photoshop參數,做UI更方便安裝字體
- ios-android-wp 3大系統字體下載(包含中英文)設計師必備
- ios在線預覽字體(ui設計師必備)
photoshop視頻教程
- 傳智播客網頁平面設計學院 Photoshop快速入門視頻教程
- 李濤-photoshop教程
- 李晨公開課視頻教程
- 7天精通Photoshop CS5 UI交互設計
- 杜娟教你如何優秀UI設計師
- 李鳳輝-UI設計教程
- Photoshop CS5實例視頻195集
- 老賀-PS人物面部美化及商業修片技法
- 高志遠-Photoshop UI設計視頻教程-快速掌握水晶質感圖標
- PHOTOSHOP CS 視頻教程完整版(有些老,但是講的還是可以)
還有這幾個也要看看的:
- 45個設計師需要熟記的ps快捷鍵
- PS真正實用技巧
- Ps改進UI設計的一些技巧(必看)
- 設計新手在PS中最常犯的6個錯誤
- 你的PS很卡嗎?來瞧下這10個加速技巧
好了,軟體也安裝好了,視頻看了不少了。接下來就是要做各種練習了。前邊UI到底是什麼一文裡面也說了,UI不光是畫ICON,還要做界面。還有一些交互知識。
入門階段,就先別想那麼多,先畫畫簡單的圖標,做一些簡單的界面吧。
這個時候,逮到什麼畫什麼,比如打開百度的首頁,這個界面不陌生吧,照著畫一個出來。有人說了,這有什麼好畫的啊。你還別不服。很多入門級的新人,還真是做不出來。
有人連字體都做不出來,宋體12號 ,這個地方選無,就好了。
然後輸入框的效果放大看看,用了內陰影。
然後是搜索按鈕,用到了什麼效果了。
漸變+描邊+投影+內陰影做的白色高光(一個圖層樣式完成)
小小的一個按鈕,盡然有這麼多學問在裡面。這就是UI的魅力所在。
UI設計要先把什麼搞明白,哪些PS技巧先學會Photoshop的知識點太多了,用了10年都不敢說精通。每個不同的設計領域用到PS的知識點也不一樣。
比如做CG原畫的,做網頁設計,照相館處理照片的等等用到PS功能都不太一樣。
UI設計 入門階段先要學會以下幾個功能,一定要玩的很熟練第一:圖層樣式上面做的百度這個頁面,看著簡單,卻用到了好幾種的圖層樣式。那麼像下邊這樣的按鈕。
用到的就更多了。所以想打怪升級,還是要把圖層樣式玩的很熟悉,入門階段要分析的出來,用到了什麼效果。
看到什麼好的界面或是ICON,就立馬分析一下,它用到什麼圖層樣式?
相關的教程:
- 一個按鈕有話說(PSD下載)
- 還在擔心按鈕設計嗎?來看看這十條基本準則
- 教你畫一個開關
- 如何與像素打交道
- 透明導航設計講解
第二:圖層的混合模式
- Photoshop的混合模式(詳細解答)
第三:形狀工具
- 玩轉PS形狀圖層UI設計師必看
- 虛線的畫法
第四:學會切圖(常用的切圖辦法就在這裡,先挨個學一遍,然後根據實際的情況選擇相應的切圖方法)
- photoshop切片使用小技巧(切圖)
- PhotoshopCC新功能 生成圖像資源(切圖)
- 【詳細介紹android和ios平台的切圖】
- 做ui必備–PS切圖動作用法(必裝)
- Android切圖小貼士
搞明白一些常規的界面尺寸和視覺規範移動端:
- 移動端界面設計之尺寸篇
- ios視覺設計規範說明
- IOS 7 Ui規範PSD
- Android系統字體規範(含Android系統字體包下載)
- android規範文檔3份PSD下載(新手必學)
- ios7和ios6 2套icon模板下載(ui設計師必備)
- WP7 控制項,WP設計師必備文件。(psd下載)
網頁端:
- 網頁UI是如何標註的?(附帶WEB UI視覺規範文檔)
- 網頁UI視覺設計規範
- 網頁設計基礎技巧
- WEB設計指南!
- 界面設計速成
- 不要讓用戶思考
色彩的學習
設計中關於顏色搭配的一些小經驗
配色秘要:永遠不要使用純黑
PS教你做漸變大背景
PHOTOSHOP操作技巧開始做點什麼(臨摹階段)先來點勵志的
開始練習!先學會技法。
- 還在擔心按鈕設計嗎?來看看這十條基本準則
- 解密IOS7毛玻璃效果
- 輕鬆打造iOS7風格圖標
- PS強大的角度漸變
- 教你如何畫圈圈—–標識設計中輔助參考線入門
常規UI切圖(3種方法,各有各的好)移動端UI切圖必備工具和教程
好了,差不多了,這些都挨個學一遍。就入門UI了。
學UI 要學的真的很多,這些都是基礎的知識,這些掌握了,才能到達 中級階段,加油!少年~~!
整理編寫:TIGER
原文地址
學UI入門階段到底要掌握哪些知識(UI第一階段課程)本人不是虎哥
以上編輯於 2014-12-27
一、UI設計的概念
軟體設計可分為兩個部分:編碼設計與UI設計。UI的本意是用戶界面,是英文User和 Interface的縮寫。從字面上看是用戶與界面2個部分組成,但實際上還包括用戶與界面之間的交互關係。 UI設計分為實體UI和虛擬UI,互聯網說的UI設計是虛擬UI,一般是指對軟體的人機交互、操作邏輯、界面美觀的整體設計。
二、UI設計師
「UI」的本義是用戶界面,是英文User和interface的縮寫。UI設計師簡稱UID(User Interface Designer),指從事對軟體的人機交互、操作邏輯、界面美觀的整體設計工作的人。UI設計師的涉及範圍包括商用平面設計、高級網頁設計、移動應用界面設計及部分包裝設計
工作內容
編輯負責軟體界面的美術設計、創意工作和製作工作;根據各種相關軟體的用戶群,提出構思新穎、有高度吸引力的創意設計;對頁面進行優化,使用戶操作更趨於人性化;維護現有的應用產品;收集和分析用戶對於GUI的需求。
工作經驗
主要要求從業人員精通Photoshop、Illustrator、Flash等圖形軟體,1. 負責公司產品在智能電視、PC端、移動端頁面/應用的整體設計;2. 基於用戶體驗、人機交互、圖形化設計、界面設計等前沿理論實現產品風格設計;3. 充分理解產品策劃思路及理念,配合產品經理和研發人員實現產品各種界面的視覺設計;4. 建立和完善產品界面視覺設計規範;5. 根據交互設計及產品規劃,完成產品(iPhone、Android 、Web平台App及網站)相關的用戶界面視覺設計。 6. 配合產品開發中的圖形界面(GUI)設計。 7. 完成產品相關推廣活動的專題頁面、FLASH的設計及製作。 8. 與研發團隊充分溝通協作,確認可控的誤差範圍和視覺效果的最終實現; 9. 根據視覺設計的發展趨勢及用戶研究的結果不斷優化產品的圖形界面(GUI)
UI初學者需具備的知識架構
1、視覺設計部分:首先,視覺設計不僅僅是做ICON,做界面或者界面元素。很多人認為,如果去互聯網公司做視覺方向ui設計,只會簡單做圖標、界面就OK。這是極其幼稚的想法。一般公司如果花錢雇專職視覺設計師的話,那麼整個公司的美術設計工作一般都會給視覺設計做。這就要求你幾乎精通平面設計師所會的所有知識。所以,如果你想今後在視覺領域混,那麼以下幾項技能必不可少:
1)平面構成;
2)色彩構成;
3)版式設計;
4)心理學;
5)美術繪畫;
6)設計意識;
2、交互設計師應該具備的基本能力:
1)了解用戶體驗設計、可用性原則;
2)信息挖掘、用戶調研、數據分析;
3)良好的邏輯能力;
4)心理學;
5)交互設計原則、不同平台的規範;
6)產品視覺感;
7)溝通能力。
三、項目開發流程
圖中也展現了UI設計師在項目開發過程中的工作內容
四、.UI學習/設計步驟
規範基礎-軟體基礎-圖標設計-界面設計-切圖交互-用戶產品 跟著步驟一步步的走。1.自學UI平台:UI設計者 – 一個免費自學UI設計APP
2、UI設計的規範一致性原則堅持以用戶體驗為中心設計原則,界面直觀、簡潔,操作方便快捷,用戶接觸軟體後對界面上對應的功能一目了然、不需要太多培訓就可以方便使用本應用系統。
- 字體 -保持字體及顏色一致,避免一套主題出現多個字體; -不可修改的欄位,統一用灰色文字顯示。
- 對齊 -保持頁面內元素對齊方式的一致,如無特殊情況應避免同一頁面出現多種數據對齊方式。
- 表單錄入 -在包含必須與選填的頁面中,必須在必填項旁邊給出醒目標識(*); -各類型數據輸入需限制文本類型,並做格式校驗如電話號碼輸入只允許輸入數字、郵箱地址需要包含「@」等,在用戶輸入有誤時給出明確提示。
- 滑鼠手勢 -可點擊的按鈕、鏈接需要切換滑鼠手勢至手型;
- 保持功能及內容描述一致 -避免同一功能描述使用多個辭彙,如編輯和修改,新增和增加,刪除和清除混用等。建議在項目開發階段建立一個產品詞典,包括產品中常用術語及描述,設計或開發人員嚴格按照產品詞典中的術語辭彙來展示文字信息。
準確性原則使用一致的標記、標準縮寫和顏色,顯示信息的含義應該非常明確,用戶不必再參考其它信息源。
- 顯示有意義的出錯信息,而不是單純的程序錯誤代碼。
- 避免使用文本輸入框來放置不可編輯的文字內容,不要將文本輸入框當成標籤使用。
- 使用縮進和文本來輔助理解。
- 使用用戶語言辭彙,而不是單純的專業計算機術語。
- 高效地使用顯示器的顯示空間,但要避免空間過於擁擠。
- 保持語言的一致性,如「確定」對應「取消」,「是」對應「否」。
可讀性原則
- 文字長度
文字的長度,特別是在大塊空白的設計中很重要,太長會導致眼睛疲憊,閱讀困難。太短又經常會造成尷尬的斷裂效果,斷字的使用也會造成大量的複合詞,這些斷裂嚴重的影響了閱讀的流暢性。
- 空間和對比度
每個字元同線路長度,間距也是重要的。所以每個字元之間的空間至少等於字元的尺寸,大多數數字設計人員習慣選擇一個最小的文字大小的150%為空間距離,這就可以留下足夠的空間。當每一行中讀取大段的文字,且線路長度過多或線之間的空間太少,都會造成理解困難。
- 對其方式
無論是在文本中心,還是偏左,或者是沿著一個文件的右側對齊,文本的對齊相當重要,可以極大地影響可讀性。一般而言,文本習慣向左對齊,因為它反映了你的閱讀方式 – 從左至右。你熟悉每一行開始和結束的地方。布局合理化原則在進行UI設計時需要充分考慮布局的合理化問題,遵循用戶從上而下,自左向右瀏覽、操作習慣,避免常用業務功能按鍵排列過於分散,以造成用戶滑鼠移動距離過長的弊端。多做「減法」運算,將不常用的功能區塊隱藏,以保持界面的簡潔,使用戶專註於主要業務操作流程,有利於提高軟體的易用性及可用性。
- 菜單 -保持菜單簡潔性及分類的準確性,避免菜單深度超過3層。 -菜單中功能是需要打開一個新頁面來完成的,需要在菜單名字後面加上「…」。【只適用於C/S架構,B/S請無視】。
- 按鈕 確認操作按鈕放置左邊,取消或關閉按鈕放置於右邊。
- 功能 -未完成功能必須隱藏處理,不要置於頁面內容中,以免引起誤會。
- 排版 -所有文字內容排版避免貼邊顯示(頁面邊緣),盡量保持10-20像素的間距並在垂直方向上居中對齊;各控制項元素間也保持至少10像素以上的間距,並確保控制項元素不緊貼於頁面邊沿。
- 表格數據列表 -字元型數據保持左對齊,數值型右對齊(方便閱讀對比),並根據欄位要求,統一顯示小數位位數。
- 滾動條 -頁面布局設計時應避免出現橫向滾動條。
- 頁面導航(麵包屑導航) -在頁面顯眼位置應該出現麵包屑導航欄,讓用戶知道當前所在頁面的位置,並明確導航結構,如:首頁&>新聞中心&>歐科智能招商服務平台正式發布,其中帶下劃線部分為可點擊鏈接。
- 信息提示窗口 -信息提示窗口應位於當前頁面的居中位置,並適當弱化背景層以減少信息干擾,讓用戶把注意力集中在當前的信息提示窗口。一般做法是在信息提示窗口的背面加一個半透明顏色填充的遮罩層。
目前我還是用的ios7的設計規範,1136*640適配性能還是很好的。
當然如果想用其它規範也可以。
規範基礎 UI設計者
APP設計規範(15圖)_@威廉波波斯收集
UI文章專題-UI中國尺寸規範 - 優閣網(UIGREAT)APP設計尺寸規範大全,APP界面設計新手教程【官方版】網頁設計規範
2014網頁設計尺寸規範? - 莫若
2.軟體基礎PS、AI、Skech、mockingbot、mockplus、chainco、cutman、Axure等等製作原型,界面,圖標製作,素材製作,切圖等等相關步驟的軟體都需學會。當了解的越多會發現,有更多新型提高效率好用的軟體,例如pixate、xmind、AE......以及更多mac上面的國外app製作軟體。
工具-UI中國-專業界面交互設計平台
25學堂-專註APPUI界面設計,分享移動互聯網優秀產品原型 http://weixin.qq.com/r/cHVtdXTEvCnDrTAW9yBi (二維碼自動識別)
設計工具(165圖)_@威廉波波斯收集自己也收藏了很多新奇的UI設計軟體。
3.圖標設計
圖標設計 UI設計者 當然,也有圖標素材。
Iconfont-阿里巴巴矢量圖標庫中國最大的圖標素材庫,還可以製作iconfont
素材網站(底部有鏈接):
大家根據關鍵詞搜索(自己最近收藏的一些素材網站),應該夠新手用的了
圖標模板製作
圖標模板 – 搜索結果http://weixin.qq.com/r/cHVtdXTEvCnDrTAW9yBi (二維碼自動識別)
4.界面設計
欣賞臨摹優秀作品
APP界面(83圖)_@威廉波波斯收集
當然,還有UI優秀作品展示平台。
UI中國-專業界面交互設計平台
http://weixin.qq.com/r/UUiWjnzEoCHfrTjt9x1D (二維碼自動識別)
優閣網(UIGREAT)素材網站:
大家根據關鍵詞搜索(自己最近收藏的一些素材網站),應該夠新手用的了
當然了還有UI網站導航:大家根據關鍵詞搜索(自己最近收藏的一些素材網站)
5.切圖交互
Cutterman - 最好用的切圖工具
UI動效(75圖)_@威廉波波斯收集
6.用戶產品
這個就不多說了,進入公司跟著項目走一遍就知道了。
說一點用戶體驗設計的乾貨吧。
騰訊CDC
騰訊MXD移動互聯網設計中心攜程設計委員會-Ctrip Design Committee
http://ued.sina.com/曉生 | 和他的小夥伴們
界面設計相關元素也很重要,比如字體、色彩搭配、布局等等,我只提一下,不細講。
7.字體設計/學習平台
中文字體字體設計欣賞+字體下載:
字體傳奇網-中國首個字體品牌設計師交流網特別美的中文字體合集中文字體界面設計 - 圖翼網(TUYIYI.COM) - 優秀UI設計師互動平台
·找字網,您的字體管家!免費字體下載,字體設計!
·書法字體轉換器在線轉換-藝術字體在線生成器設計-第一字體網
·字體下載-求字體網提供中文和英文字體庫下載、識別與預覽服務,找字體的好幫手
·書法字典 書法字體生成器 書法字典在線查詢 在線書法字體生成
·藝術字任意生成器 - 藝術字所有參數可控轉換器
·在線書法字體生成網站_書法字體在線轉換_支持在線生成矢量書法家字體(可下載)
英文字體下載
·Tyler FinckBBehance
·Free font downloads - Fontsup.com
·introducing White Pine, a free font
·Hamster Script (Free Font)
·中文字體+英文字體
·Raleway 字體
·字體設計教程字體設計學習_藝術字體,書法字體,PS字體,AI,C4D字體設計_虎課網
· 設計資源下載 - 創意互動 - 精品文章分享、精品APP界面欣賞、優秀資源免費下載 - 為中國設計師加油
·好美!17套美麗時尚輕盈精細字體免費下載 - 設計資源下載 - 創意互動 - 精品文章分享、精品APP界面欣賞、優秀資源免費下載 - 為中國設計師加油
·設計師必備暖品!20款值得擁有的中文字體打包下載 - 設計資源下載 - 創意互動 - 精品文章分享、精品APP界面欣賞、優秀資源免費下載 - 為中國設計師加油
8.色彩搭配
我在網頁設計中怎麼配色? - 莫若的回答
·沒有設計師時,產品經理該如何給產品配色? - 莫若的回答已經非常仔細了,可以看看
·Material Design Color Palette Generator
·Material Design, Daily a€「 MaterialUp
UI設計交流群:414632028
...未完待續
------------------更新免費UI素材下載網站--------------------
1.綜合類UI素材下載平台
·網頁UI免費下載_網頁UI素材免費下載--千圖網www.58pic.com
·ui圖片素材_ui設計模板大全【免費下載】_90設計網
·優秀網頁設計聯盟-SDC-網頁設計師交流平台-聽講座,聊設計,找素材,盡在優設網
·Behance
·Show and tell for designers
·UI中國-專業用戶體驗設計平台
·學UI網-APP截圖站_APP欣賞_APP圖片 | APP截圖欣賞站是以APP設計欣賞,APP圖片展示,APP截圖分類為主APP界面欣賞網站
·黃蜂網-設計優選 - 黃蜂網woofeng.cn·
25學堂-專註APPUI界面設計,分享移動互聯網優秀產品·方酷 - UI設計|APPUI|手機UI設計分享平台
·UI設計網uisheji.com-專業的ui設計APP界面設計學習分享交流平台 -
·UI設計者 - 一個免費自學UI設計APP
·素材中國_免費素材共享平台www.sccnn.com
·PS飯糰網 psefan.com - 不一樣的素材庫!精選設計師高逼格素材下載
·http://www.tuyiyi.com/
·PS教程,Photoshop教程網 - 思緣教程網
·標誌集合圖片_標誌集合設計素材
·歐萊凱設計網_分享創意設計素材
·平面設計網_平面設計作品欣賞-中國設計網
·我圖網,提供圖片素材及模板下載,專註正版設計作品交易·
創意互動 - 精品文章分享、精品APP界面欣賞、優秀資源免費下載 - 為中國設計師加油·中國站長網_與站長攜手走向成功_cnzz.cn_站長網
2.UI領域素材下載
·Categories
·SUI Mobile
·AUI-靠譜的移動前端框架
·提供國外資源源文件下載分享
·優閣網(UIGREAT) - UI設計師學習交流社區 - Powered By EduSoho
·下載 - 學UI網
·http://www.appui.mobi/
·(2695) Free Mockup Generator - Placeit
·PSDDD.co - Free Photoshop amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp; Sketch UI Resources
·http://www.uicoc.com/
·UI設計愛好者-UI設計教程,UI設計師的學習交流平台
·UE設計平台-網頁設計,設計交流,界面設計,酷站欣賞
·雲瑞設計-ui設計與體驗博客
·Download premium amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp; free design content ~ EpicPxlsFree UI Kit PSD ·FilesFreeUIKits.com
·http://www.teehanlax.com/tools/iphone/
·http://ui-cloud.com/search/APP/?paged=2
·Hand-picked amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;#x27;Icons for iOS amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp; Macamp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;#x27;
·PSD Repo - Free quality PSDs available for download
·Free PSD, Mockup, WordPress Theme and Other Resources
·User Interface Design Inspiration
·網站UI設計說明範本(設計風格指南) - 學UI網
·UI設計/UI界面設計/交互設計 - 作品欣賞 - 設計帝國
·The marketplace for design resources
·Mac UI and Icon Design Inspirations Gallery
·WeUI
·UI中國
·xiaopiu-在線APP原型設計
·AE製作圓球讀取動畫 FeatMax from TinyHouse
·UI動效_UI動畫_AE做ui動效-Uimaker-專註於UI設計
·Free cross-platform UI kit for Photoshop and Sketch
·WE DESIGN amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp; BUILD APPLICATION INTERFACES
3.UI原型素材下載
·原型庫 - AxureRP高保真原型案例實戰,原型設計,可以如此簡單!
·axure原型素材 - Axure原創教程網
·教育學習網站常用圖標矢量素材下載-非凡圖庫
·html5模板,html5網頁模板,html5網站模板免費下載_模板王
4.icon(圖標素材下載)
按icon質量順序排名: ·38,100 Free Icons - The Largest Icon Pack Ever
· Iconfont-阿里巴巴矢量圖標庫
·Fontello - icon fonts generator
· Icon Font, SVG, PDF amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp; PNG Generator
· icon圖標庫-icon圖標庫|矢量圖標庫-千圖網www.58pic.com
· Free Flat Icons - FlatIcons·
Mac UI and Icon Design Inspirations Gallery
·Iconfinder - 1,300,000+ free and premium icons ·
·Noun Project
·IconPng.com 愛看圖標網,免費中文圖標搜索引擎!
· 千圖網-免費圖標下載,圖標搜索引擎ICON(PNG/ICO/ICNS)圖標下載 ·
DB Freebies Design Resources from Behance and Dribbble
·is hungry PNG、ICO、ICNS 格式圖標搜索下載_easyicon.net
· 打包好了!可能是2015年最不能錯過的圖標素材免費下載
· 特色圖標_68Design ICONS源文件下載-
·圖翼網(TUYIYI.COM) - 優秀UI設計師互動平台
· http://xiaba.shijue.me/search
·Icons set
·搜索結果 icon : PS筆刷吧-筆刷免費下載
·icon下載 - 學UI網
·Icons
· Icons DB - free custom icons
·Foundry ∞
·下載資源搜索_CHINAUI優艾網
·icon - 搜索結果 - 25學堂
·Free icons by first-class designers
·UI設計師靈感庫-優界網
·icon圖片_專題_素材中國
·Transformicons Builder
·Download Free Vectors, Photos, Icons, PSDs and more
·Buy 38,100 icons for iOS 10 and Windows 10. PNG and SVG formats.
·Icons and Vector Graphics
· http://swifticons.com/preview
· iOS8 App圖標模板尺寸規範[4.0]最新出爐
· iOS Icon Gallery
·PrestaShop 官方圖標包開源 含svg、eps和圖標字體格式
·Othericons – Premium Collection of Beautiful Icon Sets
·37個外國高素質圖標網站大合集!
·Evil Icons
·旅行圖標來一發!100+精美旅行圖標集免費下載 - 設計資源下載 - 創意互動 - 精品文章分享、精品APP界面欣賞、優秀資源免費下載 - 為中國設計師加油
·一淘無線圖標庫 - 公開圖標庫 - Iconfont
5.UI設計導航平台(每個導航都有上百個UI設計+網頁設計+前端+各種相關的網站鏈接),點進去之後,你一定會回來點贊的!:
1.設計導航 - 精選最好的設計網站大全
2.SDC設計師網址導航
3.牛大拿_最貼心的設計師導航_Niudana.com 4.輕設計 - 飛屋設計 5.UI設計師導航網 6.1納米學習網站導航 7.歡迎訪問 祝快樂 8.資源集-墨加 9.設計網站 平面設計 網址導航 10.快搜 — 搜索快人一步 11.設計之家 - 傳播先進設計理念 推動原創設計發展 12.設計師導航-圖翼網(TUYIYI.COM) 13.Judas.n個人導航,YouMeek導航
6. UI專屬論壇社區
·UI中國
· UCD大社區 - 以用戶為中心的設計
· Show and tell for designers
· UI設計者 - 一個免費自學UI設計APP
·掘金
· 優閣網(UIGREAT) - UI設計師學習交流社區
·http://app.xueui.cn/ http://www.appui.mobi/
·設計經驗技巧知識分享 - 黃蜂網woofeng.cn
·EpicPxls
·25學堂-專註APPUI界面設計,分享移動互聯網優秀產品
· http://www.fondcool.com/
·設計心得-UI設計網uisheji.com - 設計理念-
·圖翼網(TUYIYI.COM) - 優秀UI設計師互動平台
· MobileUI莫貝網 - 移動設備界面設計專業網站.
·雲瑞設計-ui設計與體驗博客
· UE設計平台-網頁設計,設計交流,界面設計,酷站欣賞
·AUI - 高性能移動前端框架
·設計達人 | 愛設計,愛分享。
·axure原型素材 - Axure原創教程網
· 原型庫 - AxureRP高保真原型案例實戰,原型設計,可以如此簡單!
·UI設計_UI_UI教程-Uimaker-專註UI設計
·蜜豆首頁
· 作品流 | 騰訊原創館
·Material Design, Daily - MaterialUp
·花瓣 Pinterest
· 十五言 - 每個人都在創造
· UI設計/UI界面設計/交互設計 - 設計欣賞 - 設計帝國
·少數派 - 高質量應用推薦媒體
7.UED相關
·騰訊CDC
·騰訊MXD移動互聯網設計中心
·騰訊ISUX - 社交用戶體驗設計
·TGideas-騰訊遊戲官方設計團隊
· 百度用戶體驗中心
· http://ued.taobao.org/blog/
·攜程設計委員會-Ctrip Design Committee
· 新浪UED | 一個關注用戶體驗、關注工作流、關注作品質量的有愛團隊
· 曉生 | 和他的小夥伴們
·騰訊遊戲官方設計團隊
·TGideas
· 騰訊網UED
· 阿里巴巴中國站用戶體驗設計部
·阿里巴巴國際UED
·阿里媽媽MUX
·網易用戶體驗設計中心
·FEX 做最專業的前端
·百度EUX企業產品用戶體驗中心
·奇舞團 360旗下前端開發團隊
·攜程設計委員會
·暢遊視覺設計中心
8.平面素材下載(設計UI過程中還是會多多少少用到平面素材)
·Free PSD amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp; Graphics, Illustrations
·PSD素材,PSD素材免費下載,PS素材,PS素材下載-站長素材
·圖片網_背景圖片素材網_qq空間圖片素材_圖片大全_素材中國17素材網
·素彩網-素材天下,ps素材,矢量素材,psd素材免費下載,ppt模板,素材中國,免費素材網
·素材天下網-PSD素材免費下載-矢量素材-PPT模板-中國素材免費下載網站
·愛圖網 - 圖片素材,PSD素材,矢量素材,設計圖庫,淘寶素材,設計素材圖片網
·素材搜索-設計素材搜索聚合
·紅動中國免費素材網_中國最大的免費素材網!
·大圖網 - 影樓素材,PSD素材,矢量素材,高清圖片素材,高品質設計素材共享
·68Design_網頁設計師|UI設計師|電商設計師
·http://sansheji.com/sucai
·iMS素材共享平台|Arting365 - 分享,發現好素材
·設計本-中國室內設計師網_室內設計聯盟_裝修設計公司大全
·經典版式設計,包裝設計,字體設計欣賞,最新平面設計軟體,ps濾鏡,在線書法字體,日韓文字體,coreldraw教程免費下載_億品元素
·Free PSD Files and best photoshop Freebies
·http://xiaba.shijue.me/stuff/?ref=main_nav
Search for amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;quot;APPamp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;quot; - Freebies Booth·Free amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp; Premium Design Resources
·懶人圖庫 - 矢量圖,JS代碼,網頁素材 - 學會偷懶,懶出境界!
·Free Vectors amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp; PSD Graphics 527240 graphics in one place!
·Free PSD, AI, Fonts and more
·設計達人 | 愛設計,愛分享。
·矢量圖 - PSD矢量,AI矢量,EPS矢量,矢量素材下載 - 第7頁 - 素材集市
·Free Clipart, Illustrations, Graphics amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp; Vectors
·素材中國|素材之家|淘寶素材|素材天下|psd素材|高清圖片素材免費下載sc.jb51.net
·優設記 - 最全jquery插件下載 - 高質量網頁素材
·微信小程序模板下載_免費微信小程序圖片設計素材_【包圖網】
·Showcase Vectors, Photos and PSD files | Free Download
·The Best Resources for Designers, Every Day.
UI設計交流群:414632028
·如何做設計月薪上萬? - 莫若的回答
·網頁設計中怎麼配色? - 莫若的回答
·學習UI設計和網頁設計以及web前端分別有什麼樣好的網站推薦? - 莫若的回答
·UI 設計初學者應該怎樣入門? - 莫若的回答
-
如果英文可以的話,加一個翻牆技能世界就很廣闊了。
-可以到treehouse登記一個14天免費體驗,足夠把ui類基本概念課程學完了。
-然後可以下個sketch描圖練手。
-參加hiued等分享活動,認識人相互交流。
-讀apple和安卓的人機交互指南。
如何學習 UI 設計? - 馮鐵的回答
謝謝邀請,重疊比較多,請看之前的回答。零基礎自學UI,大致概括為:
培養興趣&>提升美感&>認識UI&>熟悉掌握各軟體&>實例操作&>總結經驗
零基礎自學UI首先要知道的就是你自己是否對UI感興趣,興趣是最好的老師,如果沒有興趣學習UI,那麼自學基本是不可能的,所以自學UI的第一步就是興趣。
第二步就是提升自己的審美,要學習UI,並且成功的掌握了,不能少的就是自身的審美,畫圖不可少的就是美感,UI設計師的水平決定了產品的顏值,用戶的視覺體驗不好,很多時候就會卸載產品,因此零基礎的學員還需要提升自己的美感。
第三步並不是學習UI的軟體,而是認識UI,不要認為UI設計只是簡單的PS畫圖, UI官方的介紹是系統和用戶之間交互和信息交換的媒介,也就是說,UI設計師是設計用戶界面的人。
認識以上的基礎之後,我們就可以開始認識UI設計需要的軟體了。UI設計常用的軟體有Photoshop、AI、Sketch、AE等,這些軟體起碼要精通一個,熟練使用兩個或以上。
Sketch是面向UI設計師、交互設計師的一款軟體,所以建議大家多多熟悉Sketch軟體,如果你用過PS軟體,接觸過Sketch之後就會了解到Sketch的優點,零基礎的可以參考Sketch零基礎入門教程 了解。
通過教程,你能快速了解Sketch的基礎入門知識,熟悉線框圖、流程圖、圖標設計和界面設計等App產品設計流程,並且通過案例能學習到色彩運用、格式塔設計心理學和黃金分割等設計理論和設計方法,以及熟悉Sketch各種高效的插件使用方法。
類似的教程還有UI設計師利器-Sketch教程,也介紹了Sketch界面的基礎入門,很適合零基礎的學員。
△Sketch界面
下面借鑒一個用Sketch簡單製作的UI小圖標的例子,也可以參考Sketch基礎教程之IOS圖標製作:
1、按U,繪製圓角矩形。
2、進入EDIT,點擊左上角和左邊,添加兩個點。
3、然後刪除左上角的角點。
4、按V 繪製折線。
5、進入EDIT 選擇折線角點,CORNERS=2 圓角。邊框為黑色,粗細為8 。
6、使用樣式。
首先選擇折線,然後點擊右側的Create
new shared style 建立一個新的共享的樣式。這個樣式就記錄了線的各種屬性。下面按V,繪製一段線段。選擇剛剛新建的path2 style樣式。
7、這個線段就與折線的風格是一樣的了。按ALT複製,然後調整大小。
完成之,這作為一個文檔圖標還可以,但是作為「文本編輯」還缺點什麼?缺一支筆。
8、按R 繪製一個矩形,邊框為無,填充為黑色。
9、按ALT鍵向上拖動複製,縮小為筆頭。
10、按Transform按鈕,調整筆頭的形狀。
11、然後,按向下的方向鍵,使兩個圖形對象靠近。按Group對二者進行組合。
12、按旋轉按鈕,調整到位。但感覺有點界線不分明。
13、按ALT鍵複製一個為底層。
14、設置底層如下屬性。
15、再把」筆」對象疊到上面,按V 繪製一個線段,為白色,粗細為2左右。
16、完成圖標。
需要Sketch的可以自行百度Sketch下載。
至於PS、AI、AE等的軟體我就不詳細介紹了,可以自己在網上找一些相關的資料或者書籍教程,如果不知道參考哪一些資源較好,感興趣的可以參考:
PS入門教程
1. PS零基礎到精通 入門教程
2.Photoshop基礎教程實用技能精講
AI入門教程
1. AI基礎教程入門
2.Illustrator CC零基礎入門教程
AE基礎+實戰教程
李辰:C4D+AE高級特效實例教程
熟悉了軟體之後,就要開始模仿一些實例,一定要堅持練習,從中會得到很多你意想不到的收穫。
總之,零基礎自學UI,這本就是一個艱難的過程,自身的毅力也是需要考驗的,既然開始自學UI,就堅持下去~
我就介紹到這裡,望交流~
去年三月份強行回答過這個問題以來,陸續收到幾十個點贊和感謝,心中時常愧疚但卻不好作答。最近面試被多次問起這個問題,這裡做一個梳理。
先放去年3月份時候「自認為」不錯的作品:
然後這是最近的一個小練習:
一年以來的成長,最明顯的應該是對於設計的看法。這裡按下不表,且看下文:
大學學的是信息管理,跟設計八竿子不在一個頻道上的專業。一次「信息檢索」的課堂展示,研究 CNKI 與 EI 的差異,當時小組切入的角度是「從交互的角度如何改進搜索」。於是,用 Excel 畫了非常簡陋的原型圖,效果大概類似這樣:
展示效果並不好,那時候好像一個傻X啊。不過,任課老師給予了「猝不及防」的表揚,最後的成績還不錯。
從 2014 年 3 月份,開啟了 30 天學會 PS 的無知之旅。螞蟻線的選框工具、神奇的魔棒工具、藝術家的畫筆和橡皮擦……當時,最開心的事情莫過於按照學UI網的教程,P 出一個像模像樣的圖標。
後來,大四上學期去了一家創業公司「實習」。公司沒有設計師,最艱難的時候是開始不知道怎麼標註和切圖,於是自己解壓縮 apk 文件,一個一個文件夾打開,看那些 icon 的命名和尺寸大小。當然,就設計這件事情上沒有絲毫進步。
大四校招,一度轉向產品經理 PM 崗位。後來,陰差陽錯繼續做了一名 UI 小美工。
而公司,依舊沒有設計師……幸運的是,身邊其他的小夥伴都是一些厲害的人,所以並沒有實習那麼艱難。那個時候,開始意識到自己沒有退路,開始先做一些改變。
個人博客也在六月份開始。
最初主要是臨摹作品,從站酷、UI 中國上扒下來的,從 Dribble、花瓣上找,從自己手機上截圖下來的。重視程度並不夠,得空做一下居多。這裡申明一點,前期「臨摹很重要!臨摹很重要!臨摹很重要!」。
當時在博客上記錄了這樣一段話:
「我深刻理解,進入未知領域最大的是恐懼,一種原罪般地自卑。慶幸的是,這種恐懼在正消退,但也並不值得開心。缺乏自省和執行力,往往會讓人在某夜醒來,翻來覆去,如此刻。」
後來,跟其他設計師學習,開始接觸更多設計相關的東西。開始用花瓣瘋狂地採集圖片,用 Dribbble 和 Behance 看作品,在 LOFTER 上發個人練習。接觸設計理論,感受 Design Thinking 帶來的不一樣。
再後來,跟著做過 VI 和 APP 的設計,回頭看,我非常幸運能夠在非常野路子的時候同時接觸品牌和 UI 的工作,這有助於形成 UI 設計的大局觀。
2016年回來,開始重新審視自己以前的項目,發現自己有越來越多的非常爛的設計。自己也去做過一些調整:
3 月份做新項目的時候,發現讓其他設計師小夥伴跟自己保持在同一個頻率上,能夠有效提高工作效率。於是,向公司申請了「每天早上半小時的設計組分享會」,大家對設計上的看法越來越多元化,分享的作品也越來越好。而這一點,反向地促使我自己去做分享的工作。
個人習慣是從網上或者手機,看到優秀的作品直接保存到印象筆記,然後手動打上設計分析,類似這樣:
這種對作品的分析行為,讓我越來越容易感知一個作品好的地方。
設計三大神奇——多看、多練、多想。
多看,我大概從「不看 - 瘋狂地看 - 找好的作品看 - 帶分析的態度看」。
多練,在博客裡面其實我的練習還蠻多的,但是給人的印象普遍缺少精細度。這一點讓人感到沮喪,最近也在思考這個問題,多練的意義是什麼。看到有很多設計師會做 100 DAY UI 的練習,一方面是佩服,另一方面是遲疑——一張純視覺脫離實際的圖片怎麼能概況 UI 的實質呢。
當然,練習的話,我會推薦嘗試一下不同的方向,從動效到 UI 設計,從產品評測到交互操作等。
多想,這一點上我只能想到多看書。書籍能夠提供很多設計支持的理論,而閱讀能夠讓人變得平和。多想,這關乎了設計思維,我也在嘗試當中,但是並沒有總結出一個方法論的東西,不班門弄斧啦~~
總結上面所有的觀點,如何自學 UI 設計?
- 親愛的,請愛上它。
- 設計思維比實際頁面更重要,停下來好好想一想為什麼微信綠支付寶藍如此深入人心。
- 審美和視野很重要,放棄大多數站酷和 UI 中國的所謂作品吧,投入 Dribbble、Behance等國際設計平台的懷抱。
- 落地的才叫設計,飛機稿只是練習。
- 多看,不是漫無目的地看,帶著態度去欣賞作品。
- 多練,不妨試試更多的方向。
- 多想,多看書,多總結。
- 對設計有敬畏之心。我相信設計是可以改變一個產品的格調,而這必定不是一件容易的事情,每一步你都需要走得很小心很努力。
你看,其實說來說去,依舊是這些寬泛的概念,因為,成長是一種不足為人道也的喜悅和痛苦。
歡迎關注我的 LOFTER ,那裡會有更多本人關於設計的碎碎念。
LOFTER 鏈接:http://imlaimj.lofter.com
20160702
---------------------------------------------------
我覺得對於非科班來說,主要的一個問題是:
想得太多,做得太少。
推薦幾個網站吧,如果有心,你會自己發現更多有趣的東西。
學UI網,北京文理研修學院UI設計學院,很適合新手。
UI中國,UI中國-專業界面交互設計平台,UI相關的作品。
站酷,dribble,花瓣,behance,優設,dribble中國。
另外,可以加一些QQ設計交流群,按照要求做作業,比如迴音設計群。
祝群主早些動手,成為大神。
2015-03-07
--------------------------------------------------------看了 @酸梅干超人的答案,請摺疊我~~
推薦一個網站 Design lessons for everyone, curated by top designers
從最基礎的字體到界面體驗交互視覺找工作都有相關課程
沒想到這麼一個水答案也能混到不少贊,再推薦一個類似的網站吧
UX Booth | A User Experience Design Publication
請先去學好英語!
請先去學好英語!
請先去學好英語!
文章我已經給你寫好了,看不看就是你自己的事了。。
知乎專欄如何開始學UI?-UI中國-專業界面交互設計平台
公眾號:CreativeXchange
我是從小到大學的都是理工科,讀書的時候跟大部分人一樣,並沒有對自己的將來從事的職業有過規劃。之後到新加坡讀理工學院,學的是機械電子工程專業。三年學編程,機械設計,做機器人。我想讀書對於我來說,就是讓我知道自己喜歡和不喜歡什麼。相對於參照圖紙畫畫-,我發現自己更享受創造出作品的過程。
之後,收到墨爾本大學的藝術系的錄取通知書時候,掙扎了很久。我深知自己與那些專業學習藝術的學生的差距,雖然我喜歡跟藝術相關的事物,但我並沒有勇氣完全放棄我所學過的技能。最後,還是決定留在新加坡,讀的是南大的信息工程與傳媒。雖然是工程類的科系,但有30%課程跟藝術和傳媒有關,是不錯的試水機會。
1. 給自己一個理由開始自學
如果你只是自己偶爾去網上看看教程學習,是很難堅持的。我當初給自己的目標就是設計網站,開一個網店。那時候完全是對網頁設計一竅不通,連用什麼軟體,什麼語言寫都不懂。甚至熬夜了好幾天,只為了解怎麼連接上伺服器。之前作為門外漢,用的是Dreamweaver . 但其實現在網上有很多網頁設計的教學網站,值得推薦下:
-Codecademy. 這個網站提供互動式編程課程,用很流行的HTML或Ruby。課程按模塊安排,免費。
-Code School. 通過實踐課程學習,從四個學習方式中選擇一個,當那你完成一門課程,會得到一枚徽章。按月支付費用可以訪問全網,一些課程免費。
-Coursera. 提供知名大學的教學視頻,這是一個很大型且活躍的社區。課程免費,但如果你想要證書,就要另外收費。
2. 學會聽 學會看
任何時候,都需要多聽多學多看。我個人是喜歡逛博物館。新加坡大大小小的博物館都非常值得去。不需要強迫自己去不喜歡或者完全看不懂的. 本人最喜歡去的是ArtScience Museum,每次的展出項目都很值得去。(比如之前的達芬奇展和現在的夢工廠的動畫展)
- mad museum singapore 經常去烏節逛街的小夥伴們不防可以去這個畫廊看看。算是新加坡蠻獨一無二的另類藝術館。
-designsingapore 經常會有培訓課程,大部分是政府支付,所以基本都是免費的。
-theList 每周會定期發布跟創意有關的活動(從創業,書籍,設計都有),而且基本上也都是免費的.
3. 抓住任何練手的機會
大學時候,所有的選修課我都選擇與藝術和傳媒相關的科目(交互設計,網頁設計,攝影視頻…)大學社團選的也是報社,學習新聞採集,訪談和排版。上大學後,就並不那麼在意成績了,對於我來說,最重要的是多接觸自己感興趣,但卻鮮有機會嘗試的東西。所以,當初不少問我:學姐,哪些科目容易拿分。我真的不知道怎麼回答。
總體來說,就是要抓住任何機會去練手,並且學會整理成自己的作品。一開始,可以主動提出幫免費幫別人做設計。從設計logo,名片,T-shirt , 甚至是對現有網頁設計的優化設計也行。當作品積累到一定量之後,只選擇自己得意的作品收納到你的作品集中。作品集寧願少而精,也不要多而雜。
4. 尋找自己的方向
設計這個理念,實在太寬泛了。從平面設計,互動設計,室內設計,動畫設計。當你儘力去嘗試各種不同領域之後,試著靜下來心來,找好自己的方向。不然即使以後當了設計師,還只是一直幫別人排版修圖,那你當初對設計這個美好的願景也會在接下來的現實工作中破滅的。
當初在大學也是迷惘了很久,感覺自己什麼都學,但沒一樣專精。直到我上了一節課叫interactive design (交互設計),教授在課上分享很多人機交互體驗的作品(interactivedigital art installations ) 。學期末,我們用Arduino 和 processing 做了一件名為日晷的交互設計,並和同期的學員一起在新加坡科技藝術中心展出。那是我長久迷茫以來的第一次腦洞大開。以前想完全擺脫工科女的形象,但其實漸漸發現,科技和藝術其實一點都不衝突,在新科技的承載下,正孕育著許多新的藝術表現形式的可能。
說到這邊要介紹下 Arduino,是一款便捷靈活、方便上手的開源電子原型平台,包含硬體(各種型號的Arduino板)和軟體(Arduino IDE)。如果對於 「互動」有興趣的朋友們,可以拾起來耍耍。
最後讓我決定走上廣告這條路,是因為大四那年翹課飛去北京參加奧美的創意比賽。在那裡我看到了設計師如何天馬行空,工程師又如何將夢想照進現實。所以,其實不管在哪個行業,你有工程師的頭腦絕對是優勢,它會幫助你更理性更有條例地看待和解決問題。
另外,新加坡也有比較出名的青年創意比賽Cannes Lions International Festival of Creativity (工科生,可以試著參加新增的cyber這一項目)。我覺得得爭取去參加類似的活動, 不僅能結識志同道合的人,說不定還能遇到你今後藝術生涯的導師。
5. 工作中繼續學習
我畢業後的第一份工作,是在一家美國公司做手機的廣告。是的,就是有的人很討厭的彈出廣告。但我總會跟別人解釋說,我做得是那種「高端」的手機廣告。(其實就是有點類似現在微信很火的html5頁面)。那時候,相對於設計,更需要編程。從那時候起,算是正式接觸上廣告行業。
這裡想說的是,如果你不能馬上找到你理想中的工作職位,但也請盡量找類似的行業或者崗位。雖然走的是彎路,但你要相信,你這一路的積累是會有幫助和回報的。
我在第一份工作里就學習到很多,雖然一半的時間都是在編程,但是你卻能從中了解到互動設計時的可操作性和局限性。與此同時向周圍那些遠比我有天賦的設計師學習。
我當時的另一個癖好是在LinkedIn上搜尋喜歡的公司和人,與他們建立聯繫,詢問信息。同時,我喜歡去了解他們的職業軌道,也許他們晉陞的方式並不一定適用於你,但至少你可以試著去暢想和規劃屬於自己的設計師軌道。
在這之後,我跳槽到了現在4A廣告公司,設計範圍包括——網站、iPhone app、installationart 、社交媒體等。而我的優勢應該就在於知道如何與開發者協作。雖然工作上鮮有碰觸編程的機會,但在業餘時間,也還是會follow 新的科技和編程語言,隨時保持對創意的熱誠。
我的回答很短,只有五步:
先學交互,再學設計軟體,看大量設計案例,臨摹案例,原創設計。
1學交互:用app的時候看看人家的布局、功能。並自己用筆畫畫交互稿
↓
2看大量設計案例:http://huaban.com、http://dribbble.com、http://ui.cn 多看,看到你覺得自己眼高手低
↓
3看視頻和教程學習PS等設計軟體。
↓
4臨摹案例:寫實的擬物要臨摹、扁平的設計要臨摹、精彩的排版要臨摹
↓
5原創設計:自己做一些虛擬案例,並發布到論壇和群里接受其他同行的評價。
------------
書籍推薦:(等我慢慢補充,書在公司里- -)
這本《認知與設計》:講交互基礎的,內容比較接地氣。我覺得挺無聊的,經常看睡著。但是有用,特別是看了以後再玩app,會有一些理論基礎知識清晰地浮現。
原研哉的《設計中的設計》
這本書就是MUJI的設計師講設計,提升逼格看看(初學者一定要眼高手低)因為案例好看,比較看得進去。
推薦閱讀:
※有哪些小眾但很好的牛仔品牌?
※用一張紙能做出什麼 ?
※工作五年以上的 UI 設計師,你們都在幹什麼?
※地板顏色怎樣搭配家居比較好看?
※有哪些很完美的不對稱設計?