本篇文章給大家談?wù)凙PP界面設(shè)計(jì)尺寸，以及ui設(shè)計(jì)手機(jī)界面尺寸對(duì)應(yīng)的知識(shí)點(diǎn)，希望對(duì)各位有所幫助，不要忘了收藏本站喔。

本文目錄一覽：

• 1、androidapp界面設(shè)計(jì)按什么尺寸
• 2、ios app界面設(shè)計(jì)用什么尺寸？
• 3、淺談iOS APP設(shè)計(jì)規(guī)范-按照iphone6尺寸

androidapp界面設(shè)計(jì)按什么尺寸

androidapp界面設(shè)計(jì)是按720*1280的，切圖上可以點(diǎn)9切圖做到所有手機(jī)的適配。

狀態(tài)欄、導(dǎo)航欄和主菜單欄，以720*1280的尺寸來(lái)設(shè)計(jì)，那么狀態(tài)欄的高度應(yīng)為50px，導(dǎo)航欄的高度96px，主菜單欄的高度96px，因?yàn)槭情_源的系統(tǒng)，這里的數(shù)值也只能作為參考。

Android為了區(qū)別于IOS，從4.0開始提出了一套HOLO的UI風(fēng)格設(shè)計(jì)風(fēng)格，鼓勵(lì)將底部的主菜單欄放到導(dǎo)航欄下面，從而避免點(diǎn)擊下方材料誤點(diǎn)虛擬按鍵，很多APP的新版中也采用了這一風(fēng)格。

擴(kuò)展資料：

注意事項(xiàng)：

1、通常情況要定位一個(gè)Icon只需給出上/下邊距，左/右邊距，標(biāo)注圖標(biāo)距離只需標(biāo)到可點(diǎn)擊范圍外

通用型顏色、字體單獨(dú)標(biāo)明一份，通用型模塊只需單獨(dú)標(biāo)明一份，如導(dǎo)航欄。

2、手機(jī)可視區(qū)域通常為寬度固定，長(zhǎng)度超出邊界可滑動(dòng)，所以標(biāo)注物體寬度時(shí)可按比例說(shuō)明，如果要標(biāo)注內(nèi)容上下居中，左右居中，或等比可不標(biāo)注。

3、當(dāng)交付的是一張完整圖片時(shí)，不需做機(jī)型適配，只需給高清圖(1920*1080)即可，注意進(jìn)行壓縮。

4、若圖標(biāo)在不同頁(yè)面重復(fù)出現(xiàn)，且尺寸相差不大，直接給出最大一份切圖，并在圓形圖標(biāo)明尺寸，程序會(huì)根據(jù)需求縮放。

5、當(dāng)背景是純色時(shí)只需給出色值，Android使用16進(jìn)制色值。

參考資料來(lái)源：百度百科-Android

參考資料來(lái)源：百度百科-界面設(shè)計(jì)

參考資料來(lái)源：百度百科-狀態(tài)欄

參考資料來(lái)源：百度百科-導(dǎo)航欄

參考資料來(lái)源：百度百科-開源系統(tǒng)

參考資料來(lái)源：百度百科-切圖

參考資料來(lái)源：百度百科-UI設(shè)計(jì)

ios app界面設(shè)計(jì)用什么尺寸？

界面尺寸規(guī)范

1、界面尺寸大小是：750x1334px。

2、狀態(tài)欄(status bar)：就是電量條，其高度為：40px;

3、導(dǎo)航欄(navigation)：就是頂部條，其高度為：88px;

4、主菜單欄(submenu，tab)：就是標(biāo)簽欄，底部條，其高度為：98px;

5、內(nèi)容區(qū)域(content)：就是屏幕中間的區(qū)域，其高度為：1334px-40px-88px-98px=1108px

iOS是由蘋果公司開發(fā)的移動(dòng)操作系統(tǒng) 。蘋果公司最早于2007年1月9日的Macworld大會(huì)上公布這個(gè)系統(tǒng)，最初是設(shè)計(jì)給iPhone使用的，后來(lái)陸續(xù)套用到iPod touch、iPad以及Apple TV等產(chǎn)品上。

iOS與蘋果的Mac OS X操作系統(tǒng)一樣，屬于類Unix的商業(yè)操作系統(tǒng)，原本這個(gè)系統(tǒng)名為iPhone OS，因?yàn)閕Pad，iPhone，iPod touch都使用iPhone OS，所以2010WWDC大會(huì)上宣布改名為iOS(iOS為美國(guó)Cisco公司網(wǎng)絡(luò)設(shè)備操作系統(tǒng)注冊(cè)商標(biāo)，蘋果改名已獲得isco公司授權(quán)。

淺談iOS APP設(shè)計(jì)規(guī)范-按照iphone6尺寸

現(xiàn)在iOS app 的尺寸也變多了，要適配到各種尺寸需要選擇一個(gè)折中的尺寸來(lái)向上向下適配，以前一般用的是iphone5的尺寸，iPhone6 plus出現(xiàn)后，iPhone6尺寸成了大多數(shù)設(shè)計(jì)師的選擇。

一、iPhone6的界面布局是：

屏幕是4.7英寸的，設(shè)計(jì)稿的大小750x1334px

☆ 狀態(tài)欄(status bar)：就是電量條，其高度為：40px；

☆ 導(dǎo)航欄(navigation)：就是頂部條，其高度為：88px；

☆ 主菜單欄(submenu，tab)：就是標(biāo)簽欄，底部條，其高度為：98px；

☆ 內(nèi)容區(qū)域(content)：就是屏幕中間的區(qū)域，其高度為：1334px-40px-88px-98px=1108px

二、關(guān)于iPhone6的圖標(biāo)的尺寸是：

☆導(dǎo)航欄的圖標(biāo)高度為44px（絕大部分功能按鈕）左右，標(biāo)簽欄的圖標(biāo)尺寸為50x50px左右，最大為96x64px。

☆關(guān)閉按鈕34px*34px，返回按鈕26px，簡(jiǎn)單筆畫圖標(biāo)40px。

三、常用的可點(diǎn)擊高度-登陸框、密碼框、功能列表等，統(tǒng)一設(shè)成88px。

四、搜索欄、輸入框、評(píng)論框、地址框的高度，在iPhone6的原型圖上，統(tǒng)一設(shè)成58px或60px。

五、在iPhone6設(shè)計(jì)稿中，界面元素之間的常用距離。

常用間距-親密距離：20px（與邊緣距離）；疏遠(yuǎn)距離：30px；

其它距離-10px，44px等；

區(qū)塊間隔：30-40px。

A、疏遠(yuǎn)距離：比如，改圖標(biāo)距離手機(jī)屏幕最左邊的距離；

B、親密距離：比如，左邊圖標(biāo)與右邊文字之間的距離。

六、黑白灰顏色常用的數(shù)值是：

① 文字黑色#333

② 文字深灰色#666

③ 文字淺灰色#999

④ 邊框淺灰色#e5e5e5

⑤ 背景淡灰色#f2f2f2

⑥ 按鈕背景純白色#ffffff

一、注意事項(xiàng)

1、在每個(gè)項(xiàng)目設(shè)計(jì)中只使用1-2個(gè)字體樣式，而在品牌字有明確的規(guī)范的情況下，只需要一種字體貫穿全文，通過(guò)對(duì)字體放大來(lái)強(qiáng)調(diào)重點(diǎn)文案。字體用的太多，越顯得不夠?qū)I(yè)。

2、不同的樣式的字體，形狀或系列最好相同，保證字體風(fēng)格的一致性。

3、字體與背景的層次要分明,確保字體樣式與色調(diào)氣氛相匹配

二、界面中文字選用的規(guī)則

在不同平臺(tái)的界面設(shè)計(jì)中規(guī)范的字體會(huì)有不同，像移動(dòng)界面的設(shè)計(jì)就會(huì)有固定的字體樣式，網(wǎng)頁(yè)中會(huì)有常用的幾個(gè)字體。

以下是在72像素/英寸下的規(guī)范

移動(dòng)端常規(guī)字體

IOS:常選擇華文黑體或者冬青黑體，尤其是冬青黑體效果最好， 方正蘭亭黑和方正黑體簡(jiǎn) 、方正中等線也運(yùn)用的比較多。

三、字體的大小

1、導(dǎo)航欄的文字大小是36-38px；

2、標(biāo)題字號(hào)：32px ，34px；

3、內(nèi)容區(qū)域的正文文字大小是：28px，30px；

4、輔助性文字：20px ， 24px，26px；

5、標(biāo)簽欄（或主菜單欄）的圖標(biāo)下方的文字大小為20px；

6、終極原則：不大于所在要件高度的一半;

7、行間距：字號(hào)的1.2-1.5倍。

下圖是百度用戶體驗(yàn)做過(guò)的一個(gè)小調(diào)查，可以看出用戶可接受的文字大小：

關(guān)于APP界面設(shè)計(jì)尺寸和ui設(shè)計(jì)手機(jī)界面尺寸的介紹到此就結(jié)束了，不知道你從中找到你需要的信息了嗎 ？如果你還想了解更多這方面的信息，記得收藏關(guān)注本站。