• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
2

Loss of Detail in Image Reduction to 128x128 px in Photoshop

Community Beginner ,
Dec 19, 2023 Dec 19, 2023

Copy link to clipboard

Copied

Hi everyone!

I'm currently working on illustrations in Photoshop with dimensions set at 1435x1298 px. But now I need to scale down some of the layers to 128x128 px, but I'm encountering an issue with loss of resolution and detail during the transformation process.

I've tried adjusting the size using "Image > Image Size" and experimented with sharpening filters, but the results are not as detailed as I would like them to be. The fine elements in the illustration seem to be getting lost.

Could anyone provide guidance on how to effectively reduce the image size to 128x128 px in Photoshop without sacrificing too much detail? Are there specific settings or techniques that I should be aware of to maintain the quality of the illustration?

Your expertise and advice would be greatly appreciated!

Thank you in advance.

TOPICS
Windows

Views

274

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Community Expert , Dec 19, 2023 Dec 19, 2023

When you go from 1435x1298 pixels to 128x128 pixels you are throwing away 99% of the image information. You cannot discard 99% of the information whilst retaining the detail. At best you will have 1%.

Dave

Votes

Translate

Translate
Adobe
Community Expert ,
Dec 19, 2023 Dec 19, 2023

Copy link to clipboard

Copied

Raster images are made up of pixels. When you reduce the dimensions at the same pixels per inch, the content is interpolated which will create a loss of detail because you are reducing the number of pixels that previously made the detail. 

 

You could try the different interpolation options in the Image Resize dialog such as Bicubic Sharper which is intended for reduction.

 

You could first convert your content to a Smart Object before applying the reduction in size.

 

You could apply any of the Sharpening filters to your reduced image.

 

Depending on the content of your image, you might want to use Illustrator's Image Trace to convert your content into a vector graphic. Vectors are resolution independent, meaning they can be scaled up or down without losing detail.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Dec 19, 2023 Dec 19, 2023

Copy link to clipboard

Copied

When you go from 1435x1298 pixels to 128x128 pixels you are throwing away 99% of the image information. You cannot discard 99% of the information whilst retaining the detail. At best you will have 1%.

Dave

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Dec 19, 2023 Dec 19, 2023

Copy link to clipboard

Copied

A 128 x 128 px image has very little capacity for detail. Just imagine being told to build an image with Lego bricks or mosaic tiles, and that it cannot be more than 128 pieces wide or tall. It will be a very chunky looking image, because 128 is just not a lot of blocks to build a detailed image with.

 

Hopefully you aren’t making the mistake of viewing a 128 x 128 px image at higher than 100% magnification while editing. If this image is for an icon, thumbnail, or button, keep in mind that those are not typically magnified in normal use, so they should be previewed at 100% magnification, and can be made to look good at that magnification.

 

If you’ve seen an example of a 128 x 128 px image at a level of detail you’d like to achieve, post it here so we can advise on what kinds of sharpening and edge/contrast enhancement it might have had. But chances are, even other good examples you find will look great only at 100% magnification and not higher.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Dec 19, 2023 Dec 19, 2023

Copy link to clipboard

Copied

When you reduce the image size, you will lose some details, especially the tiny ones. For example, a one or two pixel line might disappear as if it never existed. If you share the image before and after resizing, we might be able to give you a better or more meaningful explanation.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Dec 20, 2023 Dec 20, 2023

Copy link to clipboard

Copied

The one advantage you have AFAICS is that you are working with illustrations rather than photographs.  If you are able to simplify the illustrations, they might resolve better at the 128 x 128 final resolution. 

 

You could reduce the number of colours with  Filter > Artistic > Cutout as shown below.

image.png

You could remove image elements that were not contributing to the story you need the reduced size icon to portray.  The new Remove tool and Content Aware Fill make that so much easier than even a very few years ago.

But the bottom line is you need to plan your illustration with the final size in mind.  Check out existing 128 pixel icons and 

image.png

 

It seems to me that you can say a lot with 128 pixels square

image.png

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Dec 20, 2023 Dec 20, 2023

Copy link to clipboard

Copied

Hi

128/128 px is a thumbnail 10 times smaller than the 1400 original.

Same as in real life : you cannot reduce a 1 meter painting on a letter stamp…

Could you please post a sample of an image to reduce for us to test

Best

 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Dec 20, 2023 Dec 20, 2023

Copy link to clipboard

Copied

Pixel art should never be downsampled from bigger images. I would define 128 x 128 as pixel art.

 

Create it at 100%, actual size, using the pencil tool to avoid random anti-aliasing. To work more easily, zoom in to 200/400/800 % - even ratios that will not resample on screen.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Dec 20, 2023 Dec 20, 2023

Copy link to clipboard

Copied

Dag, Bert Monroy creates his illustrations much bigger than their eventual size, but definitely not by a factor of 10.  I do the same thing because it is easier, and errors are diluted when downsized.  The example below was the windmill from #191

 

construction of an image element

Final Image

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Dec 21, 2023 Dec 21, 2023

Copy link to clipboard

Copied

LATEST

Yes, but this is about pixel art, icons and so on. It will be softened and blurred by the downsampling and that's what you want to avoid.

 

Images at bigger sizes is a different matter.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines