Jump to content

Profile photo pixelation


Recommended Posts

A member reported a pixelation aspect to their profile photo whereas they upload a large, high resolution photo and it correctly gets resized for the profile photo, however it is significantly pixelated. 

Image settings in IPS are set to the max and I see the same result whether using GD or ImageMagick.

The test file is also a PNG and has no such pixelation.

Link to comment
Share on other sites

OK so I think the issue is that the profile image is saved as a 51x51 image by IPS, but then displayed as 120x120 in the profile thereby pixelating.  Not exactly sure where you set the sizing for these, other than the Member Group >> Social >> Maximum profile photo width/height

I have it set to 100px, yet it's saving as 51x51 px and rendering to 120x120 px?

Rendered size:120 × 120 px
Rendered aspect ratio:1∶1
Intrinsic size:51 × 51 px
Intrinsic aspect ratio:1∶1
File size:10.6 kB

Link to comment
Share on other sites

11 minutes ago, Clover13 said:

OK so I think the issue is that the profile image is saved as a 51x51 image by IPS, but then displayed as 120x120 in the profile thereby pixelating.  Not exactly sure where you set the sizing for these, other than the Member Group >> Social >> Maximum profile photo width/height

I have it set to 100px, yet it's saving as 51x51 px and rendering to 120x120 px?

Rendered size:120 × 120 px
Rendered aspect ratio:1∶1
Intrinsic size:51 × 51 px
Intrinsic aspect ratio:1∶1
File size:10.6 kB

You may wish to check the theme for the size which is rendering as the default in the software is 90x90px.

Additionally, you may wish to check the "Maximum profile photo storage size" if that is too low.

Link to comment
Share on other sites

9 minutes ago, Jim M said:

You may wish to check the theme for the size which is rendering as the default in the software is 90x90px.

Additionally, you may wish to check the "Maximum profile photo storage size" if that is too low.

Maximum profile photo storage size is set to 5000 kB, so that's not it.

Where is the theme based setting?  I can't locate anything that defines the size to save these (90x90 for example)

Link to comment
Share on other sites

8 minutes ago, Clover13 said:

I customized the theme many years ago, but even in the default IPS theme, where is the 90x90 defaulting set that you suspect is overridden? I'll keep looking for it as well.

This would be in CSS, I'm afraid, customization is outside our scope of support. For just troubleshooting this, I would suggest switching to an unmodified theme.

Link to comment
Share on other sites

13 minutes ago, Jim M said:

This would be in CSS, I'm afraid, customization is outside our scope of support. For just troubleshooting this, I would suggest switching to an unmodified theme.

OK so I switched to the default theme, deleted the profile photo, renamed the original file, reuploaded it as a profile photo and have identical results:

Rendered size:120 × 120 px
Rendered aspect ratio:1∶1
Intrinsic size:51 × 51 px
Intrinsic aspect ratio:1∶1
File size:10.6 kB

Link to comment
Share on other sites

We would need to look further into this for you, however the access details on file appear to be incorrect or missing. Could you please update these details by visiting your client area, selecting the relevant purchase, then clicking "Review/Update Access Information" under the "Stored Access Information" section. 

We look forward to further assisting you. 

 

Link to comment
Share on other sites

Unfortunately, I am not seeing anything wrong here. The profile size here, you are restricting to 100px width/height. As you can see here, this image that I uploaded meets that: https://your-cdn-base-url/monthly_2023_01/73552270-CCFB-4078-93BF-2169E4DFE0CD.jpeg.4e6e7f5b64ea3448e8a62e850fd7cf0d.jpeg.3b60677fea8263755d332df02e815e9c.jpeg

We then are cropping that photo so that it fits inside the circle of the theme. This takes the photo I uploaded which is 100px x 75px rendered down to 75x75 when I crop the image at its limits. This is the software working as intended.

If you want a higher resolution profile photo, you need to increase the width/height which you allow to a larger maximum.

Link to comment
Share on other sites

To clear up, the thumbnail saved on upload is 100x75 and then cropped to 75x75 but displayed as 120x120 in the profile photo under the profile page https://site.com/profile/{id}-username

What's confusing is the thumbnail vs the display and how this can be controlled, unless you must edit certain underlying theme properties (not visible in the AdminCP) to achieve matching resolutions of display (profile photo) to what is thumbnailed for that exact display (via the profile photo upload process).  Each of those is a separate configuration, but they *should* match no?

 

Edited by Clover13
Link to comment
Share on other sites

7 minutes ago, Clover13 said:

What's confusing is the thumbnail vs the display and how this can be controlled, unless you must edit certain underlying theme properties (not visible in the AdminCP) to achieve matching resolutions of display (profile photo) to what is thumbnailed for that exact display (via the profile photo upload process).  Each of those is a separate configuration, but they *should* match no?

They would not match, no. Nor control each other.

Of course, if you want to see this changed, you're welcome to submit a suggestion in our Feature Suggestion forum.

Link to comment
Share on other sites

OK, however I am confused by it so I want to make sure I'm describing it correctly.

There are three parts to this feature:

  1. The profile photo being uploaded (full resolution)
  2. The profile thumbnail (thumbnail resolution)
  3. The profile photo presented in the profile (displayed resolution upscaled from the thumbnail)

Are there other areas the thumbnail is used that storing it at less than the profile photo display size is important or beneficial?  I understand it's a space saver (matter of a few kB maybe?), but it seems to conflict with the goal because it reduces the resolution and then rescales it back up causing the pixelation.  Why would these not match to maintain the visual fidelity, i.e. the upload process recognizes the member's profile photo dimensions and creates a corresponding matching thumbnail that is sized to match that space?  Otherwise you'll just have all pixelated profile photos (which is exactly what is being seen).

I can create an enhancement request to this effect but I want to ensure I'm not missing some other aspect to this that makes it not a good idea.

Link to comment
Share on other sites

5 minutes ago, Clover13 said:

OK, however I am confused by it so I want to make sure I'm describing it correctly.

There are three parts to this feature:

  1. The profile photo being uploaded (full resolution)
  2. The profile thumbnail (thumbnail resolution)
  3. The profile photo presented in the profile (displayed resolution upscaled from the thumbnail)

Are there other areas the thumbnail is used that storing it at less than the profile photo display size is important or beneficial?  I understand it's a space saver (matter of a few kB maybe?), but it seems to conflict with the goal because it reduces the resolution and then rescales it back up causing the pixelation.  Why would these not match to maintain the visual fidelity, i.e. the upload process recognizes the member's profile photo dimensions and creates a corresponding matching thumbnail that is sized to match that space?  Otherwise you'll just have all pixelated profile photos (which is exactly what is being seen).

I can create an enhancement request to this effect but I want to ensure I'm not missing some other aspect to this that makes it not a good idea.

There are only 2:

  1. The profile photo being uploaded and resized to the max resolution you specified.
  2. The profile which the user is then asked to crop so that there is a 1:1 aspect ratio (aka a square photo).

Then the theme utilizes #2 everywhere for the profile photo. In topics, on the profile itself, etc... The theme via HTML/CSS may resize that but it is #2 image which is used. If that is not size appropriately for on the profile, which is larger than being viewed on the topic, it will look pixelated.

Link to comment
Share on other sites

  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Upcoming Events

    No upcoming events found
×
×
  • Create New...