網站伴随着互聯網的(Of)快速發展而快速興起，作(Do)爲(For)上網的(Of)主要(Want)依托，加上使用(Use)網絡的(Of)頻繁而變得非常的(Of)重要(Want)。企業需要(Want)通過網站呈現産品、服務、理念、文化，或向大(Big)衆提供某種功能服務。網頁設計必須首先明确設計站點的(Of)目的(Of)和(And)用(Use)戶的(Of)需求，從而做出(Out)切實可行的(Of)設計方案。
今天抽空來(Come)說說大(Big)家比較關心的(Of)問題，就是所謂的(Of)設計原則。很多人(People)把設計原則都想得很複雜，還别說，它真的(Of)挺複雜，但是對我(I)來(Come)說它就是四點：
清晰
流暢
統一(One)
美觀
重要(Want)性也是按這(This)個(Indivual)順序來(Come)排列，那麽下面我(I)們一(One)點點來(Come)說說。
清晰
何爲(For)清晰?對任何産品而言，界面“清晰”是最爲(For)重要(Want)的(Of)一(One)點。人(People)們必須能夠辨别出(Out)它是什麽，才能有效地使用(Use)你設計出(Out)來(Come)的(Of)産品。而在(Exist)設計的(Of)過程中相信大(Big)家經常會被産品的(Of)需求搞得蒙圈，最後出(Out)來(Come)一(One)個(Indivual)亂得連自己都會吐槽的(Of)界面。設計師在(Exist)設計産品時(Hour)，真正要(Want)做的(Of)應該是去關心用(Use)戶使用(Use)産品的(Of)原因，去預測并觀察用(Use)戶使用(Use)産品時(Hour)的(Of)行爲(For)然後快速做出(Out)反饋。
産品在(Exist)設計之初就應該定位清晰，明确自己的(Of)受衆群體，設計出(Out)符合目标用(Use)戶的(Of)産品。這(This)樣才能留住用(Use)戶，讓用(Use)戶對産品更有期待。
但是每類應用(Use)的(Of)需求不(No)同，受衆群體也不(No)同，所以(By)每個(Indivual)設計師在(Exist)設計産品時(Hour)都會糾結怎麽把産品做到(Arrive)清晰。比如攝影産品，打開就是快門和(And)取景框，相信大(Big)家都懂得怎麽用(Use)，這(This)類工具類應用(Use)很簡單的(Of)就能做到(Arrive)清晰。再說社交類應用(Use)，微信打開界面大(Big)家都能知道聊天框和(And)标簽欄的(Of)作(Do)用(Use)，這(This)類産品說難也不(No)難，畢竟同類産品還是很多的(Of)。其實最難做好的(Of)，還是購物類應用(Use)，不(No)知道爲(For)什麽，這(This)類産品總是喜歡把界面元素設計得又多又亂才肯罷休，可能是我(I)們的(Of)文化背景和(And)生(Born)存環境導緻的(Of)吧。但是話說回來(Come)，這(This)麽多類應用(Use)都要(Want)根據自己的(Of)産品定位來(Come)設計，每個(Indivual)産品定位的(Of)清晰性都是不(No)同的(Of)。
所以(By)要(Want)做到(Arrive)産品設計清晰，必須讓目标用(Use)戶在(Exist)符合産品條件的(Of)基礎上，去正确的(Of)理解産品界面。不(No)需要(Want)思考就對界面的(Of)設計有所了解;或者是讓用(Use)戶通過産品簡單的(Of)提示或幫助說明，就能夠理解産品界面，并進行使用(Use)。
要(Want)做到(Arrive)這(This)點就要(Want)讓用(Use)戶知道自己目前處于(At)什麽位置，并知道自己能幹什麽或要(Want)幹什麽。其實這(This)些說起來(Come)很簡單，但是要(Want)做到(Arrive)卻并不(No)容易，所以(By)對用(Use)戶的(Of)研究必不(No)可少，讓産品定位精準，明确目标用(Use)戶等等，都是非常重要(Want)的(Of)步驟。這(This)也是爲(For)什麽清晰是産品設計原則中最重要(Want)的(Of)原因。如果能做到(Arrive)這(This)點，即使頁面再多，也不(No)會讓用(Use)戶覺得不(No)知所措。(當然頁面數量還是有點影響的(Of))
流暢
在(Exist)保證了産品界面清晰的(Of)前提下，界面的(Of)流暢性可以(By)讓用(Use)戶和(And)産品之間産生(Born)良好的(Of)互動。一(One)個(Indivual)優秀的(Of)産品，在(Exist)用(Use)戶使用(Use)的(Of)過程中不(No)僅不(No)需要(Want)複雜的(Of)學習就能使用(Use)，而且還能高效的(Of)使用(Use)。
如何保證流暢性?很簡單，就是突出(Out)産品的(Of)核心。
我(I)們生(Born)活在(Exist)一(One)個(Indivual)快速發展的(Of)時(Hour)代，做任何事情都容易被打擾，導緻過程中斷。所以(By)想要(Want)留住用(Use)戶，必須讓用(Use)戶沒有負擔且幫助用(Use)戶快速完成任務。這(This)樣才能赢得用(Use)戶的(Of)尊重。
想必所有人(People)都在(Exist)網上買過東西，不(No)說遠的(Of)，就說說外賣。每當我(I)們打開一(One)款外賣App看到(Arrive)最多的(Of)永遠是商家吧?這(This)些商家的(Of)排序是從距離最近的(Of)到(Arrive)距離最遠的(Of)，然後排除無法送達的(Of)。其實我(I)想說：用(Use)戶會關心距離遠近麽?不(No)要(Want)每次讓用(Use)戶打開你們的(Of)App時(Hour)都是出(Out)現一(One)樣的(Of)排序，記住用(Use)戶點餐時(Hour)商家的(Of)記錄以(By)及篩選出(Out)類似的(Of)商家排在(Exist)前面才是用(Use)戶關心的(Of)。這(This)樣不(No)至于(At)每次打開App都要(Want)去重新搜索或翻半天記錄或者是找訂單。如果用(Use)戶記不(No)住商家名稱呢?如果用(Use)戶不(No)想點這(This)家的(Of)但是想點同類的(Of)食物呢?
保持使用(Use)流暢的(Of)另一(One)個(Indivual)說法就是高效。讓用(Use)戶快速的(Of)完成任務，才是App存在(Exist)的(Of)理由。也不(No)要(Want)以(By)爲(For)用(Use)戶點了下單就不(No)想删減購物車的(Of)東西，留個(Indivual)路口讓用(Use)戶删減多餘的(Of)商品而不(No)是返回去重新操作(Do)。
流暢不(No)是讓用(Use)戶别無選擇的(Of)去執行你設計的(Of)任務，而是引導用(Use)戶去做正确的(Of)選擇。不(No)要(Want)害怕讓用(Use)戶掌握一(One)切，也不(No)要(Want)覺得你的(Of)設計就是顯而易見，這(This)世上從來(Come)沒有顯而易見的(Of)事情存在(Exist)。
統一(One)
讓頁面保持一(One)緻性。很多設計師在(Exist)設計産品時(Hour)，都會把統一(One)性抛之腦後。統一(One)性在(Exist)設計過程中至少要(Want)做到(Arrive):視覺、交互、結果統一(One)。這(This)樣不(No)僅可以(By)降低用(Use)戶學習成本，還能讓開發節省不(No)少時(Hour)間來(Come)做那些必要(Want)的(Of)東西。
經常有人(People)會問一(One)些關于(At)界面設計的(Of)問題。而發出(Out)來(Come)的(Of)界面很多時(Hour)候都是前後不(No)統一(One)，上個(Indivual)界面的(Of)下一(One)步還在(Exist)左邊，到(Arrive)了下個(Indivual)頁面就到(Arrive)了右邊了，問他(He)原因就說：這(This)個(Indivual)界面的(Of)排版這(This)樣放更好看點。其實這(This)樣的(Of)回答很不(No)專業。
在(Exist)做産品時(Hour)，統一(One)性是非常重要(Want)的(Of)，它是清晰和(And)流暢的(Of)結果，要(Want)求做到(Arrive)自然而然的(Of)效果。能夠通過巧妙的(Of)布局，來(Come)降低用(Use)戶的(Of)認知負擔。相信大(Big)家都聽過一(One)句話：好的(Of)設計都是看不(No)見的(Of)。這(This)裏說的(Of)不(No)是真的(Of)看不(No)見(要(Want)真看不(No)見還搞啥)，而是說讓用(Use)戶察覺不(No)到(Arrive)它的(Of)存在(Exist)是多餘的(Of)。要(Want)做到(Arrive)統一(One)不(No)僅要(Want)做到(Arrive)均衡的(Of)構圖，讓畫面整體具有穩定性，還要(Want)透出(Out)空間感，不(No)會使得用(Use)戶覺得在(Exist)使用(Use)的(Of)過程中産生(Born)擁擠的(Of)念頭。而創新并給用(Use)戶帶來(Come)驚喜就是後話了。
美觀
其實美觀沒什麽好說的(Of)，因爲(For)每個(Indivual)人(People)對它認知是不(No)同的(Of)。新人(People)覺得美觀是把一(One)個(Indivual)界面做到(Arrive)漂亮;而資深設計師就知道美觀是讓界面的(Of)設計無瑕疵，整齊，細節完美。
簡單來(Come)說說美觀的(Of)幾個(Indivual)方面:
文字：一(One)個(Indivual)界面要(Want)做到(Arrive)信息閱讀流暢，符合人(People)們閱讀習慣。
顔色：不(No)要(Want)爲(For)了突出(Out)設計感，就采用(Use)誇張的(Of)顔色來(Come)設計，有時(Hour)候簡單的(Of)搭配反而更能體現出(Out)産品的(Of)功能。
圖标：大(Big)家都說一(One)個(Indivual)交互設計師的(Of)功底是看交互設計文檔，那麽一(One)個(Indivual)UI視覺設計師的(Of)功底看什麽呢?沒錯，就是圖标。
布局：有時(Hour)候一(One)個(Indivual)界面的(Of)布局好壞不(No)能完全看交互設計師，這(This)裏面視覺的(Of)設計至關重要(Want)，即使做得再爛的(Of)布局都是可以(By)通過視覺設計師來(Come)逆轉乾坤的(Of)(不(No)包括搗亂的(Of)那些孩子)。
再提一(One)個(Indivual)點，動效，當然動效也屬于(At)美觀中的(Of)一(One)種。近年非常流行動效，很多設計師沉迷其中，然後在(Exist)自己的(Of)産品中加入各式各樣的(Of)動效。其實，動效是是一(One)把雙刃劍，這(This)裏也不(No)詳說了，大(Big)家有需要(Want)我(I)可以(By)單獨出(Out)一(One)篇動效的(Of)文章。隻要(Want)在(Exist)設計的(Of)過程中把控好度，動效是可以(By)起到(Arrive)美化産品的(Of)作(Do)用(Use)的(Of)。
總結
設計絕不(No)是簡單的(Of)拼合，排列甚至編輯;設計是通過闡明，簡化、明确、修飾，使之莊嚴，有說服性，甚至帶一(One)點趣味性，來(Come)賦予其價值及意義。說完上面這(This)四個(Indivual)原則，大(Big)家可以(By)聯系自己的(Of)産品去想想是不(No)是這(This)麽回事。清晰>流暢>統一(One)>美觀，一(One)個(Indivual)好的(Of)産品一(One)定是按照這(This)個(Indivual)順序來(Come)設計産品的(Of)。在(Exist)做設計之前一(One)定要(Want)理解需求再下手，如果你的(Of)界面已經滿足需求，就不(No)要(Want)再加入其它元素了，千萬不(No)要(Want)覺得頁面太簡單東西太少，我(I)就要(Want)加入其它東西來(Come)充實，這(This)樣很傻。
如果之前沒有考慮到(Arrive)這(This)四個(Indivual)點來(Come)做設計，那從現在(Exist)開始好好想想自己應該怎麽入手。
清晰，理解需求;流暢，明确用(Use)戶目标;統一(One)，界面元素保持一(One)緻;美觀，做到(Arrive)簡約而不(No)簡單。
