移動(dòng)端界面設(shè)計(jì)之尺寸篇

參考蘋果官方文檔尺寸詳見:

image.png

IOS界面750 x 1334 設(shè)計(jì)稿尺寸(單位是1pt=2px):

iPhone 新機(jī)型 : 狀態(tài)欄高度 44pt 、導(dǎo)航欄高度 44pt 斯够、 TabBar高度 49pt萎庭、 Home條68px
iPhone 舊機(jī)型 : 狀態(tài)欄高度 20pt 、導(dǎo)航欄高度 44pt 、 TabBar高度 49pt
間隔快:16pt

安卓界面720 x 1280 設(shè)計(jì)稿尺寸(1dp=2px):

安卓機(jī)型 : 狀態(tài)欄高度 25dp 因谎、導(dǎo)航欄高度 48dp 闹获、 TabBar高度 48dp


IOS啟動(dòng)頁尺寸16個(gè):

我們單位自己項(xiàng)目的啟動(dòng)圖
啟動(dòng)圖尺寸 機(jī)型 倍數(shù) 開發(fā)尺寸
320×480 iPhone3GS @1x 320×480
640?×?960 iPhone4s Default@2x 320×480
640?×?1136 iPhone5s Default-568h@2x 320×568
750?×?1334 iPhone6.7.8 Default-667h@2x 375×667
1242?×?2208 iPhonePlus(6+/7+/8+) Default-736h@3x 414×736
1125?×?2436 iPhoneX期犬、XS Default-812h@3x 375×812
828 x 1792 iPhoneXR Default-828h@2x 414×896
1242 x 2688 iPhoneX Max Default-1242h@3x 414×896
1792×828 iPhoneXR_橫向 -- --
2208×1242 iPhonePlus_橫向 -- --
2436×1125 iPhoneX, XS_橫向 -- --
2688×1242 iPhoneX Max_橫向 -- --
768×1024 iPad(舊版) -- --
2048×1536 iPad(新版)+ iPad mini 4 -- --
1024×768 iPad(舊版)_橫向 -- --
1536×2048 iPad(新版)+ iPad mini 4_橫向 -- --
--- --- --- ---
2732×2048 12.9 英寸 iPad Pro -- --
2388×1668 11 英寸 iPad Pro -- --
2224×1668 10.5 英寸 iPad Pro -- --
1024×1366 iPad Pro(舊版) -- --

IOS圖標(biāo)的13個(gè)尺寸、不需要切圓角

20×20避诽、 29×29哭懈、 40×40、 58×58茎用、 60×60、 76×76睬罗、80×80轨功、87×87、120×120容达、152×152古涧、167×167、180×180花盐、 1024×1024羡滑、

參考Xcode開發(fā)工具

安卓圖標(biāo)4個(gè)尺寸、圓角切圖設(shè)計(jì)多大才合適

72×72算芯、96×96柒昏、 144×144、 192×192


參考小米的安卓圓角切圖

常見的字體大形踝帷:

24px职祷、28px、32px届囚、36px等等有梆。記住是偶數(shù)的。最小字號20px意系。

界面里的小圖標(biāo)常見的尺寸:

96px泥耀、128px等,因?yàn)橐紤]iPad的適配蛔添,個(gè)人覺要把圖標(biāo)做的大一些


設(shè)計(jì)稿實(shí)時(shí)預(yù)覽:

Ps安裝一個(gè)Ps Mirror可以在手機(jī)上實(shí)時(shí)觀看效果痰催。(60塊錢)

sketch安裝一個(gè) 藍(lán)湖可以在手機(jī)上實(shí)時(shí)觀看效果。(免費(fèi))
強(qiáng)烈推薦"藍(lán)湖"作郭。最好用的插件陨囊,沒有之一

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市夹攒,隨后出現(xiàn)的幾起案子蜘醋,更是在濱河造成了極大的恐慌,老刑警劉巖咏尝,帶你破解...
    沈念sama閱讀 217,826評論 6 506
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件压语,死亡現(xiàn)場離奇詭異啸罢,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)胎食,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,968評論 3 395
  • 文/潘曉璐 我一進(jìn)店門扰才,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人厕怜,你說我怎么就攤上這事衩匣。” “怎么了粥航?”我有些...
    開封第一講書人閱讀 164,234評論 0 354
  • 文/不壞的土叔 我叫張陵危队,是天一觀的道長涂佃。 經(jīng)常有香客問我,道長,這世上最難降的妖魔是什么棚瘟? 我笑而不...
    開封第一講書人閱讀 58,562評論 1 293
  • 正文 為了忘掉前任握牧,我火速辦了婚禮诲泌,結(jié)果婚禮上合瓢,老公的妹妹穿的比我還像新娘。我一直安慰自己杨凑,他們只是感情好滤奈,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,611評論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著蠢甲,像睡著了一般僵刮。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上鹦牛,一...
    開封第一講書人閱讀 51,482評論 1 302
  • 那天搞糕,我揣著相機(jī)與錄音,去河邊找鬼曼追。 笑死窍仰,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的礼殊。 我是一名探鬼主播驹吮,決...
    沈念sama閱讀 40,271評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼晶伦!你這毒婦竟也來了碟狞?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,166評論 0 276
  • 序言:老撾萬榮一對情侶失蹤婚陪,失蹤者是張志新(化名)和其女友劉穎族沃,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,608評論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡脆淹,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,814評論 3 336
  • 正文 我和宋清朗相戀三年常空,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片盖溺。...
    茶點(diǎn)故事閱讀 39,926評論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡漓糙,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出烘嘱,到底是詐尸還是另有隱情昆禽,我是刑警寧澤,帶...
    沈念sama閱讀 35,644評論 5 346
  • 正文 年R本政府宣布蝇庭,位于F島的核電站为狸,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏遗契。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,249評論 3 329
  • 文/蒙蒙 一病曾、第九天 我趴在偏房一處隱蔽的房頂上張望牍蜂。 院中可真熱鬧,春花似錦泰涂、人聲如沸鲫竞。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,866評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽从绘。三九已至,卻和暖如春是牢,著一層夾襖步出監(jiān)牢的瞬間僵井,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,991評論 1 269
  • 我被黑心中介騙來泰國打工驳棱, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留批什,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 48,063評論 3 370
  • 正文 我出身青樓社搅,卻偏偏與公主長得像驻债,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個(gè)殘疾皇子形葬,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,871評論 2 354

推薦閱讀更多精彩內(nèi)容

  • 工程概況 本工程位于集美區(qū)杏濱中心小學(xué)內(nèi)合呐,本工程為地下一層,地下建筑面積6845.64平方米笙以,設(shè)計(jì)地下停車位215...
    小潭潭閱讀 304評論 0 1
  • js 變量提升 首先 javascript 是一種弱類型淌实、動(dòng)態(tài)的、解釋型的腳本語言。 弱類型:類型檢查不嚴(yán)格翩伪,偏...
    Mo_ham_med閱讀 203評論 0 1
  • 片子這么好微猖,奈何沒流量,愛看4G也是一卡一卡的缘屹,忒煩惱凛剥。不說了,不如去學(xué)習(xí)吧轻姿。
    youngerest閱讀 237評論 0 0
  • 那是2017年8月30互亮,有點(diǎn)秋意犁享,那一天記憶猶新。而那天對我以及整個(gè)家庭來說是災(zāi)難性的一天豹休。那一天媽媽逼逼叨...
    yc荏苒閱讀 201評論 0 0
  • “推動(dòng)我不斷向前的唯一動(dòng)力炊昆,是我喜歡我做的事”
    3小俠閱讀 181評論 0 0