UI界面設(shè)計(jì)

安卓app設(shè)計(jì)規(guī)范整理和Android APP設(shè)計(jì)篇

39908

隨著安卓智能手機(jī)不停的更新?lián)Q代。安卓手機(jī)系統(tǒng)越來(lái)越完美，屏幕尺寸也越來(lái)越大啦！比如最近小米的miui 6的發(fā)布和魅族手機(jī)系統(tǒng)的更新等等。

以小米MIUI6的安卓手機(jī)來(lái)說(shuō)，MIUI6進(jìn)行了全新設(shè)計(jì)，堅(jiān)持“內(nèi)容才是本質(zhì)”的設(shè)計(jì)哲學(xué)，重新提煉內(nèi)容，簡(jiǎn)化圖標(biāo)設(shè)計(jì)。

所以，我們?cè)谶M(jìn)行安卓APP設(shè)計(jì)時(shí)，需要好好調(diào)整之前的設(shè)計(jì)規(guī)范和設(shè)計(jì)細(xì)節(jié)。根據(jù)目前流行的安卓手機(jī)的系統(tǒng)體驗(yàn)來(lái)完成我們的安卓APP設(shè)計(jì)規(guī)范。應(yīng)該說(shuō)這是整理出最全面的安卓app設(shè)計(jì)規(guī)范。

25學(xué)堂站在不斷更新和完善安卓app設(shè)計(jì)規(guī)范為宗旨！利用周末的時(shí)間整理了2014年Android APP設(shè)計(jì)規(guī)范教程。

1、安卓app設(shè)計(jì)規(guī)范之尺寸或分辨率

目前最新安卓手機(jī)的屏幕尺寸都是5.5英寸啦。我們都知道安卓機(jī)的尺寸很多很雜。而且不同的分辨率對(duì)應(yīng)不同的dpi模式。

Android也支持多種不同的dpi模式：ldpi ? mdpi ? hdpi ? ? xhdpi ? xxhdpi ? ?xxxhdpi（4K分辨率）

關(guān)于安卓APP設(shè)計(jì)的dpi詳細(xì)解讀請(qǐng)查看：

1、Android界面設(shè)計(jì)專業(yè)術(shù)語(yǔ)：xxxhdpi和4K分辨率

2、Android APPUI設(shè)計(jì)師必知：pt sp dp之間的關(guān)系以及換算公式

3、Android界面設(shè)計(jì)適配不同屏幕的尺寸和密度解讀

目前主流的安卓手機(jī)分辨率有以下3種：

hdpi，對(duì)應(yīng)800*480的手機(jī)。主流機(jī)型，很多。如小米1 ，1s 三星 htc 等

xdpi，對(duì)應(yīng)1280*720的手機(jī)。三星Galaxy系列和華為p6.

xxdpi，對(duì)應(yīng)1080*1920的手機(jī)。小米手機(jī)，華為榮耀手機(jī)系列為主加上?htc one。

下面是當(dāng)面流行的安卓手機(jī)的屏幕尺寸和分辨率：

小米 3和小米4 屏幕尺寸和分辨率： ? ? ? ?5英寸 1920x1080像素

魅族MX2 屏幕尺寸和分辨率：?? ? ? ? ? ? ? ??4.4英寸 1280x800像

魅族MX3 屏幕尺寸和分辨率： ? ? ? ? ? ? ? ??5.1英寸 1800x1080像素

HTC ?one屏幕尺寸和分辨率： ? ? ? ? ? ? ??4.7英寸 1920x1080像素

華為榮耀6屏幕尺寸和分辨率：? ? ? ? ? ? ?5英寸 1920x1080像素

華為p6屏幕尺寸和分辨率：?? ? ? ? ? ? ? ??4.7英寸 1280x720像素

華為p7屏幕尺寸和分辨率：?? ? ? ? ?? ? ? ? 5英寸 1920x1080像素

在目前我們的安卓APP設(shè)計(jì)項(xiàng)目當(dāng)中，我們并不會(huì)去為每一種分辨率去設(shè)計(jì)一套UI界面。這是一種追求完美和理想的狀態(tài)。小公司肯定是耗不起這樣的。

所以，這個(gè)時(shí)候我們需要學(xué)會(huì)變通。為了適應(yīng)多分辨率，

1：在標(biāo)準(zhǔn)基礎(chǔ)（xdpi：1280*720）上開(kāi)始，然后放大或縮小，以適應(yīng)到其他尺寸。

2：從設(shè)備的最大尺寸（xxdpi：1920x1080）開(kāi)始，然后縮小，并適應(yīng)到所需的最小屏幕尺寸。

有些時(shí)候我們也會(huì)在實(shí)際開(kāi)發(fā)過(guò)程中，Android和IOS的設(shè)計(jì)稿若無(wú)太大差異，也可從IOS的分辨率（960*640）開(kāi)始，再調(diào)整設(shè)計(jì)稿的比例，適應(yīng)其他分辨率。但是這種方法在切圖的時(shí)候需要做一些圖片的調(diào)整。如果不是矢量圖的元件需要重新按照1280*720的尺寸設(shè)計(jì)下。

2、安卓app設(shè)計(jì)規(guī)范之字體和字體大小

我們必須知道的安卓設(shè)計(jì)常識(shí)：安卓4.0之后用的字體是Roboto。中文字體：方正蘭亭黑體

今天跟大家講解的是在720*1280的基礎(chǔ)上的字體設(shè)計(jì)大小。

注釋最小字體： ? ? ? ? ? ? ? 12sp ?== ?24px

文本字體： ? ? ? ? ? ? ? ? ? ? ? 14sp ?== ?28px

文章標(biāo)題或圖標(biāo)名稱： ? 16sp ?== ? 32px

導(dǎo)航標(biāo)題： ? ? ? ? ? ? ? ? ? ? ? 18sp ?== ? 36px

SP的詳細(xì)介紹如下：

sp和dp一樣，是android開(kāi)發(fā)里特有的單位，設(shè)計(jì)師在做UI設(shè)計(jì)的時(shí)候通常最初是建立320*480這個(gè)尺寸的畫布開(kāi)始的，這個(gè)尺寸的畫布在android分辨率的分類中稱為mdpi，在這個(gè)尺寸下，ps里的1px就等于android中的1dp，同樣，這個(gè)時(shí)候1點(diǎn)的字就等于android中1sp，舉個(gè)栗子：你建立畫布的尺寸是320-480，里面的文字是30點(diǎn)，那么它就是30sp。

一般android設(shè)置長(zhǎng)度和寬度多用dip,設(shè)置字體大小多用sp. 在屏幕密度為160，1dp=1px=1dip, 1pt = 160/72 sp ?1pt = 1/72 英寸.當(dāng)屏幕密度為240時(shí)，1dp=1dip=1.5px.

設(shè)計(jì)時(shí)候，我們還需要遵循48dp定律。

48dp作為安卓可觸摸的UI元件的標(biāo)準(zhǔn)。

一般來(lái)說(shuō)，48dp轉(zhuǎn)化為一個(gè)物理尺寸約9毫米。建議的目標(biāo)大小為7-10毫米的范圍，這是一個(gè)用戶手指能準(zhǔn)確并且舒適觸摸的區(qū)域。

如果你設(shè)計(jì)的元素高和寬至少48dp，你就可以保證：

（1）. 觸摸目標(biāo)絕不會(huì)比建議的最低目標(biāo)（7mm）小，無(wú)論在什么屏幕上顯示。

（2）. 在整體信息密度和觸摸目標(biāo)大小之間取得了一個(gè)很好的平衡。

而每個(gè)UI元素之間的空白通常是8dp.

下面是某個(gè)安卓APP設(shè)計(jì)師對(duì)android設(shè)計(jì)做出的一個(gè)設(shè)計(jì)信息圖總結(jié)。