馬上注冊,結(jié)交更多好友,享用更多功能,讓你輕松玩轉(zhuǎn)社區(qū)。
您需要 登錄 才可以下載或查看,沒有帳號?立即加入SketchUp吧!

x
選擇合適的字體是排版開始的第一步。當然排版中除了改變字體大小,其實還有很多內(nèi)容可以調(diào)節(jié)。這里就跟大家分享UI設(shè)計中字體排版需要掌握的技巧和標準原則~
0.webp.jpg (31.79 KB, 下載次數(shù): 0)
下載附件
保存到相冊
2021-5-26 16:24 上傳
1、行高/行間距
首先介紹兩個容易混淆的概念——行高和行間距,兩者在中英文的用法也有差異。
1.png (30.15 KB, 下載次數(shù): 0)
下載附件
保存到相冊
2021-5-26 16:24 上傳
中文行高:上一行文字的最底部與下一行文字的最底部之間的距離。
中文行間距:上一行文字的最底部與下一行文字的最頂部之間的距離(行與行之間的距離)。
基線是英文字體結(jié)構(gòu)中的概念,英文的行高由基線決定。
1-2.png (44.19 KB, 下載次數(shù): 0)
下載附件
保存到相冊
2021-5-26 16:24 上傳
英文行高:上一行的基線到下一行基線之間的距離(藍線標注);
英文行間距:兩行字體之間的距離,即上一行的下限線與下一行的上限線之間的距離(橙線標注)。
2、字重/襯線
2.png (61.16 KB, 下載次數(shù): 0)
下載附件
保存到相冊
2021-5-26 16:24 上傳
字重(weight)是指字體的粗細程度。字重的粗細變化為我們在不同場景使用提供了更多選擇。
襯線體(serif)是指字形筆畫在首尾的裝飾和筆畫的粗細不同;無襯線體(sans-serif)沒有筆畫首尾的裝飾,筆畫粗細相同。
在同等字號下,無襯線字體看上去要比襯線更大,結(jié)構(gòu)也更清晰,所以無襯線字體更適合在屏幕上使用。
3、層級結(jié)構(gòu)
絕大多數(shù)UI界面是由一些標準元素組成——文本、矩形/框、按鈕和圖標。
3.png (54.15 KB, 下載次數(shù): 0)
下載附件
保存到相冊
2021-5-26 16:24 上傳
字體大小對比明顯的層級結(jié)構(gòu)讓用戶更容易地找到重要信息,提升界面的可讀性。
4、最佳行長
合適的行長能確保文本在不同的設(shè)備上都能易于閱讀。
這里有行長的基本用法:
中文一個字占兩字符,英文一個字占一字符,行長在頁面中的最大長度不能超過110個字符;
當字體變小時,增大行高可以獲得更好的可讀性和易讀性。
5、限制字體數(shù)量
5.png (44.73 KB, 下載次數(shù): 0)
下載附件
保存到相冊
2021-5-26 16:24 上傳
混合太多不同的字體會讓界面設(shè)計變得混亂。
選擇字體時盡量使用帶有多種字重的同一款字體,通過靈活調(diào)節(jié)字重達到界面統(tǒng)一的效果。
6、定義字體比例
6.webp.jpg (46.59 KB, 下載次數(shù): 0)
下載附件
保存到相冊
2021-5-26 16:24 上傳
UI設(shè)計頁面中不同的位置(標題、正文、備注)要使用不同比例的字體,從而產(chǎn)生連貫的排版體驗。
7、使用可識別的提示
7.png (32.58 KB, 下載次數(shù): 0)
下載附件
保存到相冊
2021-5-26 16:24 上傳
通過上面的原則可以提升界面的可讀性和美觀性。但是如何提高界面中信息的可理解性呢?
只有真正把設(shè)計與信息結(jié)合在一起,才能使傳達的效率最優(yōu)化:
避免使用專業(yè)術(shù)語。除非是為特定人群設(shè)計產(chǎn)品,否則應避免使用行業(yè)術(shù)語。
保持提示簡潔明了。例如在訪問網(wǎng)站時,將“只有會員才可以訪問此功能”修改成“加入會員即可訪問”,這樣的提示更能切中要點。
8、強調(diào)重要信息
8.png (70.09 KB, 下載次數(shù): 0)
下載附件
保存到相冊
2021-5-26 16:24 上傳
使用顏色和視覺權(quán)重來強調(diào)重要信息,用較淺的文本來展示次要信息。這樣能將更多的注意力集中到更具活力的文本上,幫助用戶快速做出選擇。
9、考慮語言支持
9.png (83.95 KB, 下載次數(shù): 0)
下載附件
保存到相冊
2021-5-26 16:24 上傳
同一個詞語的拼寫長度會隨著語言的不同而變化,所以要有足夠的空間來容納字符。
10、系統(tǒng)字體
10.png (30.02 KB, 下載次數(shù): 0)
下載附件
保存到相冊
2021-5-26 16:24 上傳
如果在字體選擇上出現(xiàn)困難,可以考慮使用iOS和Android原生的系統(tǒng)字體。它們支持豐富的字重、尺寸和樣式,利用這些字體也能打造舒適的閱讀體驗。
|
|