App Interface design specifications for iOS and Android

Document the interface design specifications of iOS and Andoird to facilitate standard product design and smooth communication with designers

iOS articles Interface Dimensions

Equipment	resolution	Status Bar Height	Navigation Bar Height	tab Bar Height
IPhone6 Plus	1242x2208 px	60px	132px	147px
IPhone6	750x1334 px	40px	88px	98px
iphone5/5s/5c	640x1136 px	40px	88px	98px
Iphone4/4s	640x960 px	40px	88px	98px
Ipad3/4/air/air2/mini2	2048x1536 px	40px	88px	98px
Ipad1/2	1024x768 px	20px	44px	49px
IPad Mini	1024x768 px	20px	44px	49px

Paste_image.png icon Size Toolbars

Equipment	App Store	Program Application	Home Screen	Spotlight Search	Tab Bar	and navigation bars
IPhone6 Plus	1024*1024px	180*180px	144x144px	87x87 px	75*75px	66*66px
IPhone6	1024*1024px	120*120px	144x144px	58*58px	75*75px	44*44px
iphone5/5s/5c	1024*1024px	120*120px	144x144px	58*58px	75*75px	44*44px
Iphone4/4s	1024*1024px	120*120px	144x144px	58*58px	75*75px	44*44px
Ipad3/4/air/air2/mini2	1024*1024px	180*180px	144x144px	100*100px	50*50px	44*44px
Ipad1/2	1024*1024px	90*90px	72*72px	50*50px	25*25px	22*22px
IPad Mini	1024*1024px	90*90px	72*72px	50*50px	25*25px	22*22px

Font

The font on the IPhone is: Helveticaneue As for the Chinese language, the MAC uses the black body-Jane, win is the Chinese blackbody, all the fonts to use a double-digit number.

Baidu user experience has done a small survey, the application of font size survey results are as follows:

Paste_image.png Color value

iOS color values take RGB color values such as a certain color value, given iOS development color value is R:12 g:34 b:56 gives the value is 12,34,56 (sometimes also according to the development habits, sometimes hex)

Interior Design

1, all can click the picture must not be less than 44px (retina needs 88px)
2. The individual components must be even size
3, twice times the graph with @2x as the name suffix
4, fully consider the style of each control button in the 4 state,

Paste_image.pngandroid article Interface Dimensions

android的尺寸众多，建议使用分辨率为720x1280 的尺寸设计。这个尺寸 720x1280中显示完美，在 1080x1920 中看起来也比较清晰；切图后的图片文件大小也适中，应用的内存消耗也不会过高。

Status bar height: px
Navigation bar Height: px
Label Bar height: px
Android recently out of the mobile phone almost removed the entity keys, the function keys moved to the screen, of course, height is the same as the tab bar:
Content area Height: 1038 px (1280-50-96-96=1038)

Chart size

Screen Size	Start icon	Action Bar icon	context Icon	system notification icon (white)	most fine strokes
320x480 px	48x48 px	32x32 px	16x16 px	24x24 px	No less than 2 px
480x800px/480x854px/540x960px	72x72 px	48x48 px	24x24 px	36x36 px	No less than 3 px
720x1280 px	48x48 DP	32x32 DP	16x16 DP	24x24 DP	No less than 2 DP
1080x1920 px	144x144 px	96x96 px	48x48 px	72x72 px	No less than 6 px

Ps:android Design specification, the unit used is DP, DP on the Android machine on the different density conversion px is not the same

Font

The fonts on Android are: Droid sans fallback, Google's own font, and Microsoft ya black very much like.
The Android font size survey concludes that:

Paste_image.png Color value

Android color value is 16 binary value than a green value, giving the developed value is #5bc43e

App Interface design specifications for iOS and Android