产品经理大会、运营大会20+场

感觉 急速飞驰 浏览

小编:刚开始接触UI的时候,碰到的最多的就是尺寸问题,什么画布要建多大、文字该用多大才合适、我要做几套界面才可以?什么七七八八的也着实让人有些头疼。 (以上单位都是像素哦,

  刚开始接触UI的时候,碰到的最多的就是尺寸问题,什么画布要建多大、文字该用多大才合适、我要做几套界面才可以?什么七七八八的也着实让人有些头疼。

  (以上单位都是像素哦,至于分辨率一般网页UI和移动UI基本上都只要72 ppi)

  当然,在设计的时候并不是每个尺寸都要做一套,尺寸按自己的手机尺寸来设计,比较方便预览效果,一般用640960或者6401136的尺寸设计。

  iPhone的APP界面一般由四个元素组成,分别是:状态栏、导航栏、主菜单栏以及中间的内容区域

  这里取用640960的尺寸设计,那我们就说说在这个尺寸下这些元素的尺寸:

  状态栏:就是我们经常说的信号、运营商、电量等显示手机状态的区域,其高度为:40 px

  导航栏:显示当前界面的名称,包含相应的功能或者页面间跳转的按钮,其高度为:88 px

  主菜单栏:类似于页面的主菜单,提供整个应用的分类内容的快速跳转,其高度为:98 px

  内容区域:展示应用提供的相应内容,整个应用中布局变更最为频繁的,其高度为:734 px

  P.S. 在最新的 iOS7 的风格中,苹果已经开始慢慢弱化状态栏的存在,将状态栏和导航栏合在了一起,但是再怎么变化,尺寸高度也还是没有变化的,只不过大家再设计 iOS7 风格的界面的时候多多注意一下~

  下图是百度用户体验做过的一个小调查,可以看出用户可接受的文字大小,像素为单位,也就是大家在PS里的文字像素大小。

  P.S. 多留心下一些大公司的数据研究,你会发现很多你根本没考虑到的问题哦~

  其实还有个更简单的方法就是找你觉得好的APP应用,手机截图后放进PS自己对比调节字体大小咯~

  总之,方法是自己找的,想办法解决问题,自己实践,比别人告诉你印象更深刻不是么~?

  Android 比 iPhone 的尺寸多了很多套,建议取用7201280这个尺寸,这个尺寸 7201280中显示完美,在 10801920 中看起来也比较清晰;切图后的图片文件大小也适中,应用的内存消耗也不会过高。

  Android 的 APP 界面和 iPhone 的基本相同:状态栏,导航栏、导航栏、主菜单栏以及中间的内容区域。

  Android 中我们取用7201280的尺寸设计,那我们就说说在这个尺寸下这些元素的尺寸:

  Android最近出的手机都几乎去掉了实体键,把功能键移到了屏幕中,当然高度也是和菜单栏一样的:96 px

  P.S. 写之前我翻了好多关于 Android 的界面尺寸教程,都没找到像iOS一样具体的规范,或许因为在安卓中这些控件的高度都能用程序自定义~都没有提到具体的尺寸数值,所以就自己找了 Android 的设计规范,尺寸都是自己在PS中量的~~

  Android 为了在界面上区别于 iOS ,Android 4.0 开始提出一套HOLO的UI风格,一些APP的最新版都采用了这一风格。

  这一风格最明显的变化就是将下方的主菜单移动到了导航栏下面,这样的方式解决了现在很多手机去除实体按键后在屏幕中显示而出现的双底栏的尴尬情景。

  具体大小,还是那句话,找自己喜欢的APP界面,手机截图后放进PS自己比对调节字体大小(切记,一定要是高清截图哦~)

  我觉得这么设计还是有问题 因为程序排版的时候不是和实际屏幕分辨率一一对应的 比如iphone5s是640px宽 但是程序排版是320px 这中间的关系不能单纯除以2啊

  【每日一问】一个有点意思的问题:为什么菜市场有卖水果,水果店不卖蔬菜?

  百度外卖更名饿了么星选“,主打高端市场,那么你期待的高端外卖有什么不一样的属性?

  人人都是产品经理(是以产品经理、运营为核心的学习、交流、分享平台,集媒体、培训、招聘、社群为一体,全方位服务产品人和运营人,成立8年举办在线+期,线+场,太阳城娱乐城产品经理大会、运营大会20+场,覆盖北上广深杭成都等15个城市,在行业有较高的影响力和知名度。平台聚集了众多BAT美团京东滴滴360小米网易等知名互联网公司产品总监和运营总监,他们在这里分享知识、招聘人才,与你一起成长。

当前网址:http://www.builder.org.cn/linggan/app/1155.html

 
你可能喜欢的: