Image 缩放PNG图像时看起来模糊

Image 缩放PNG图像时看起来模糊,image,resize,png,scale,Image,Resize,Png,Scale,我是一名视觉/用户界面设计师,从事由其他设计师设计的项目/产品。此设计器为前端开发人员提供了高质量的PNG图标,但当前端开发人员将图像比例设置为0.7时,它们看起来很模糊 我注意到,如果我们将图像的比例设置为0.5,它们看起来一点也不模糊: 0.7:[1]: 0.5:[2]: 有人知道为什么会这样吗 我个人总是用0.5分的量表,因为我是这样学的。这有什么合乎逻辑的原因吗 如果答案很明显,我很抱歉。我真的很好奇。提前谢谢 这是因为当你将一幅图像的大小减半(在两个维度上)时,你实际上是将4个像素合并

我是一名视觉/用户界面设计师,从事由其他设计师设计的项目/产品。此设计器为前端开发人员提供了高质量的PNG图标,但当前端开发人员将图像比例设置为0.7时,它们看起来很模糊

我注意到,如果我们将图像的比例设置为0.5,它们看起来一点也不模糊:

0.7:[1]:

0.5:[2]:

有人知道为什么会这样吗

我个人总是用0.5分的量表,因为我是这样学的。这有什么合乎逻辑的原因吗


如果答案很明显,我很抱歉。我真的很好奇。提前谢谢

这是因为当你将一幅图像的大小减半(在两个维度上)时,你实际上是将4个像素合并成一个像素。然而,当你做一个稍微偏离比例(例如0.7)的时候,你有一个像素的一部分进入一个像素(在每个维度)。这意味着来自一个像素的数据被用于多达4个像素,而不是一个像素,从而导致模糊效果


很抱歉,制作一个示例图像对我来说非常困难,但我希望您能理解这个概念。

我认为这与插值有关,当您调整图像大小时,无法知道两个像素之间应该是什么,这两个像素基本上是合并的。计算机试图做的是通过观察周围的像素并组合这些值来猜测新像素应该是什么样子

例如,在上面的图像中,它将变成白色和橙色之间的什么?不太亮的桔子。好的,让合并的像素看起来像这样。当你到达一个角落时,可能会有更多的橙色,所以新的像素会看起来更橙色,你明白了

现在,当你按0.5的比例缩放时,计算机会查看像素,并以恒定的速率将所有像素合并在一起。我的意思是,如果你看一幅图像,并试图将它分成两半,你总是会将4个像素合并在一起,但是如果你按0.7的比例缩放,你会合并不规则数量的像素,从而在缩放图像时产生不同的像素浓度,这会导致图像模糊


如果你不明白,我明白,我有点偏离正轨了。。。。如果您需要更多的澄清,请在下面留言:)

发生的情况很大程度上取决于您用于缩小图像的软件。减少0.5和0.7之间有很大区别

如果缩小0.5,则将4个像素合并为一个像素

如果缩小0.7,则表示正在进行分数采样。每个方向上的10个像素减少到7个。 在0.5采样中,读取两个像素,向下读取两个像素


在0.7采样中,每个方向读取1.42857142857143像素。为了做到这一点,你必须加权像素值。这将在图形中造成模糊。

您使用什么程序/工具来缩放它们?@MarkSetchell前端开发人员正在使用HTML/CSS缩放它们。我得到了一些关于这个问题的答案(请看下面),他们非常有帮助。好问题,但我认为这不是正确的网站。我建议把这个问题转移到米拉身上,你在下面贴了几条“谢谢”的评论,但显然没有给出有用的答案。因此,后者更受欢迎。