Hi,are you ready?

准备好开始了吗?
那就与我们取得联系吧

有一个品牌项目想和我们谈谈吗?您可以填写右边的表格,让我们了解您的项目需求,这是一个良好的开始,我们将会尽快与你取得联系。当然也欢迎您给我们写信或是打电话,让我们听到你的声音!

厦门广川网络有限公司

地 址:厦门市思明区嘉联街道新景中心

电 话:0592-5720538

E-mail:4576980043@qq.com

填写您的项目信息

讲讲Android和ios的界面标注图的区别是什么

作者:admin 时间:2020-09-07

  关于APP标注的知识和文章,网上有大把大把的!而且,老谭继续跟大家总结一下iOS的界面标注和Android界面标注的区别和相应的规范。也是回答某一些童鞋的想要知道iOS端和android的标注有什么区别。

  到底需要我们标注哪些内容呢?

  所有的APP界面标注总结起来就是:标文字,标图片,标间距,标区域;

  1、iOS端的界面标注规范:

  

  需要注意的:

  A:我们标注的尺寸是像素px,如果技术那边的实际运用到技术中的是像素的一半,即像素的一半=技术的尺寸(比如 2px=1pt);例如:“分类”2个字,我标准的是36px,技术那边的尺寸就是18pt;

  B:所有文字,行间距的标注的尺寸都是偶数;因为技术那边都是根据我们的尺寸除以2;

  C:颜色的标注有的技术要求16进制,有的技术要求RGB,由于页面的限制所以我只标注了16进制的,按16进制和RGB都标注的是最好的~

  颜色的16进制例子:#66cc66 就是我们常用的颜色值。

  颜色的RGB例子:RGB(102,204, 100) 我们H5前端会用到的

  平台不一样,标注的方法和相对应的标注元素也会不同。如下图所示:

  

  2、Android端的界面标注规范:

  %E5%AE%89%E5%8D%93APP%E6%A0%87%E6%B3%A8%E5%9B%BE.jpg

  安卓需要标注的如上图案例所示,比如图片需要标注宽高。

  图片距离上下左右的距离,文字大小颜色,这里的文字其实算两个控件,标题文字以及说明文字,需要单独标出等。

  3、iOS和Android的界面标注图的区别汇总。

  安卓标注

  1、设计时,用1280*720的设计稿进行设计

  2、切图时, 切hdpi,xhdpi,xxhdpi三套分辨率的图标和引导页

  3、标注时,距离用DP,字号用sp

  ios标注

  1、设计时,用1334*750的设计稿进行设计

  2、切图时, 切的@2x,@3x图标和引导页

  3、标注时,距离和字号用pt或者px

  4、APP界面标注的目的

  为了保证视觉设计稿的高品质呈现,同时也是给程序员更好的做界面适配。

  一个好的设计标注是APP设计还原的有效保证,也是提高开发效率的保障!

  

  5、当然,说到了APP界面标注,也要跟大家推荐3个不错的标注工具。

  (1)pxcook像素大厨

  师效率提升利器,让你专注于设计本质,不再为标注切图而烦恼,从设计到实现一气呵成。

  (2)parker

  Parker是一款运行在photoshop中的标注插件,它能够自动计算图层的尺寸、位置、距离等元素,自动为你生成标注。它操作简单,数据精确,能够识别文字图层各种属性,自动为你标注。从此告别手工标注界面的时代!属于Cutterman旗下的产品。

  (3)标你妹 啊

  一款师必备的UI自动标注工具。一款在线的标注的工具。

返回列表

RELATED CASE

相关案例

网站公告

建立网站步骤?注意以下几点轻松掌握

一个网站的建立并不是像大家所想的那么...

网站公告

网页设计的原则有哪些?这些一定要遵守

在进行网页设计的时候一定要考虑到消费...

网站公告

常见的网站建设需求要做到的几点

对于很多朋友们来说,网站建设已经成为...

网站公告

做网站的公司:网站建设应注意的4个方面

做网站的公司:网站建设应注意的4个方面...

网站公告

专业2016年UX趋势

专业做网站你也不会有任何困难找到趋势...

Are you interested in ?

感兴趣吗?

有关我们服务的更多信息,请联系

0592-5720538

与我们合作

与我们合作,您将会得到更成熟的品牌建设服务。我们以客户至上,同时也相互挑战,力求呈现最好的品牌建设成果。

品牌咨询热线:

0592-5720538

填写您的项目信息

TOP

4576980043

0592-5720538