欢迎来到天天文库
浏览记录
ID:40607188
大小:644.63 KB
页数:14页
时间:2019-08-04
《移动UI设计规范1.0》由会员上传分享,免费在线阅读,更多相关内容在行业资料-天天文库。
1、公司移动UI设计规范说明书移动UI设计规范说明书修改记录制定日期生效日期制定/修订内容摘要版本拟稿审查2015.092015.09初稿0.12015.082015.08修订1.01、前言本文档主要为UI设计师和前端工程师提供设计参考和最佳实践,避免相互之间出现技术衔接脱节的问题。文档将由设计尺寸、界面元素、设计细节、切图细节四个部分组成,分别说明如下。2、设计尺寸本节主要阐明目前主流浏览设备和软件中的界面尺寸,相关设备和软件分别为iPhone、iPad、Android、Web。详细说明如下2.1iPhon
2、eiPhone界面尺寸设备分辨率状态栏高度导航栏高度工具栏高度6Plus1080x192054px132px146px6750x113440px88px98px5S640x113640px88px98px5C640x113640px88px98px5640x113640px88px98px4S640x96040px88px98px4640x96040px88px98px2/14移动UI设计规范说明书iPhone图标尺寸设备分辨率圆角大小IOS6-90px-1024px图标宽度x0.175IOS790px-
3、1024px图标宽度x0.225图标类型6Plus@36&5@24S@2iPad@2iPad2@1AppIcon180x180120x120120x120156x15676x76AppStoreIcon1024x10241024x10241024x10241024x10241024x1024Spotlight搜索Icon120x12080x8080x8080x8040x403/14移动UI设计规范说明书图标类型6Plus@36&5@24S@2iPad@2iPad2@1工具和导航栏图标66x6644x444
4、4x4444x4422x22标签栏图标75x7550x5050x5050x5025x252.2iPadiPad界面尺寸设备分辨率状态栏高度导航栏高度工具栏高度6&Air22048x153640px88px98px5&Air&mini22048x153640px88px98px4&mini2048x153640px88px98px32048x153640px88px98px21024x76820px44px49px11024x76820px44px49px4/14移动UI设计规范说明书iPad图标尺寸设备分
5、辨率圆角大小IOS6-90px-1024px图标宽度x0.175IOS790px-1024px图标宽度x0.225图标类型iPad@2iPad2@1AppIcon156x15676x76AppStoreIcon1024x10241024x1024Spotlight搜索Icon80x8040x40工具和导航栏图标44x4422x22标签栏图标50x5025x252.3Android屏幕尺寸指实际的屏幕物理尺寸,以屏幕对角线来测量。为方便起见,Android把屏幕大小分为广义的四类:小、正常、大、特大。像素代
6、表屏幕上一个物理的像素点。5/14移动UI设计规范说明书屏幕密度为解决Android设备中屏幕的碎片化,Android厂商引入了DP的概念。即一定尺寸屏幕显示像素的数量,因此有了四类屏幕密度:低(120dpi),中(160dpi),高(240dpi),超高(320dpi),而像素=DP*(dpi/160)。例如一个240dpi的屏幕里,1DP=(240/160)=1.5px。因此,设计尺寸确认后,以图标为例,需向上或向下做小、正常、大、特大,以及低、中、高、超高的图标尺寸与密度来适配不同的机型。典型的设计
7、尺寸320dp:一个普通的手机屏幕(240x320,320x480,480x800)480dp:一个普通的平板(480x800)600dp:7寸平板(600x1024)720dp:10寸平板(720x1280,800x1280)Android模拟机尺寸屏幕大小低密度中密度高密度超高密度小屏幕240x320480x640240x400480x800正常屏幕320x480640x960240x432600x1024480x800大屏幕480x800600x1024768x10241920x11202048x1
8、536特大屏幕600x1024768x12801920x12002560x1600720x1280安卓设计尺寸建议为720x1280或是480x8006/14移动UI设计规范说明书Android图标尺寸屏幕大小启动图标标签栏图标列表图标320x48048x4832x3216x16480x80072x7248x4824x24640x960600x1024768x102496x9664x6432x32720x12801080x19
此文档下载收益归作者所有