UI設計按鈕層次結構的顏色對比原則

　　假設用戶在界面上遇到一對按鈕時猶豫不決。用戶向左看，然后向右看，進行比較。經(jīng)過思考后，他們做出選擇。他們的選擇不僅遲了，而且他們也不確定，因為您的按鈕沒有很強的層次結構。今天AAA教育武老師為大家分享UI設計按鈕層次結構的顏色對比原則。
 

　　要建立強大的按鈕層次結構，請避免設計師犯下以下常見的顏色對比錯誤，UI設計配色避免出錯。使用基于Web內容可訪問性指南(WCAG)顏色對比度公式的在線顏色計算器來評估對比度級別。
 

　　不要使用相同的顏色輪廓按鈕

 

　　設計人員通常喜歡將主按鈕的輪廓形狀用作輔助按鈕。樣式可能有所不同，但按鈕仍在競爭，因為它們的顏色對比度相同。
 

　　為確保主按鈕得到更多關注，請為輪廓按鈕使用強調色的陰影以減弱對比度。您可以通過保持強調色的色調并降低亮度和飽和度，直到其對比度低于主按鈕，來創(chuàng)建陰影。但是，請確保其足夠高，以達到可讀性的最低可接受水平。這也考驗UI設計師的配色經(jīng)驗。
 

　　不要使用黑色的輔助按鈕
 

　　UI設計師的現(xiàn)在另一種趨勢是使輔助按鈕變黑。他們認為使用中性色不會競爭。但是，黑色按鈕贏得了戰(zhàn)斗，因為它具有更高的對比度。UI設計要注意抓人眼球。
 

　　不要使用黑色，而應使用強調色的色調，以使輔助按鈕比主按鈕弱。為此，您需要增加亮度并降低強調的色彩飽和度。
 

　　請勿在主色上使用淺強調色
 

　　UI設計要抓人眼球。同時也要注意和諧。將彩色按鈕與中性灰色配對并不總是意味著彩色按鈕會獲得更多關注。如果主按鈕的口音太輕，則中立的輔助按鈕將勝出。
 

　　為避免此錯誤，請選擇不太亮的強調色。明亮的強調色可能看起來很吸引人，但與白色背景或文本的對比度卻不佳。在主要按鈕上使用較深的重音，以使次要按鈕無法吸引注意力。避免UI設計顏色出錯。
 

　　暗模式下的按鈕對比度
 

　　在深色模式下使用的強調色應與在淺色模式下使用的強調色不同。使用相同的重音顏色將使文本標簽更難以閱讀，按鈕也更難以感知。
 

　　了解按鈕對比在黑暗模式下如何工作，應避免的錯誤以及可遵循的最佳做法。以上就是UI設計按鈕層次結構的顏色對比原則，這些知識學到了嗎？更多精彩內容持續(xù)關注aaa教育~