设计安卓APP,成品图标模糊,是切图问题吗,切图需要注意什么

 我来答
天空依静8844
2017-06-12 · TA获得超过1158个赞
知道小有建树答主
回答量:1046
采纳率:33%
帮助的人:546万
展开全部

一.android版

在做android版本设计的时候,尺寸有很多种,这时我们要以一种尺寸为基准,那这个基准尺寸是480px*800px,设计图完成之后就开始切图了,我拿我之前设计的一张图为例子讲解下:


当看到上边这张设计图的时候,我们首先分析下应该给技术切哪些图(为了避免以后少改动,建议切图之前最好和技术先沟通下,怎么切);

1、底部栏目的icon和背景:

这个一般有2种切法:(有默认和选中之后的效果)


2、顶部栏目的背景切图:

由于顶部导航栏的是渐变样式,所以切图只需要切一小条,技术来平铺拉伸就可以~(PS:如果是花纹背景,就必须切整条了,因为花纹切一小条就会被拉伸了~)

3、标注文字大小和行间距:(以这张图为例子,我标注好了,请看下图)

需要注意的:

A:android主要有3种屏,即:

QVGA和WQVGA屏density=120;

HVGA屏density=160;

WVGA屏density=240;

B:apk的资源包中,

当屏幕density=240时使用hdpi标签的资源

当屏幕density=160时使用mdpi标签的资源

当屏幕density=120时使用ldpi标签的资源;

C:我们标注的是PX,但是技术的算法是DP,所以需要PX和DP进行转化,PX和DP的转化主要跟密度有关系,当密度density=160即(屏幕尺寸:320*480)时,1PX=1DP;当密度density=240即(屏幕尺寸:480*800)时,1PX=0.75DP;当屏幕的尺寸大于480*800的时候,密度都按照240计算即可;当密度density=120即(屏幕尺寸:240*320)时,这个现在几乎没有人用了,所以我也不知道转化公式,如果您知道,可以留言告诉我啊~

注意:因为我们做的是基于480*800尺寸的,大家都知道android的尺寸太多了,要想适配现在流行的尺寸,比如:640*960;720*1280等,唯一的解决办法就是图标可以根据不同尺寸各做一套,也就是图标需要做480、640和720共3套图标,不过如果你们的产品的要求不严格,做一套就可以,只不过是在大于480尺寸的屏幕上有些图标被拉大变虚而已~

二.ios版

在做ios版本设计的时候,尺寸有3种,分别是:320*480、640*960、640*1136;这时我们要以一种尺寸为基准,那这个基准尺寸是640px*960px,设计图完成之后就开始切图了,我拿我之前设计的一张图为例子讲解下:


当看到上边这张设计图的时候,我们首先分析下应该给技术切哪些图(为了避免以后少改动,建议切图之前最好和技术先沟通下,怎么切);

1、底部栏目的icon和背景:

这个一般有2种切法:(有默认和选中之后的效果)


2、顶部栏目的背景切图:

由于顶部导航栏的是多颜色的,所以只能切一整条给技术,商圈的图标要单独切出来


3、二级标题栏目的切图:


4、主体栏目的切图:


5、标注文字大小和行间距:(以这张图为例子,我标注好了,请看下图)

需要注意的:

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

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

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

注意:因为我们做的基于640*960尺寸的,ios共有3套尺寸,因为640*960和640*1136的宽度是不变的,所以图标没有变化重新切,只是行间距需要调整下;320*480尺寸的是640*960的一半,所以技术完全可以根据你标注的640的尺寸做就可以~

三.android和ios的转化关系

  1. 因为ios的尺寸是640*960,android当密度等于120即(320*480)时,1PX=1DP,所以android和ios的标注像素之间的换算关:即ios像素尺寸*1/2=android dp尺寸;

  2. 2.如果你们的产品同时做android和ios,你只想标注一套尺寸的时候,就可以标注ios版的标注去计算即可。

小武同学Silence
2021-02-22 · TA获得超过183个赞
知道小有建树答主
回答量:1196
采纳率:100%
帮助的人:61.7万
展开全部
如果题主是因为技术套用后出现的模糊,

可能没提供3倍图,这样在更高分辨率时,图标就会模糊,因为被人为放大了,PNG是位图,是不能无限放大的。
这跟你建立界面的初始分辨率有关系,比如你是按照640与750分辨率为基础画布,那么图标本身就是2倍图(关于倍图关系,建议去百度一下相关技术类文章)。放到更高分辨率的手机上,就会被人为变大,由于是位图,放大后有些图标会有明显的失真。
我习惯用高倍图(1080分辨率)做基础画布,这样缩小的时候有很多图标是不会失真的,失真的一部分重绘也方便,这个倒没有规范,按照你个人喜好来就行了。
目前比较普遍的解决方案就是要针对3倍图进行一次图标的重绘,提供3倍图让技术能向上兼容更高分辨率,技术通过代码根据用户的手机分辨率来判断使用那个倍图。
按照这个道理,你可能还要提供1倍图,向下兼容。

就我的了解,目前没有什么准确的规定,设计师最终要完成的就是各个终端都能保持良好的效果,技术团队的习惯也会影响你输出的方法,所以最好是与技术团队沟通一下。
--------------------------
补充:如果是倍图输出的问题,关于命名与文件夹规范也请及时与技术团队同步或沟通,确定一致性与可用性。
-------------------------
如果是在电脑端出现模糊,应该跟手机端一个意思,使用了等比放大适应分辨率的代码,这样你基础设计如果不是高分辨率,放大后自然是模糊的。
这与你PS中使用那种格式来绘制没什么关系,跟输出有关系。如果直接输出就模糊,那估计只可能是存储PNG时使用了8位色,而通常我们存储的都是24位色PNG。

以上内容因为看不到题主的图片,都是猜测的。另外关于切图如果想系统的说清楚,还是蛮多,能满足输出与技术要求就好。
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式