雷火平台-中国知名电竞赛事平台

聯(lián)系我們 face+ 關(guān)于 服務(wù) 案例
首頁 案例 服務(wù) 關(guān)于 face+

安卓界面ui設(shè)計(jì)字體大小有什么規(guī)范,UI設(shè)計(jì)應(yīng)用技巧

Time: 2021-08-19

安卓系統(tǒng)是人們常用的一種系統(tǒng)之一。自成一派的系統(tǒng)往往都有自己的規(guī)則和要求。在安卓系統(tǒng)中,對(duì)于ui設(shè)計(jì)也有一定的標(biāo)準(zhǔn)。今天就讓faceui為大家介紹安卓界面ui設(shè)計(jì)字體大小有什么規(guī)范,UI設(shè)計(jì)應(yīng)用技巧。

  安卓界面ui設(shè)計(jì)字體大小有什么規(guī)范

  設(shè)計(jì)師在做UI設(shè)計(jì)的時(shí)候通常最初是建立320*480這個(gè)尺寸的畫布開始的,這個(gè)尺寸的畫布在android分辨率的分類中稱為mdpi,在這個(gè)尺寸下,ps里的1px就等于android中的1dp,同樣,這個(gè)時(shí)候1點(diǎn)的字就等于android中1sp。

  常見的字體大小:24px、26px、28px、30px、32px、34px,36px等等。記住是偶數(shù)的。最小字號(hào)20px。

  常用字體:中文用蘋方黑,英文用San Francisco,如果安不上也可以用Helvetica代替。

  1、從標(biāo)題(Title)到小字提示(Caption),中文比英文都大1sp,比標(biāo)題大的文本樣式,中文與英文采用相同大小的字號(hào)。

  2、行高:為了提供適當(dāng)?shù)目勺x性與節(jié)奏感,Material Design根據(jù)不同的字號(hào)大小與字重規(guī)定了對(duì)應(yīng)的行高。沒有特殊要求下,建議使用常用1.25行倍值。

  3、字體顏色:在安卓設(shè)計(jì)中很少使用某種色號(hào)控制,他是通過純黑或純白不透明度控制它的一個(gè)顯示。

  亮色背景上的黑色文本:最重要的文本使用87%的不透明度;次要文本也就是較低視覺層次文本使用54%不透明度;提示文本(例如輸入框里的文字和標(biāo)簽里的文字)禁用文本或者更低視覺層次文本使用38%不透明度。

  暗色背景上的白色文本:在黑色背景和有色背景上主要文本都使用100%不透明度值;次要文本使用70%的不透明度;其他更低視覺層次的文本使用50%的不透明度。

安卓界面ui設(shè)計(jì)字體大小

安卓界面ui設(shè)計(jì)字體大小(圖片來自網(wǎng)絡(luò))


  小圖標(biāo)尺寸是24dp X 24dp。圖形限制在中央20dp X 20dp區(qū)域內(nèi)。小圖標(biāo)同樣有柵格系統(tǒng)。線條、空隙盡量保持2dp寬,圓角半徑2dp。特殊情況相應(yīng)調(diào)整。

  圖標(biāo)的顏色使用純黑與純白,通過透明度調(diào)整:黑色:[54% 正常狀態(tài)] [26% 禁用狀態(tài)];白色:[100% 正常狀態(tài)] [30% 禁用狀態(tài)]。

  4、按鈕BUTTON

  底部動(dòng)作條Bottom Sheets,底部動(dòng)作條是一個(gè)從屏幕底部邊緣向上滑出的一個(gè)面板,向用戶呈現(xiàn)一組功能。

  UI設(shè)計(jì)應(yīng)用技巧

  1、使用大小適當(dāng)?shù)膱D像

  在圖像方面,許多Android應(yīng)用開發(fā)者采用的是大小單一的做法。盡管這會(huì)使資源管理變得更為簡(jiǎn)單,但就應(yīng)用的視覺吸引力而言,這是個(gè)錯(cuò)誤的做法。要讓應(yīng)用呈現(xiàn)出最佳的視覺效果,那么就應(yīng)當(dāng)針對(duì)具體的設(shè)備屏幕設(shè)計(jì)不同的圖像。最適當(dāng)?shù)膱D像才能構(gòu)建出最棒的用戶體驗(yàn)。

  2、使用適當(dāng)格式的圖像

  媒體格式比如PNG、JPEG、GIF、BMP和WebP(注:僅Android 4.0+版本支持)。PNG是無損圖片的理想格式,而JPEG的呈現(xiàn)質(zhì)量并不穩(wěn)定。如果可行的話,可以考慮使用WebP來替代JPEG,因?yàn)檫@種格式在存儲(chǔ)和下載時(shí)效率更高。也就是說,如果將其作為與較老格式同時(shí)使用的獨(dú)立圖片,那么應(yīng)用整體規(guī)模會(huì)變大,這就削減了使用新格式的優(yōu)勢(shì)。

  3、運(yùn)用微妙動(dòng)畫,顏色來呈現(xiàn)狀態(tài)改變

  在屏幕轉(zhuǎn)場(chǎng)時(shí)運(yùn)用微妙動(dòng)畫以及UI控制顏色變化來呈現(xiàn)應(yīng)用狀態(tài)改變,這會(huì)讓你的應(yīng)用更顯專業(yè)感。比如,活動(dòng)間的淡入淡出使屏幕轉(zhuǎn)變更為自然,改變被按動(dòng)的按鍵顏色會(huì)突顯正在發(fā)生的用戶動(dòng)作,清晰地呈現(xiàn)出用戶正在做的事情。

安卓界面ui設(shè)計(jì)字體大小

安卓界面ui設(shè)計(jì)字體大小(圖片來自網(wǎng)絡(luò))


  4、用圓角效果來軟化UI

  Button、PageView等用戶界面控制按鈕在屏幕上都會(huì)呈現(xiàn)矩形的像素形狀,但這需要進(jìn)行處理。在控制界面上,使用圓角效果來軟化用戶界面的外觀,這顯得很像Web的風(fēng)格,但確實(shí)很受用戶喜歡。

  5、在3D效果中使用一致性的“光照”

  如果你在應(yīng)用的控制按鍵中使用投影和其他此類樣式,確保要使用一致性的“光照”。換句話說,要確保陰影在屏幕上的朝向一致。在圖像編輯器中使用相同的數(shù)值來創(chuàng)造相同的斜度和紋理。

  6、使用高對(duì)比度配色方案

  當(dāng)某個(gè)家庭成員(注:往往是老一輩的人)首次發(fā)現(xiàn)可以在郵件中使用帶顏色的字體和背景,于是發(fā)送給你一封使用白色背景和檸檬黃色字體的電子郵件,這樣的郵件閱讀起來相當(dāng)費(fèi)勁。有些人在設(shè)計(jì)應(yīng)用的屏幕時(shí),可能會(huì)讓玩家難以閱讀或?qū)Ш狡聊恢械膬?nèi)容。使用適當(dāng)?shù)母邔?duì)比度顏色,會(huì)讓屏幕更易于查看,緩解眼睛的壓力。要將配色方案作為系統(tǒng)資源的一部分,以此為基礎(chǔ)來開展其他工作。

  7、使用大型和易讀的字體

  相比其他字體,有些字體確實(shí)閱讀起來更為容易。字體大小也是個(gè)重要因素,在保持與其他屏幕功能的平衡性的前提下,盡量將字體制作得夠大。就像在使用傳真機(jī)時(shí),使用小于12磅的字體并不合適。

  以上就是faceui為大家介紹的關(guān)于安卓界面ui設(shè)計(jì)字體大小的相關(guān)內(nèi)容。不同界面對(duì)設(shè)計(jì)的規(guī)范和原則不同,但是也要根據(jù)用戶的使用體驗(yàn)進(jìn)行調(diào)整。


合作咨詢

上海(總部)

上海市浦東新區(qū)郭守敬路498號(hào)22號(hào)樓
021-61057328
service@faceui.com

辦公地址地圖

北京

北京市東城區(qū)后永康17號(hào)A座
010-64015620
service@faceui.com

辦公地址地圖

成都

四川省成都市錦江區(qū)東大街牛王廟段100號(hào)
028-62790929
service@faceui.com

辦公地址地圖
首頁 | 案例 | 服務(wù) | 關(guān)于 | face+ | 智見

Copyright ? 2009-2022 FaceUI design. All rights reserved


滬ICP備13044459號(hào)-5

上海辦公地點(diǎn)地圖
北京辦公地點(diǎn)地圖
深圳辦公地點(diǎn)地圖
在微信中搜索faceui
或保存二維碼在微信中打開