UI设计尺寸规范小结 (未完,待续... )

北京/设计爱好者/6年前/1208浏览
UI设计尺寸规范小结 (未完,待续... )

给设计规范做了整理,方便日后查看~

IOS 分辨率及栏高度     

设备型号

分辨率

倍率

状态栏

导航栏

标签栏

页边距

iPhone6/7/8(pre)

1242*2208

3X

60 PX

132 PX

146 PX

34 PX

iPhone6/7/8

750*1334

2X

40 PX

88 PX

98 PX

24 PX


IOS 图标尺寸

设备型号

导航栏

标签栏

  APP Store 程序应用

启动图标 

iPhone6/7/8(p)

66*66 PX

75*75 PX

1024*1024PX
180*180 PX
114*114 PX

iPhone6/7/8

44*44 PX

50*50 PX

1024*1024PX 120*120 PX
114*114 PX


IOS 文本规范

字体:平方

34px:用于导航栏标题,按钮文字、列表文本、警告框标题、弹窗标题、表格视图的文本标               题、 通常都使用粗体或黑体来突出文本的重要性。

 

30px:用于文本标题、正文。

 

28px:在iOS原生应用中很少出现,在其他应用中通常用于副标题、正文、段落文本。

 

26px:常用的字号,可用于副标题、辅助性或提示文本。

 

24px:在界面中显示偏小、辅助文本。


22px:用于页面底部提示性文字。



Android 分辨率及栏高度


分辨率

DPI

状态栏

导航栏

标签栏

720*1280

XHDPI

50PX

96PX

96PX

1080*1920

XXHDPI

60PX

144PX

150PX


Android 图标尺寸

分辨率

启动图标

标签栏图标

系统通知图标

720*1280

96PX

32*32PX

24*24PX

1080*1920

144PX

96*96PX

72*72PX

* 做1024*1024 PX 的尺寸,一般做方角无圆角,直接切图即可。


Android 文本规范

字体:雅黑

字体大小一般是24到34,是2的倍数;



4
Report
|
27
Share
评论
in to comment
Add emoji
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
You may like
Penny妹妹抽象表情包
Homepage recommendation
大家都在看
Log in