ui設(shè)計包括那些內(nèi)容

　　ui設(shè)計包括那些內(nèi)容？UI設(shè)計師的工作大體包括兩個方面：一是圖形設(shè)計，包括軟件產(chǎn)品中所有能看到的界面、圖標、插畫等;二是交互設(shè)計，主要在于設(shè)計軟件的操作流程。具體的工作流程在不同的團隊存在一定差異，主要有以下幾個方面：

　　整理需求
 

　　在設(shè)計工作開始之前先需要了解產(chǎn)品的需求。通過產(chǎn)品經(jīng)理提供的產(chǎn)品文檔，或者直接與用戶溝通獲得。而這些需求往往是零碎甚至復(fù)雜的，設(shè)計師需要從中整理出產(chǎn)品背后的用戶需求層次和潛在邏輯，找出用戶痛點癢點，以便針對具體問題通過設(shè)計解決。
 

　　這里推薦日本著名設(shè)計師，佐藤可士和的《超整理術(shù)》。可以幫助你在凌亂的信息中抽絲剝繭，厘清思路。
 

　　低保真交互
 

　　在整理出產(chǎn)品需求之后，我們就要把它們記錄下來，制作出低保真交互。
 

　　可以將軟件中的界面通過最簡單直接的方式繪制出來，并用線條連接以表明每個頁面之間的關(guān)系。通過這種方式，可以初步把產(chǎn)品的交互原型一步步描繪出來，這其中可能會伴隨反復(fù)的修改甚至推翻從來，所以對設(shè)計師的耐心和專業(yè)能力都是比較嚴苛的考驗。
 

　　很多團隊總是有一個誤區(qū)，就是上來就說出一個想法，立刻就讓設(shè)計師做出高保真效果圖，這種方式可以說是設(shè)計師的噩夢，因為通過低保真設(shè)計稿勾勒出大概布局和交互，修改起來非常容易;而高保真設(shè)計圖卻需要耗費非常多的時間和精力，在不確定的情況下匆匆設(shè)計高保真是非常不明智的選擇，往往會造成設(shè)計團隊精力的巨大浪費，并影響整個項目的進度。
 

　　搭建交互原型市面上有很多產(chǎn)品，筆者最常用的是摹客原型，這是一款免費的在線設(shè)計產(chǎn)品，簡單明了，支持多人協(xié)作，對效率提升非常明顯。
 

　　界面設(shè)計
 

　　終于到了設(shè)計師大展身手的時候了!界面設(shè)計主要包括確認視覺風格，典型界面設(shè)計，字體設(shè)計，圖標設(shè)計，制定規(guī)范批量輸出界面設(shè)計等。設(shè)計師在這一階段有較多的發(fā)揮空間，通過之前對產(chǎn)品的理解，對界面的大小、位置、版式、顏色等等制定標準。但低保真交互原型是需要服從的，因為這是整個團隊討論的結(jié)果。
 

　　動效設(shè)計
 

　　新生代的互聯(lián)網(wǎng)產(chǎn)品，大量地融合了交互動效，也是各類競品的重要亮點之一，所以懂得交互動效對新時代的設(shè)計師們來說，也是必備的能力之一。
 

　　開發(fā)還原檢查
 

　　不是設(shè)計稿完成設(shè)計師就可以休息了。產(chǎn)品上線之前最重要保證最終落地的效果和品質(zhì)。開發(fā)還原的過程中，程序員們可能會遇到各種潛在的問題，這個時候和他們保持溝通和配合是非常必要的。
 

　　傾聽用戶
 

　　這可能不是UI設(shè)計師的本職工作，但是筆者認為設(shè)計師有必要去了解。從用戶的評論和反饋中，往往能發(fā)現(xiàn)設(shè)計師容易忽略的問題，通過對這些問題的改進正是我們提升產(chǎn)品和設(shè)計能力的最好途徑。
 

　　做設(shè)計的人基本都有這些特質(zhì)：有發(fā)現(xiàn)美的眼光;勇于創(chuàng)新;敢于想象;善于動手實踐;能夠接受新鮮事物;對新潮流，新趨勢充滿好奇，有一顆熱愛設(shè)計的心的人都適合。
 

　　UI設(shè)計按用戶和界面來分可分成四種UI設(shè)計。
 

　　分別是PC端UI設(shè)計，移動端UI設(shè)計，游戲UI設(shè)計，以及其它UI設(shè)計。
 

　　PC端UI設(shè)計
 

　　PC端UI設(shè)計，也就是電腦用戶，界面指的就是電腦上的操作界面。像電腦版的QQ，微信，PS等軟件和網(wǎng)頁的一些按鈕圖標等。
 

　　移動端UI設(shè)計
 

　　移動端UI設(shè)計，也就是手機用戶，界面指的就是手機界面，也就是說手機上的所有界面都是移動端UI設(shè)計。比如微信聊天界面，QQ聊天界面，手機桌面 。
 

　　游戲UI設(shè)計
 

　　游戲UI設(shè)計，用戶也就是游戲UI用戶，界面指的是游戲中的界面，像手游王者榮耀，端游英雄聯(lián)盟和一些其它游戲中的界面，登錄界面、個人裝備屬性界面也都是屬于游戲UI設(shè)計。
 

　　第四種：其它UI設(shè)計
 

　　像VR界面、AR界面、ATM界面、一些智能設(shè)備的界面，比如智能電視、車載系統(tǒng)等等，用戶較少，但又需要，未來有可能很火，有可能保持現(xiàn)狀。
 

　　UI設(shè)計師的職能大體包括三方面：
 

　　圖形設(shè)計
 

　　即傳統(tǒng)意義上的“美工”。當然，實際上他們承擔的不是單純意義上美術(shù)工人的工作，而是軟件產(chǎn)品的產(chǎn)品“外形”設(shè)計。
 

　　交互設(shè)計
 

　　主要在于設(shè)計軟件的操作流程、樹狀結(jié)構(gòu)、操作規(guī)范等。一個軟件產(chǎn)品在編碼之前需要做的就是交互設(shè)計，并且確立交互模型，交互規(guī)范。
 

　　用戶測試/研究
 

　　這里所謂的“測試”，其目標恰在于測試交互設(shè)計的合理性及圖形設(shè)計的美觀性，主要通過以目標用戶問卷的形式衡量UI設(shè)計的合理性。如果沒有這方面的測試研究，UI設(shè)計的好壞只能憑借設(shè)計師的經(jīng)驗或者領(lǐng)導(dǎo)的審美來評判，這樣就會給企業(yè)帶來極大的風險。
 

　　軟件只是一個工具，千萬不要覺得會了軟件就會了設(shè)計，不要太依靠軟件了，會了工具后還要學(xué)習理論知識才能成為一個合格的設(shè)計師。
 

　　常見的UI設(shè)計界面
 

　　啟動頁
 

　　首次打開使用app時一般會彈出一個啟動頁面，這也是是影響用戶第一印象的重要因素，這種最初的愉悅體驗很有可能讓這款app流行起來。這就是為什么要格外重視啟動頁的原因。
 

　　啟動頁是用戶打開APP時看到的第一個界面，它們通常很簡潔，往往是一個logo、app的名稱或者是這個產(chǎn)品的一句slogan，呈現(xiàn)在用戶眼前。
 

　　為了確保啟動頁在各個不同分辨率的屏幕上適配良好，UI視覺設(shè)計師們常常會把它們放在屏幕的中間位置或者底部位置。
 

　　啟動頁的建議顯示時間是4~8秒之間，超過這個區(qū)間，用戶可能會感覺厭煩。此外，最好顯示加載進度，這樣一些不耐煩的用戶就會知道還要多久才可以進入app。
 

　　引導(dǎo)頁
 

　　引導(dǎo)頁是APP可能提供給新用戶的一組介紹產(chǎn)品功能、特性以及優(yōu)點的界面，它們在用戶首次使用的時候加載。幫助用戶熟悉它的控件和對應(yīng)功能，讓用戶更好的上手使用，并且?guī)椭脩襞袛噙@款軟件是否有用。
 

　　雖然每一款app的結(jié)構(gòu)和內(nèi)容都是非常獨立的，然而它們的引導(dǎo)頁還是有一些相同的設(shè)計趨勢。而很多引導(dǎo)頁都習慣于用插畫的形式來表現(xiàn)他們的新特性或者優(yōu)點，這對用戶很有吸引力，同時開發(fā)成本也很低。
 

　　設(shè)計師們也常常會為app創(chuàng)建一個卡通形象，用它來模擬真實的使用場景，將它作為一種連接用戶與app的情感紐帶。還有引導(dǎo)頁的文案也是十分重要的，它應(yīng)該是簡短的、有幫助的并且具有可讀性。
 

　　Dating App
 

　　數(shù)據(jù)統(tǒng)計界面
 

　　很多app都包含數(shù)據(jù)統(tǒng)計界面。它提供的數(shù)據(jù)越多，設(shè)計難度就越大。設(shè)計師需要確保所有的重要數(shù)據(jù)在屏幕上都是清晰可見并且有用的，曲線圖、比例尺和統(tǒng)一的icon可以使整個界面看上去很流暢、很整潔。
 

　　此外，數(shù)據(jù)統(tǒng)計界面需要為不同的數(shù)據(jù)劃分不同的區(qū)域，以方便用戶閱讀。
 

　　Bright Vibe Calendar App
 

　　電商類app界面 產(chǎn)品列表頁
 

　　所有的電商平臺主要目的都是為了銷售產(chǎn)品，它的視覺設(shè)計對用戶的決策有很大的影響。產(chǎn)品列表是公司銷售的一系列商品。設(shè)計師的工作是設(shè)計一個可以吸引用戶并且鼓勵他們購買商品的頁面。
 

　　移動端的產(chǎn)品列表也可以像一些web端的電商平臺一樣，將產(chǎn)品類目放置在一個容器中，可以通過上滑來查看，一行中放置的產(chǎn)品數(shù)量應(yīng)該根據(jù)屏幕寬度來決定。
 

　　Cafe Coupon app
 

　　產(chǎn)品詳情頁
 

　　這個界面是給那些想要進一步的人，提供更多關(guān)于產(chǎn)品的信息，它用來展示產(chǎn)品的一些主要信息，以此來幫助用戶決定他們是否真的需要這個產(chǎn)品。
 

　　設(shè)計師一般將產(chǎn)品的展示圖片放在屏幕中央，相關(guān)描述放在圖片下方。設(shè)計師可以將尺寸、材質(zhì)或者其他數(shù)據(jù)分成不同的模塊，以便用戶可以輕松的找到他們所需要的信息
 

　　珠寶電商app
 

　　確認支付頁面
 

　　如今越來越多的人愿意使用智能手機線上支付，各大公司紛紛對這一環(huán)節(jié)開始加以重視，力求打造最便捷的支付體驗。
 

　　支付是用戶購買商品的最后一步，設(shè)計師的職責是讓用戶在使用的過程中感覺舒服。首先，確認支付頁面的必有的部分是一個表單，用來填寫一些個人信息，諸如姓名、銀行卡賬號此類。
 

　　填寫信息類別取決于用戶在何地產(chǎn)生購買行為。此外，至關(guān)重要的一點是讓用戶知道他個人信息是安全的。所以設(shè)計師必須通過一些視覺元素讓用戶知道這些信息不會被泄露出去，令他們安心。
 

　　可以使用一系列已經(jīng)約定俗成的icon，它們被賦予了特定意義，并且經(jīng)過了大公司的檢驗。
 

　　Cinema app
 

　　社交軟件界面 列表頁
 

　　人們常常使用各種各樣的社交軟件聊天或者瀏覽動態(tài)，列表頁是一個連續(xù)不斷的頁面，包含用戶想要瀏覽的動態(tài)或者其他消息。
 

　　實踐表明，移動端的用戶喜歡快速的瀏覽列表頁，這就是為什么他們需要一個簡潔清爽的視覺設(shè)計的原因，不要加載過多的視覺元素。
 

　　信息可以通過用戶滑動屏幕，逐個呈現(xiàn)，確保導(dǎo)航欄清晰可觸，一屏中的最后一條信息應(yīng)該被部分顯示。
 

　　Music app
 

　　播放頁
 

　　人們可以通過它來控制自己聽到的歌曲，該功能包括切歌、暫停和播放，這里需要醒目、易于識別的button。
 

　　這一部分通常放在屏幕底部中央，上方主要部分放置一個與歌曲相關(guān)的圖片，但是也有一些設(shè)計師會在此區(qū)域做一些音樂可視化的動效，這對于設(shè)計師來說是展示想象力和創(chuàng)造力的好機會。
 

　　ECHO app
 

　　現(xiàn)如今，移動端app快速發(fā)展，每天都有大量的新商品出現(xiàn)，它們在解決用戶新型需求的同時也產(chǎn)生了很多新型界面，設(shè)計師應(yīng)該做好準備面臨這一挑戰(zhàn)，一直保持創(chuàng)新精神，從啟發(fā)中迸發(fā)靈感。
 

　　同時，個性化設(shè)置數(shù)據(jù)也是所有社交網(wǎng)絡(luò)app的關(guān)鍵部分，它引導(dǎo)用戶進入虛擬社區(qū)網(wǎng)絡(luò)，并且開始與其他人進行分享。設(shè)計師的主要任務(wù)就是通過流暢的UX設(shè)計，使這一步驟盡可能的方便友好。據(jù)交互設(shè)計組織所說。
 

　　設(shè)計師首要考慮的是，個性化設(shè)置界面應(yīng)該清晰明確，展示的信息數(shù)量應(yīng)該限制在一定范圍內(nèi)。否則整個界面看上去會很亂很復(fù)雜同時要時刻確保導(dǎo)航欄清晰可見，這樣用戶就不用花費太多精力去摸索app。
 

　　個性化設(shè)置界面的設(shè)計應(yīng)該以目標受眾為主導(dǎo)，如果想要你的app滿足用戶的使用需求，那么用戶研究是必不可少的。
 

　　UI設(shè)計包括的東西很多，如果你現(xiàn)在是零基礎(chǔ)或者是想轉(zhuǎn)行學(xué)好UI設(shè)計，最好的學(xué)習方式就是報班系統(tǒng)學(xué)習，學(xué)的全面，學(xué)的專業(yè)，學(xué)完就業(yè)薪資高，只有不斷提升自己，提高收入水平，才能擁有更好的生活。