基礎知識,分享常用的對齊技巧
在對齊的方式里我們找到了規(guī)律,層級關系,框框框!
通過對其方式來區(qū)分內容的層級關系,這就是隱形對齊框的作用。將信息層級通過這種方式羅列在用戶眼前。讓用戶最近視角展示產品的核心信息。提煉出用戶在場景中最為關注的訴求,解決用戶的問題。
對齊也是有層次的。有左對齊、右對齊、居中對齊。(都懂都懂,就是用不好)左對齊和右對齊主要是對屏幕內容的規(guī)整性,居中對齊則是對內容文本的劃分。
三、常用間距將框框框融入到APP界面中,將主要的,用戶想找的內容突出出來。
在設計中一般間距設定的大小單位10px,這樣更容易統(tǒng)一整個畫面的一致性。
在界面中常用間距來劃分內容的層級關系,讓內容與導航取分出來。
在導航上的左右間距是20px,而在內容列表信息程序時左右間距調整到了30px。
通過這種方式區(qū)分了上下層級的關系。
那么在主文本信息中還將上下間距統(tǒng)一一致都設定為30px,使整個內容的邊框看起來更為整體舒服。
我們常會設計到雙行文字的列表,QQ的設計是120px,隨著設備屏幕的變大,更加注重了頁面的留白。為了加強內容的突出性。我在設計中高度設定為130px
再往深的走,界面中還會有其他的信息。如時間、消息氣泡等。它們的對齊模式會根據字號大小進行控制。
為了保證內容閱讀的舒適性,字號大小不一致的文本我們還會用到居中對齊的方式(比如,上圖中的主標題和時間的對齊方式),讓內容顯得更為規(guī)整。
總之,以內容為中心的設計能讓用戶快速找到想要的。使用正確的對齊和間距,能讓界面更為整齊,信息更為明確。
今天就到這里,休息休息,休息一大會兒,然后多看多分析,多交流。