2024-2-1 資深UI設(shè)計者
進入設(shè)計這個行業(yè)也快一年了，這篇文章其實也算是寫給自己的一個總結(jié)。也望各位大佬，小弟如果有那些地方說不對，多多包涵，輕噴輕噴。廢話不多說了進入正題。
UI設(shè)計師簡稱UID（User Interface Designer），指從事對軟件的人機交互、操作邏輯、界面美觀的整體設(shè)計工作的人。
這個時候估計有的朋友回想，這些我都知道啊。百度一下就出來了。那么好的，咱們現(xiàn)在來具體的說一下什么是人機交互、操作邏輯、界面美觀。
人機交互，是一門研究系統(tǒng)與用戶之間的交互關(guān)系的學問。系統(tǒng)可以是各種各樣的機器，也可以是計算機化的系統(tǒng)和軟件。人機交互界面通常是指用戶可見的部分。用戶通過人機交互界面與系統(tǒng)交流，并進行操作。小如收音機的播放按鍵，大至飛機上的儀表板、或是發(fā)電廠的控制室。人機交互界面的設(shè)計要包含用戶對系統(tǒng)的理解（即心智模型），那是為了系統(tǒng)的可用性或者用戶友好性。
其實顧名思義，大家可以理解為用戶在某種特定的需求時，用何種方式能夠更方便更快捷的得到計算機的反饋。好比如有個客人來到某家酒店，而酒店有兩扇門，一扇門是不同的玻璃門另一扇則是自動門。說道這里我想大家多少都應(yīng)該理解了。同樣的兩扇門，自動門只需要客人走到指定的范圍能就可自由通過，而另一扇則需要客人走到門前后抬手去退才可打開。雖然僅僅是多了抬手這一部，但是前者對用戶更友好和方便。
例：
上面是我個人比較喜歡的一個游戲下載APP，其中用戶可以通過左右滑動手機即可快速的完成各個板塊之間的滑動切換，無需用戶在用手指去點擊下方的圖標。
我記得在我第一次接觸智能手機的時候，絕大部分的APP都是需要用戶去點擊指定的圖標才可完成板塊的切換。相對那時手機的屏幕相對較小，所以操作起來還算方便。但現(xiàn)今流行的各種大屏手機，絕大多數(shù)情況下用戶無法用一個手去完成想要的操作。那么這個時候身為設(shè)計師的咱們就想怎么去解決這個問題。而上面就是一個很好的例子。
說這么多其實我個人總結(jié)成一句話：“人機交互就是，如何讓用戶在任何情況和場合下，能夠更好更快更方便的，完成指定的操作與得到想要的結(jié)果。”
現(xiàn)在大家理解了人機交互，咱們再來說一下“操作邏輯”
操作邏輯可能對大部分新入的設(shè)計師來說可能很難理解。畢竟大家是學文科的居多，還有很多是從其他設(shè)計領(lǐng)域轉(zhuǎn)入UI這個行業(yè)的。所以平時大家可能更重視版式啦、配色啦、字設(shè)啦、品牌啦等平面上的知識。所以操作邏輯這個更偏向理科生的東西大家平時接觸相對較少。不過沒事，其實操作邏輯這個大家平時多看多想多思考也不是很難理解。
上面這張圖我想大家應(yīng)該都見過，有人管它叫交互圖，有人管它叫原型圖，甚至有人管他叫交互原型圖。管他叫啥反正大家記住這就是頁面直接的操作邏輯。
咱們來舉一個簡單的例子：把大象裝進冰箱需要幾部？（呵呵估計會有朋友噴我了……）
雖然這個例子很那個什么啊……你們懂得。但是這就是一個簡單的操作邏輯。打開冰箱門，把大象放進去，關(guān)上冰箱門。
現(xiàn)在估計會有朋友想原來這就是操作邏輯，太簡單了。確實這只是一個小小例子，如果換做一個電商平臺的購物邏輯呢？用戶怎么購買，加入購物車后怎么結(jié)算，結(jié)算時需要用戶跳轉(zhuǎn)到那幾個相應(yīng)的界面。用一種確認方式好，還是重復確認好。甚至到一個驗證碼的邏輯，是需要用戶短信驗證就行，還是需要用戶短信郵箱同時驗證的方式？那么這就涉及到各個頁面之間的操作邏輯。
而這個時候咱們就要考慮到，如何用更少的步驟去讓用戶完成這項任務(wù)。但是與此同時咱們還需要考慮到用戶的安全性與可靠性。（總不能隨便知道了密碼輸入了后就付款了地址電話啥也不填吧）
而且操作邏輯還不僅僅是頁面之間的關(guān)系，也涉及到用戶點擊了這個按鈕那么他會跳轉(zhuǎn)到那個頁面進行下一步的操作，又或者用戶側(cè)滑了一下頁面會轉(zhuǎn)換到那個板塊。而這個時候就要集合到咱們之前提到的人機交互了。用戶用什么手勢來完成這步的操作，是左右滑動還是上下滑動，還是點擊。
所以呢操作邏輯與人機交互是相互結(jié)合的，但是呢人機交互是建立在操作邏輯之上的，首先咱們必須要梳理清楚頁面直接的關(guān)系，才能去具體的考慮讓用戶用何種方式去操作。在沒有操作邏輯之前，各位所想的任何人機交互都是無用功。
所以大家一定要切記先梳理操作邏輯，在開始其他設(shè)計。
好啦現(xiàn)在是大家熟悉的界面美觀這塊。我想這么不用我多說大家也了解。很明了就是讓用戶看著好看舒服想用。
其實呢相對也不是那么簡單。大家平時看的平面作品還是居多，但是在UI的界面美觀這里，不僅僅是一個放在那里不動的界面。它還會涉及到交互方式的動態(tài)效果。也就是人機交互。有人朋友可能就像，剛剛我不是說了人機交互就是用戶怎么操作完成相對的頁面跳轉(zhuǎn)等。
其實呢，人機交互也是需要設(shè)計美觀度的，比如下圖的按鈕。
這是一組收藏按鈕，這里它就涉及到首先是操作邏輯和人機交互，用戶點擊這個按鈕內(nèi)容被收藏到收藏夾。那么這個時候就來了，既然用戶收藏了這個內(nèi)容，也就表示無需再次收藏。那么這個時候這個按鈕就會變成，用戶再次點擊則取消收藏。
可能在大部分用戶眼里這是一個按鈕，其實大家可以理解為這是2個不同的按鈕。但是形狀相同。那么這個時候咱們就想，怎么才能讓在按鈕不改變基礎(chǔ)形狀的時候，能夠使用戶更好的理解這2個按鈕是不同的功能。所以咱們就把一個按鈕做成無填充，另一個則是由填充的。
而這組圖片則是用戶頂部下拉時刷新的效果，如果下拉后提示也沒有，那么用戶很有可能就不清楚這個下拉功能到底是干什么的。如果咱們加一個簡單的文字或者圖標，想用戶提示用戶絕大多是情況下都會清楚“哦這是下拉刷新加載最新信息。”
通過上面的2個例子，大家也大致清楚了。UI的界面美觀，不僅僅是一個靜態(tài)的美觀，而靜態(tài)和動態(tài)相互結(jié)合的界面。但是呢對于大部分UI新人來說還是需要先做好靜態(tài)的頁面，再去考慮動態(tài)的效果這樣才能錦上添花。
說了這么多我想大家也清楚什么是UI設(shè)計師了。那么咱們來說說UI設(shè)計都分為哪幾類。
前面也提到了UI設(shè)計是人機交互設(shè)計、操作邏輯設(shè)計、界面美觀設(shè)計。相對來說這個很籠統(tǒng)。大家平時用的PS AI也包括這三項，而咱們平時用的APP，看的網(wǎng)頁也包括這三種。
那么UI設(shè)計到底分為幾類？我個人認為分為4類，移動應(yīng)用設(shè)計、網(wǎng)頁設(shè)計、游戲界面設(shè)計、軟件界面設(shè)計。
沒錯，可能有的朋友會想為什么網(wǎng)頁、游戲、軟件也算在里面？下面咱們一個個來說。
通過名稱大家應(yīng)該就知道，其實就是咱們平時用的APP、應(yīng)用主題（各類圖標）、甚至還有第三方桌面等。這都屬于移動應(yīng)用設(shè)計，而現(xiàn)在大部分物聯(lián)網(wǎng)公司，都是以APP開發(fā)為主。所以現(xiàn)在移動應(yīng)用設(shè)計還是趨向APP設(shè)計。不過你要是在一個甲方公司那么很有可能會設(shè)計到應(yīng)用主題和其他類型的設(shè)計。但是終歸脫離不了移動設(shè)備比如手機，平板電腦，甚至現(xiàn)在大部分電視也是使用的移動應(yīng)用軟件。
網(wǎng)頁設(shè)計雖然主要應(yīng)用是PC端，但是不要忘記它也是智能終端，雖然國家統(tǒng)計更多的人再用手機上網(wǎng)。但是不要忘記了，真正到了辦公的時候又有多少人用手機辦公。而在辦公時又有多少人用手機查閱資料。與此同時網(wǎng)頁設(shè)計，也涉及到了UI設(shè)計的三大設(shè)計人機交互、操作流程、界面美觀。所以他們都是同屬于UI設(shè)計的范疇。而隨著科技的飛速發(fā)展，產(chǎn)品的推廣方式更原化，很多移動應(yīng)用也有自己的PC終端。與此同時，很多PC網(wǎng)頁也在適應(yīng)時代的潮流盡量自適應(yīng)移動終端的標準。使用戶能有更好的體驗。
游戲設(shè)計，很多朋友會說。網(wǎng)頁和APP這2個現(xiàn)在確實可以理解了，那么為什么游戲也算在UI設(shè)計里呢？
首先大家要知道，游戲在沒有界面之前就是一堆數(shù)字，給你一堆數(shù)字你會玩嗎？就會你會玩，你知道怎么玩嗎？這個時候就需要咱們UI設(shè)計師來根據(jù)產(chǎn)品需求為這堆看著就頭疼的數(shù)字化個妝。這樣才能吸引更多的玩家來玩，而這個過程就是UI設(shè)計。
如果大家理解了游戲設(shè)計，那么軟件設(shè)計這里就很好說了。顧名思義其實和游戲設(shè)計一樣。只不過一個是靠娛樂運營，一個是靠辦公應(yīng)用，家庭應(yīng)用等方便大家來運營。很簡單的例子：咱們用的PS也都是靠一堆數(shù)字代碼搭建出來的，而如果想讓用戶理解怎么使用它那么就需要一個界面在做這個橋梁。所以我個人認為軟件設(shè)計也在UI設(shè)計的范疇內(nèi)。
通過前面的了解，大家對UI的定位應(yīng)該有了最基本的了解了。但是呢，估計又得朋友回想，這不是都包括UE和PM的工作內(nèi)容了嗎？沒錯因為UI、UE、PM這3個崗位是互相串聯(lián)的，相輔相成的。
所以呢既然大家要想成為一個出色的UI設(shè)計師。不光要界面做的美觀好看。也要了解其他兩個方面的知識內(nèi)容再次基礎(chǔ)上繼續(xù)細化咱們的界面和產(chǎn)品，從而達到使產(chǎn)品能夠提升到一個更高的層面。
而且，我通過各大國外設(shè)計論壇了解到，國際趨勢也是漸漸地吧UE和PM的工作融合到UI的范疇內(nèi)。我個人的觀點是，這樣做有助于產(chǎn)品思路的一致性，我想大家都體驗過背后站一堆甲方爸爸的感受。畢竟參與的人越多，產(chǎn)品的設(shè)計思路越有可能被打亂。從而造成，項目開始時設(shè)定的是圓形，最后結(jié)束的時候可能變成六邊形。這樣就偏離的設(shè)計初心，造成不倫不類的情況。
說了這么多大家應(yīng)該也了解了UI設(shè)計。我個人總結(jié)UI設(shè)計呢就是。我們是產(chǎn)品和用戶之間的橋梁。站在產(chǎn)品的角度去理解，坐在用戶的身邊去體驗，跟在技術(shù)的領(lǐng)域去思考。
設(shè)計這個行業(yè)是一個學無止境的行業(yè)，只有大家保持著一顆熱愛而虔誠的心，才有可能走得更遠更高。
最后，希望這篇文章能夠幫助到，想進入UI或者已經(jīng)進入UI行業(yè)的朋友們。本人僅是一個29歲才入行的咸魚，也望各位大佬大神手下留情，如有錯誤也望多多指點。
藍藍設(shè)計(m.sillybuy.com )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計、B端界面設(shè)計、桌面端界面設(shè)計、APP界面設(shè)計、圖標定制、用戶體驗設(shè)計、交互設(shè)計、UI咨詢、高端網(wǎng)站設(shè)計、平面設(shè)計，以及相關(guān)的軟件開發(fā)服務(wù)，咨詢電話：01063334945。
關(guān)鍵詞：UI咨詢、UI設(shè)計服務(wù)公司、軟件界面設(shè)計公司、界面設(shè)計公司、UI設(shè)計公司、UI交互設(shè)計公司、數(shù)據(jù)可視化設(shè)計公司、用戶體驗公司、高端網(wǎng)站設(shè)計公司
銀行金融軟件UI界面設(shè)計、能源及監(jiān)控軟件UI界面設(shè)計、氣象行業(yè)UI界面設(shè)計、軌道交通界面設(shè)計、地理信息系統(tǒng)GIS UI界面設(shè)計、航天軍工軟件UI界面設(shè)計、醫(yī)療行業(yè)軟件UI界面設(shè)計、教育行業(yè)軟件UI界面設(shè)計、企業(yè)信息化UI界面設(shè)計
軟件qt開發(fā)、軟件wpf開發(fā)、軟件vue開發(fā)
藍藍設(shè)計的小編 http://m.sillybuy.com