Android与iOS视觉规范.docx

Android与iOS视觉规范2016-09-07狂奔小米粒设计中的拿来主义………………刚出道米粒一枚，数据显示Android市场占比越来越大，我却死磕iOS这样以后怎么立足射击圈于是查阅大量资料看到这个数据心里暗自欢喜（国产手机崛起）在我接触UI设计到现在近两年的时间里身边的学哥学姐总是对我说按照iOS规范出图就可以（没有主见说啥是啥……）于是乎……Android规范差点被我遗弃掉近期恶补规范，将其总结如下? ? Android规范?安卓中dp为距离单位、sb为字号单位1.界面尺寸?（在安卓中，系统密度为160dpi的中密度手机屏幕为基准屏幕）320*480 ? ? ? ? ? ? 1dp=1px480*800 ? ? ? ? ? ? 1dp=1.5px720*1280 ? ? ? ? ? 1dp=2px1080*1920 ? ? ? ? 1dp=3px???Idpi :mdpi : hdpi : xhdpi : xxhdpi = 3 : 4 : 6 : 8 : 122.界面元素尺寸(在Android中高度可用程序自定义无严格要求）状态栏：50px导航栏：120px标签栏：120px图标大小：96*96pxbut…………状态栏高度+导航栏高度=128px3.字体字号(sp与px尺寸换算和dp与px换算一样 ? ? 例如：320px中 ?1px=1dp=1sp、720px中 ? 1dp=2px=2sp）?Android：英文字体Roboto? ? ? ? ? ? ? ? ?中文字体 droid sans fallback (谷歌自己的字体 ?近似方正兰亭细黑）字体大小没有严格标准（可以截个字体显示舒服的页面直接拖到设计软件里比对字体大小）常用4种字号：40px ? ?32px ? ?28px ? ?24px ? (20sp ?16sp ?14sp ?12sp)注意啦~ 若是设计稿以px为单位，在后期标注时一定要告知程序猿们当前标注的密度他们需要进行换算例如：xhdpi ? ? 1dp=2px=2sp? ? ? ? ? ? ? ? ?? ?iOS规范1.界面尺寸?界面四元素：?状态栏（status bar）? ? ? ? ? ? ? ? ? ? ?导航栏（navigation）? ? ? ? ? ? ? ? ? ? ?主菜单栏（submenu）? ? ? ? ? ? ? ? ? ? ?内容区域（content）2.图标尺寸3.字体字号ios：英文字体 ?HelveticaNeue? ? ? ? 中文字体 ?Heiti SC ?(黑体-简）字体大小没有严格标准（可以截个字体显示舒服的页面直接拖到设计软件里比对字体大小）常用4种字号：40px ? ?32px ? ?28px ? ?24px ? (iOS中字体不建议小于22px)…………………………?? ? ? ? ??往往设计稿出来后界面设计么有什么问题还是会被退回来从新修改界面设计没有问题的前提下一定要注意一些细节不然辛苦一大顿结果还是………………继续改、改、改? ? ? ? ? ? ??颜色标示规范iOS开发可以根据色值换算出颜色，但Android开发有时根据RGB换算颜色，所以建议两种标示方式都表示出来效果展示如下图~? ? ?? ??切图命名规范有一种痛叫做图切完了名字取乱套了！设计时采用高分辨率设备来制作，切图的时候我们通常需要给程序猿两套图在原设计稿中出题套，再保存一次50%的图以供网络状态不佳时使用命名规则：模块_类别_功能_状态.png例如： nav_button_search_default.png（导航_按钮_搜索_默认.png）