ppy / osu-stable-issues

Report critical osu-stable issues here
59 stars 11 forks source link

Fix inconsistent Resolution when loading Profile Badges #1160

Closed TangelaMerkel closed 9 months ago

TangelaMerkel commented 9 months ago

Hello! To get us all on the same page, tournament organizers provide a badge Format of 172x80 pixels with their badge request. The implemention of badges works in a way where the original resolution is linked as a 2x File and then a version that is scaled down to half resolution is without the 2x in the URL.

Examples: https://assets.ppy.sh/profile-badges/owc2022-winner@2x.png https://assets.ppy.sh/profile-badges/badge_owc2020_winner.png

The issue I found is that the scaling on which one is loaded by default is off. When I open a profile with badges on 100% Zoom in a Chromium based browser, then all badges are loaded in the scaled down version. This is a very notable downgrade in terms of visuals, even on 1080p displays. Zooming in 150% and reloading the page will load all the 2x versions of the badges and it looks a lot better, especially when zooming out. With some of the more modern and complicated badge designs, this is the difference between some text being readable in a lot of cases.

Here is the low res version of Maliszewskis Profile image

And here all badges are loaded in their full resolution image

EDIT: The difference does not look as big here due to image compression. I recommend trying it for yourself on the website.

Notice how low contrast text like the Pandemonium badge can be hard to read and how crisp the TATHC badge looks with higher res.

Tourney players really love their badges and it would change a lot to have the scaling changed so that the most common (1080p) user always loads the higher resolution badges. I looked up some 2013 badges and even those have a 2x version, so changing this should not break anything.

The only case where this could lead to trouble would be a Badge design where the artist purposefully adjusted the aliasing for the to look good on lower resolution. I only know of one such instance and that badge design is still pending and not finalized.

Also great job on displaying the Date with the badges now, looks great

TangelaMerkel commented 9 months ago

Moved to osu-web, sorry for posting here