大腦在處理和組織看到的信息時會使用一套快捷方法，了解這些方法是設(shè)計成功的關(guān)鍵要素。本文介紹了十一條有效的設(shè)計準(zhǔn)則，用形象的圖解幫助讀者更好地理解設(shè)計準(zhǔn)則在設(shè)計工作中的運(yùn)用，幫助你利用這些方法更快捷地開展設(shè)計。適合關(guān)注產(chǎn)品設(shè)計的小伙伴閱讀。
感知力是大腦將不同的信息連接和組織成一個連貫整體的機(jī)制。例如我們將相似的對象分組并連接起來，能夠輕松地區(qū)分出不屬于該組的對象。
大腦在處理和組織看到的信息時會使用一套快捷方法，了解這些方法是設(shè)計成功的關(guān)鍵要素。
在UI設(shè)計時，我們應(yīng)該有意識地運(yùn)用感知力，用足夠的事實(shí)來驗(yàn)證設(shè)計，有依有據(jù)地解釋為什么這個圖形元素要這樣設(shè)計？背后的原因是什么？
提升感知力有助于清晰地解釋設(shè)計方案，避免常見的設(shè)計錯誤，引導(dǎo)我們將設(shè)計做得更好、更容易理解！
彼此靠近的元素會被自動理解為一組。把它們的位置放得更遠(yuǎn)，會給人一種這些元素是完全獨(dú)立的個體的印象。
在UI設(shè)計中，可以利用鄰近原則將相似的界面元素組合在一起，把控總體布局。
鄰近規(guī)則適用于主導(dǎo)航、卡片、按鈕、內(nèi)容和圖標(biāo)等。我們還可以使用適當(dāng)?shù)牧舭讓⒉煌脑剡M(jìn)一步分開，創(chuàng)建一個層級更清晰的界面結(jié)構(gòu)，以此來幫助用戶瀏覽和理解不同類型的信息。
鄰近原則是直接影響界面可用性的基本規(guī)則之一。如果隨意控制元素的位置和間距，有可能會讓整個產(chǎn)品變得混亂和難以理解。
視覺上相似的元素會被視為同一組，視覺上不同的元素，大腦會下意識將其視為單獨(dú)的元素。
利用相似性可以來定義界面的特征，例如顏色、形狀、尺寸、紋理或空間位置等。最容易區(qū)分的是顏色相似，其次是尺寸和形狀相似。
如果一個元素和界面中其他的元素都不同，無法融入到其他元素組中，那么這個元素就會變得非常顯眼。
我們可以利用這種差異化的效果來突出一些具有引導(dǎo)性或者功能性的元素，例如登錄按鈕或者加入購物車按鈕等。
一組不相連的元素組合在一起，我們會下意識地自動補(bǔ)充這些元素之間的空白，得到一個完整的、可識別的形狀。
閉合原則有多種不同的用法。例如一個虛線箭頭，我們會填補(bǔ)空白并把這些點(diǎn)連接在一起，得到一條完整的線段。
閉合原則還有助于識別抽象的圖標(biāo)形狀并賦予更多的含義。在圖標(biāo)設(shè)計中，為了避免信息過載，大多數(shù)圖標(biāo)的設(shè)計都很簡潔，更方便用戶理解。
運(yùn)用閉合原則的經(jīng)典案例包括用不同虛線構(gòu)成的IBM標(biāo)志、利用正負(fù)形空間組合而成的WWF熊貓標(biāo)志。
UI界面中的元素一旦有對稱性，就會產(chǎn)生秩序感，我們很快就能看到并理解這種形式。
我們天生喜歡對稱的物體。對稱排列的元素在視覺上更令人舒服，也更美觀。
可能有人覺得對稱設(shè)計過于呆板，這種想法在平面廣告或視覺設(shè)計中可能正確，但在UI設(shè)計中對稱布局是相當(dāng)重要且實(shí)用的界面排版形式。
對稱布局讓設(shè)計更容易理解，也更友好，缺乏對稱會導(dǎo)致界面混亂，不知道該關(guān)注哪個元素。當(dāng)然，如果想讓某個模塊突出展示，也可以嘗試打破對稱性，這樣不對稱的元素就能在界面中脫穎而出。
界面中沿著同一條線對齊的元素會被認(rèn)為屬于同一組。
在瀏覽界面時，視線會第一時間尋找最順暢的視覺動線。這也解釋了為什么在使用連續(xù)性原則時，需要確保直線(或曲線)是均勻和可預(yù)測的。
線條越均勻，生成的形狀越容易被用戶正確識別。
連續(xù)性有助于界面保持上下垂直滾動時的節(jié)奏，相似的內(nèi)容應(yīng)始終保持對齊。如果某個元素打破了這種連續(xù)性，我們的瀏覽節(jié)奏會被打亂，瀏覽速度也會變慢。
當(dāng)下的UI設(shè)計中，流行帶有圓角的卡片和按鈕效果。其中的一個原因是我們對于直角的處理速度稍慢，視線需要停頓并旋轉(zhuǎn)90度，而更圓滑的導(dǎo)角效果能幫助我們的視線更快地轉(zhuǎn)換。
按相同方向、以相同速度運(yùn)動的元素被認(rèn)為是一組。
在設(shè)計輪播、下拉列表、過渡動畫等場景時，共同命運(yùn)原則會很有幫助。例如我們的視線既跟隨輪播圖水平移動，還跟隨下拉列表向下展開。
根據(jù)?？硕桑晒┑倪x擇數(shù)量應(yīng)該有限制。有太多東西可供選擇可能會導(dǎo)致用戶迷失方向，做出判斷的時間加長，甚至?xí)械綁毫Α?/p>
米勒定律提到，大腦處理信息的能力與認(rèn)知負(fù)荷有直接的關(guān)系。我們大腦一次能處理的信息量大約是7個對象。對象數(shù)量越多，處理它們所需的時間就越長。
在設(shè)計時，盡量不要超過七個選項，為了獲得最好的體驗(yàn)，應(yīng)盡量將選項保持在4-5個。這意味著需要控制主導(dǎo)航數(shù)量、按鈕數(shù)量、下拉選項和輪播圖數(shù)量等。
當(dāng)需要用戶做選擇時，最好能突出顯示最受歡迎或最推薦的選項，幫助用戶更快做出決策。
我們能夠本能地區(qū)分界面中的圖形元素和背景。
界面由不同類型和樣式的圖層組成，每個圖層都有不同的層次結(jié)構(gòu)。
為了避免層次結(jié)構(gòu)混淆，我們需要清楚地定義界面的所有元素。背景不需要設(shè)計設(shè)計的太花哨，有可能會搶奪用戶對主要內(nèi)容的注意力。
輔助內(nèi)容和功能不需要太明顯，并且需要與主要內(nèi)容在設(shè)計上做出區(qū)分。
可以使用對比關(guān)系、位置關(guān)系和陰影等方法幫助用戶區(qū)分內(nèi)容和背景。
用戶通常認(rèn)為具有視覺吸引力(美觀)的產(chǎn)品更實(shí)用。
根據(jù)這個原則，流行、對稱、美觀的界面會對用戶產(chǎn)生更積極的影響。如果視覺效果給人足夠好的第一印象，用戶可能會忽略一些可用性問題。
審美可用性的基礎(chǔ)在于具有一定的可用性，之后才會起作用。如果產(chǎn)品本身的功能就很糟糕，那么再美觀的界面也無濟(jì)于事。
高質(zhì)量、美觀的界面有助于建立用戶信任。相反一個看起來混亂的設(shè)計會讓用戶感到不靠譜。即使用戶不能確切說出界面視覺的問題，但他們也會覺得這個產(chǎn)品有風(fēng)險或者不正規(guī)。
高質(zhì)量的UI設(shè)計對于銀行類、金融類和醫(yī)療類產(chǎn)品來說尤為重要，尤其是在需要用戶提供個人信息或涉及交易的使用場景中。
我們最容易記住一組當(dāng)中的第一個和最后一個元素。
將最重要的內(nèi)容或元素放在每組的第一個或最后一個，吸引用戶注意力，方便高頻操作。而次要的內(nèi)容操作頻率相對較低，則放到中間位置。
例如在構(gòu)建導(dǎo)航、下拉列表等場景中，將重要的操作放到首位。
在一組看起來相似的元素中，我們總是會記住與其余元素不匹配的那個元素。
在UI設(shè)計中，隔離效應(yīng)意味著將界面中重要的內(nèi)容或關(guān)鍵的操作在視覺上與眾不同。
最典型案例是界面中的CTA(號召性用語)按鈕。通過改變CTA按鈕的顏色、尺寸等，與界面中的其他按鈕區(qū)分開來，第一時間引起用戶的注意。
專欄作家
作者：Clippp，每周精選設(shè)計文章，專注分享關(guān)于產(chǎn)品、交互、UI視覺上的設(shè)計思考。
本文原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)作者許可，禁止轉(zhuǎn)載。
題圖來自 Unsplash，基于CC0協(xié)議。
該文觀點(diǎn)僅代表作者本人，人人都是產(chǎn)品經(jīng)理平臺僅提供信息存儲空間服務(wù)。
這次全面的改版，針對UI與UE不統(tǒng)一的問題，邁出了關(guān)鍵的一步——首次構(gòu)建組件庫
盡管在初期階段，面臨諸多挑戰(zhàn)和困難，但堅持不懈的努力使得組件庫逐漸成形。組件庫基本完善后，對工作效率的提升效果簡直令人興奮。組件的靈活變體和自動化的布局功能，不僅極大地提升了設(shè)計效率，也確保了界面的一致性和用戶體驗(yàn)的連貫性。這一嘗試不僅解決了我們面臨的問題，更為未來的設(shè)計和開發(fā)工作奠定了堅實(shí)的基礎(chǔ)，期待未來更多的挑戰(zhàn)與進(jìn)步。
判斷 UI 設(shè)計公司的收費(fèi)是否合理，可以從以下多個方面著手：
考量設(shè)計公司的專業(yè)水平與資質(zhì)
團(tuán)隊專業(yè)背景：查看設(shè)計團(tuán)隊成員的學(xué)歷、畢業(yè)院校以及所學(xué)專業(yè)等情況，若團(tuán)隊成員大多來自知名設(shè)計院校，具備扎實(shí)的專業(yè)基礎(chǔ)，例如有專業(yè)的視覺傳達(dá)、交互設(shè)計等相關(guān)專業(yè)背景，往往意味著能產(chǎn)出高質(zhì)量的設(shè)計成果，相應(yīng)收費(fèi)可能會偏高，但也更具合理性。
行業(yè)經(jīng)驗(yàn)：了解其在 UI 設(shè)計領(lǐng)域的從業(yè)年限以及過往參與過的項目類型和數(shù)量。有豐富行業(yè)經(jīng)驗(yàn)的公司，經(jīng)歷過各種不同客戶需求和復(fù)雜項目的打磨，在處理問題、把握設(shè)計方向上更有優(yōu)勢，對于復(fù)雜項目合理收取較高費(fèi)用是正常的，比如長期服務(wù)大型企業(yè)、完成過多個行業(yè)標(biāo)桿性 UI 設(shè)計項目的公司，其報價高些可能是基于深厚的實(shí)踐積累。
所獲榮譽(yù)與資質(zhì)認(rèn)證：關(guān)注該公司是否獲得過一些權(quán)威的 UI 設(shè)計相關(guān)獎項，或者具備如紅點(diǎn)獎等。這些榮譽(yù)和認(rèn)證是對其設(shè)計實(shí)力與服務(wù)質(zhì)量的一種認(rèn)可，收費(fèi)相對高些如果匹配其專業(yè)形象，也是合理的體現(xiàn)。
蘭亭妙微一直秉持著 “設(shè)計優(yōu)秀，不斷超越” 的理念。誠信敬業(yè)、專業(yè)耐心是他們工作作風(fēng)的真實(shí)寫照。在設(shè)計服務(wù)方面，他們不斷創(chuàng)新，與時俱進(jìn)。公司深知，只有幫助企業(yè)提升軟件和互聯(lián)網(wǎng)產(chǎn)品的界面設(shè)計水平，進(jìn)行開發(fā)升級，才能為企業(yè)帶來更多的價值。
設(shè)計的審美大多數(shù)是依照市場的改變而變化的，市場選擇的東西要試著去相信，可以參考，不表示要一比一的模仿，加入自己的想法和理解，也許能有新的東西出來。接到委托之后先具體化的溝通，理解需求，復(fù)述你的理解，讓對方同屏，之后再進(jìn)行更具體的論述，能減少之后的許多麻煩。
藍(lán)藍(lán)設(shè)計( www.freegoal.net )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)、UI設(shè)計公司、界面設(shè)計公司、UI設(shè)計服務(wù)公司、數(shù)據(jù)可視化設(shè)計公司、UI交互設(shè)計公司、高端網(wǎng)站設(shè)計公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計公司
藍(lán)藍(lán)設(shè)計的小編 http://www.freegoal.net
