熱門服務
眾多企業(yè)的選擇


正面例子:界面通過黑色Button強調重要的信息,關鍵元素則采用高亮小圖標顯示,直接吸引用戶的注意力。
反面例子:左面界面的所有元素采用同一色系,看起來所有信息都很重要,沒有明確的視覺指引;右面整個界面的顏色太多,顯得非常輕浮。原則二:層次結構建立視覺層次結構,能讓用戶明確知道頁面的關鍵要素和其他元素之間的關系,并且能快速完成當前任務,同時也符合用戶的閱讀習慣。所以突出界面的層級關系,可通過顏色、大小,明暗對比。
正面例子:頁面的圖片是吸引用戶注意力的關鍵,因此視覺重量會比其他元素要大,里面的文字則利用明暗區(qū)分層級關系。原則三:視覺重量要衡量頁面的重量,可通過大小、對比、顏色、留白、形狀、位置等方式進行調整。那么在界面中如何把握視覺重量的比例?看看以下的例子。
雖然與白色相比,藍紫色會更具吸引力,但在左圖中,我們卻發(fā)現中間白色的logo更為吸引,這是因為留白,周圍沒有任何元素干擾。再看看右圖,界面雖然有很多元素,但最吸引人的依然是藍紫色的按鈕,這是因為與界面的其他顏色相比,藍紫色更為搶眼,因而成為視覺焦點。原則四:視覺方向如果說視覺重量能時間將用戶的視線帶到特定重要的位置,那么視覺方向其實引導用戶快速完成任務和達到預期目標。正面例子:左邊圖標和右邊列表形成一個Z字結構,引導用戶將視線從左到右移動,非常符合用戶的傳統(tǒng)閱讀習慣。要形成視覺方向就需要「線」,這條線是無形的,但可通過對齊、相同形狀元素等形成軸來進行。簡單來說,用戶能否順利在頁面中完成操作,靠的就是視覺方向的指引,這就需要我們通過對視覺焦點、層次結構、視覺重量這三方面的調整才能實現
【版權聲明】:本站內容來自于與互聯(lián)網(注明原創(chuàng)稿件除外),供訪客免費學習需要。如文章或圖像侵犯到您的權益,請及時告知,我們第一時間刪除處理!謝謝!