正文

ui設(shè)計字體大?。╱i設(shè)計字體大小規(guī)范 800 480）

發(fā)布時間：2023-04-28 01:47:12 稿源：創(chuàng)意嶺閱讀： 233

大家好！今天讓創(chuàng)意嶺的小編來大家介紹下關(guān)于ui設(shè)計字體大小的問題，以下是小編對此問題的歸納整理，讓我們一起來看看吧。

創(chuàng)意嶺作為行業(yè)內(nèi)優(yōu)秀企業(yè)，服務(wù)客戶遍布全國，設(shè)計相關(guān)業(yè)務(wù)請撥打175-8598-2043，或微信：1454722008

本文目錄:

1、ui設(shè)計師都需要什么字體？
2、安卓手機ui設(shè)計尺寸規(guī)范
3、APP UI設(shè)計內(nèi)容少的時候怎么把握字體大小
4、手機ui設(shè)計字體一般多少像素?

ui設(shè)計字體大?。╱i設(shè)計字體大小規(guī)范 800 480）

一、ui設(shè)計師都需要什么字體？

手機軟件中的字體，ui界面設(shè)計字體有以下幾種：

一、在ios中默認(rèn)字體分為三類：

第一類：STHeiti-Light.ttc （黑體-簡與黑體-繁的細體）和 STHeiti-Medium.ttc（黑體-簡與黑體-繁的中黑）代表的是中文字體，常用的方正黑體簡體

第二類：_H_Helvetica.ttc 和 _H_HelveticaNeue.ttc 代表的是英文以及數(shù)字字體，常用的字體Helvetica

第三類：LockClock.ttf 代表的是鎖屏?xí)r間字體

二、在Android中，英文字體使用Roboto，中文字體使用Noto（思源黑體）。

以前的設(shè)計中，中文字體主要是使用微軟雅黑，但微軟雅黑在界面中就顯得有點厚重、臃腫。Google聯(lián)合Adobe發(fā)布了「思源黑體」作為Android的默認(rèn)中文字體，新的「思源黑體」不僅僅在字形上更易于在屏幕的閱讀，并且擁有7個字重，充分滿足了設(shè)計的需求。

三、ui界面設(shè)計一般用的字體是：微軟雅黑

其他可以參考一些ui界面設(shè)計規(guī)范，里面都有一些很嚴(yán)謹(jǐn)?shù)母袷?、字體、大小、顏色等數(shù)據(jù)規(guī)范的。

想要了解更多關(guān)于手機軟件字體的相關(guān)信息推薦選擇Pixso協(xié)同設(shè)計。Pixso可以多人云端協(xié)作設(shè)計，實時同步字號、邊框、顏色等各種細節(jié)。Pixso不僅是一站式產(chǎn)品設(shè)計協(xié)作工具，更是一款專業(yè)的UI/UX設(shè)計工具，更多矢量網(wǎng)格、布爾運算、樣式創(chuàng)建、智能排版等高階功能，使設(shè)計師真正專注于創(chuàng)造本身。

二、安卓手機ui設(shè)計尺寸規(guī)范

眾所周知，安卓系統(tǒng)是開源的，國內(nèi)又有超多的手機廠商，小米、魅族、華為、oppo、三星等，每一個品牌有屬于自己的UI設(shè)計規(guī)范，但是我們主要分析UI界面尺寸規(guī)范。

1、字體

安卓系統(tǒng)中文采用的是思源黑體，英文字體為robot字體。

只使用偶數(shù)單位 24 pt，28 pt，36 pt等字體大小

2、mdpi、hdpi、 xhdpi、xxhdpi、xxxhdpi、dp、px到底是什么意思？

講圖標(biāo)之前先來分析一下一排英文的意思：

mdpi、hdpi、 xhdpi、xxhdpi、xxxhdpi都是表示的屏幕密度大小，依次數(shù)值越大，其分辨率越高。常用的是xxhdpi和xxxhdpi。

dp是安卓系統(tǒng)專用的長度單位，設(shè)備獨立像素的意思。不同設(shè)備有不同的顯示效果,這個和設(shè)備硬件有關(guān)。多為圖標(biāo)使用，文字則用sp(放大像素)，主要用于字體顯示best for textsize。

px是像素的意思，不同設(shè)備顯示效果相同。

從左到右依次是：① 應(yīng)用欄高度：56dp；應(yīng)用欄左右內(nèi)邊距為16dp；應(yīng)用欄圖標(biāo)上下左內(nèi)邊距為16dp；應(yīng)用欄標(biāo)題左內(nèi)邊距為72dp；應(yīng)用欄標(biāo)題下邊距：20dp；

②應(yīng)用欄高度為128dp；

③操作欄高度為56dp；標(biāo)題欄高度：80dp；標(biāo)題欄底部內(nèi)邊距：8dp；描述區(qū)域高度：72dp；描述區(qū)底部內(nèi)邊距：16dp。

5、列表高度

垂直邊框、水平外邊距、邊框左右外邊距各16dp；帶有圖標(biāo)或者頭像的內(nèi)容有72dp的左邊距。

垂直邊距

①狀態(tài)欄：24dp；②工具欄：56dp；③子標(biāo)題：48dp；④列表項：72dp

三、APP UI設(shè)計內(nèi)容少的時候怎么把握字體大小

1. 留足空間

與普遍觀點恰好相反，字體并非屏幕上彎彎曲曲的線條排列；它主要在于周圍和相互間的空間。

字母本身對字體的影響，與構(gòu)成它的空間相比，要小得多。

要理解這一點，了解字體從何而來很有幫助：字母o（還有b、c、p等等）中間的圓孔被稱作“凹槽”。在最原始的印刷機上，鉛字由金屬雕刻而成，這些凹槽來自雕刻成型、排列在盤中的金屬活字。第一個字體設(shè)計師所處理的模具，實際上并不能用于印刷。字母本身對字體的影響，與構(gòu)成它的空間相比，要小得多。

談到層次時，我們通常指的是h1到p，有時候還會到h6。但另外還有一種層次在影響著行或段落的視覺流，這是特殊的層次：字母間距小于字間距，字間距小于行間距，以此類推。

要在移動端創(chuàng)造最佳易讀性，尤其要注意這些特殊層次，這些格式塔式的詞語、行、段落的文字組合，在自然光環(huán)境下同樣至關(guān)重要。

2. 行寬與行高

行寬是一行文字的長度?；蛘叽_切的說，是一行文字的理想長度，因為很難讓每一行都精確吻合。

眾所周知，舒適閱讀的理想行寬是65個字符左右。行寬產(chǎn)生的物理長度，取決于字體的設(shè)計、字間距（見下文）和你使用的具體文字。本文開篇的65個字符（譯者注：此處請參見英文原文），用PT Serif字體是26.875em寬，用Open Sans是28.4375em寬，用Ubuntu字體是27.3125em寬。如果再加入斜體、大小寫和一大堆其他字體細節(jié)，還會有更大的差異。

在桌面端瀏覽器中，65個字符很難觸及邊緣，但在移動設(shè)備上，65個字符（如果至少大到看得清）會超出瀏覽器的邊界。所以，在移動設(shè)備上，你必須得縮減行寬。

移動端并沒有普遍認(rèn)可的行寬標(biāo)準(zhǔn)。不過傳統(tǒng)上，報紙或雜志上每一個窄列都會趨向于39個字符。鑒于這個理想行寬已經(jīng)經(jīng)歷了數(shù)個世紀(jì)的考驗，它在移動端字體上也運轉(zhuǎn)良好。

3. 寬松行距、緊湊行距

行距是行之間的空間，行距太緊湊，會讓視線難以從行尾掃視到下一行首。行距太寬松，字間距會開始形成隊列，產(chǎn)生了我們通常意義上的河流，阻斷了行的視覺流。

從左至右：理想行距、太緊湊、太寬松。

行距的標(biāo)準(zhǔn)通常是1.4em，但以我的經(jīng)驗，這對于屏幕來說太緊湊了：在屏幕上表現(xiàn)良好的字體都有一個關(guān)鍵特征——大的凹槽，大凹槽需要更大一些的行距來保持空間層次。

反過來，更短的行寬需要更小的行距。所以你可能需要將桌面端的行距設(shè)得寬松點，同時記得將移動端的設(shè)置得緊湊些。

4. 找到最佳或是最舒服的狀態(tài)

所有字體至少都有一種最佳狀態(tài)，在屏幕上展現(xiàn)最佳的尺寸，還有在瀏覽器中最能保持字形的抗鋸齒選項。

最佳狀態(tài)下，多數(shù)筆畫通常都能排列在像素網(wǎng)格中——像素字體，如果你還記得的話，那些字體僅僅在字號調(diào)整到最佳狀態(tài)下才有效。

將字體設(shè)為最佳狀態(tài)能形成更強烈的對比。為移動端設(shè)計時，對比尤其重要，因為戶外的強光可能分散注意。

你會發(fā)現(xiàn)，微調(diào)行距會使每行脫離完美像素匹配。我覺得，在移動設(shè)備屏幕上，對比的重要性勝過行距。所以如果你不得不在行距上妥協(xié)，來保持每行契合像素網(wǎng)格，那就這么做吧。

通常設(shè)計師通過基線網(wǎng)格來排列文字。但在移動設(shè)備上，我們需要使用x高度來代替（x高度顧名思義，就是小寫字母x的高度）。從易讀性研究中，我們知道大腦識別的是文字頂部，而不是底部。所以要成就更加平順的視覺流，我們要確保字符頂部最契合像素網(wǎng)格。

5. 不要忽視起伏邊

起伏邊是一段文字的邊緣。你讀的多數(shù)內(nèi)容是居左對齊的（至少對于拉丁語系而言），導(dǎo)致右邊沿參差不齊。

當(dāng)視線從行尾跳至下一行首時，大腦最好要能判斷出下一次跳躍的角度和距離。把每次跳躍都想象成跑過跳板，如果間距保持一致，就會快很多。因此，文字左側(cè)邊緣應(yīng)該是平的，每行從同一個地方開始（對于從右至左的語言，恰好相反）。

因此你絕不應(yīng)該將兩三行以上的文字居中對齊。

通常文字會設(shè)置成兩端對齊，這意味著每行文字所占空間相等，所以兩側(cè)都不會有起伏邊。我懷疑兩端對齊的流行和響應(yīng)式設(shè)計有關(guān)，它教設(shè)計師們以塊狀形態(tài)思考。兩端對齊的文字產(chǎn)生的留白不統(tǒng)一。最糟的情況會導(dǎo)致一行中只有幾個字，相當(dāng)不協(xié)調(diào)。更窄的行寬會加重兩端對齊的問題，所以兩端對齊的文字在移動端是難以閱讀的。

從左至右：左對齊、居中對其、兩端對齊。

如果整潔真的非常重要，那么使用連字符號來讓起伏邊更平滑，絕不能在移動端使用兩端對齊。

文字右側(cè)是起伏邊在移動端還有一項額外好處：人們通常在易分心的場合閱讀文字，讀者視線頻繁地從文字上移開——查看站名，或是接電話。起伏邊創(chuàng)造了一個隨機形狀，讓右撇子的視線可以通過重讀最少的文字，回到剛才的位置。

6. 減少反差

增強文字與背景對比的同時，我們也要減少不同層次文字間的反差。

在移動端，實際可見的文字更少，所以反差被放大了。

其原因是我們的大腦基于環(huán)境來判斷重要性。在桌面端，標(biāo)題可能是正文字號的兩倍甚至三倍，因為屏幕上有更多文字，所以這是有效的。在移動端，實際可見的文字更少，所以反差被放大了。

多數(shù)設(shè)計師使用斐波那契數(shù)列式的字號組合。在移動端，應(yīng)該縮小比率來減少字號間的反差。比如，如果你使用黃金比例1.618與字號相乘。在移動端，應(yīng)該用更小的比例1.382來替代。

桌面端屏幕比移動端容許更夸張的字號縮放。

7. 按比例調(diào)整字間距

為移動端調(diào)整字號時，我們要意識到字間距發(fā)生了必要的變化。

（先說一句，不應(yīng)該調(diào)整固有字距。固有字距是兩個字母相互組合時的距離，使它們的間距與其他字母間距在視覺上統(tǒng)一。創(chuàng)作字體時，就納入了固有字距的考量，這個過程可能要花上數(shù)月。如果你選用了一款專業(yè)的字體，它的固有字距就是合適的，如果你覺得不對，請換一個字體。）

字間距并不是固有字距。字間距是字體中應(yīng)用在所有字符上的間距。通常你也不應(yīng)該調(diào)整字間距。

大字號是個例外，拿標(biāo)題和小號文字（比如腳注）舉例。大號文字需要減少字間距，小號文字需要增加字間距。前者是考慮到分組，后者則是為了增強對比。如果你在調(diào)整標(biāo)題，或是用了通常字間距緊密的藝術(shù)字體，縮小時可能就需要把字間距放開一點。

移動端APPUI設(shè)計之字體排版設(shè)計總結(jié)：

字體是一門工藝，設(shè)計師終其一生都在精心打磨。的確如此，因為每個文字、每種字體和每項技術(shù)都帶來了新的挑戰(zhàn)。沒有一成不變的普適規(guī)律。

假如你追求易讀性，要牢記三條原則：行內(nèi)的視覺流要平順，空間層級要清晰，要有足夠的對比。這尤其適用于移動端頁面。

沒有不可撼動的規(guī)則，全憑你雙眼決斷。不過此回答可以作為理想的出發(fā)點，讓你在移動設(shè)備上優(yōu)美地排列文字。希望能幫到你，望采納！

四、手機ui設(shè)計字體一般多少像素?

以iOS界面為例，手機UI設(shè)計字體像素一般為20至40px。

UI設(shè)計（或稱界面設(shè)計）是指對軟件的人機交互、操作邏輯、界面美觀的整體設(shè)計。UI設(shè)計分為實體UI和虛擬UI，互聯(lián)網(wǎng)常用的UI設(shè)計是虛擬UI，UI即User Interface（用戶界面）的簡稱。好的UI設(shè)計不僅是讓軟件變得有個性有品位，還要讓軟件的操作變得舒適簡單、自由，充分體現(xiàn)軟件的定位和特點。

iOS是由蘋果公司開發(fā)的移動操作系統(tǒng)。蘋果公司最早于2007年1月9日的Macworld大會上公布這個系統(tǒng)，最初是設(shè)計給iPhone使用的，后來陸續(xù)套用到iPod touch、iPad上。iOS與蘋果的macOS操作系統(tǒng)一樣，屬于類Unix的商業(yè)操作系統(tǒng)。原本這個系統(tǒng)名為iPhone OS，因為iPad，iPhone，iPod touch都使用iPhone OS，所以2010年WWDC大會上宣布改名為iOS（iOS為美國Cisco公司網(wǎng)絡(luò)設(shè)備操作系統(tǒng)注冊商標(biāo)，蘋果改名已獲得Cisco公司授權(quán)）。

以上就是關(guān)于ui設(shè)計字體大小相關(guān)問題的回答。希望能幫到你，如有更多相關(guān)問題，您也可以聯(lián)系我們的客服進行咨詢，客服也會為您講解更多精彩的知識和內(nèi)容。