511058 - Preview images are low quality, with extra noise

Status: RESOLVED FIXED

(Websites :: creative.mozilla.org, defect)

Description

[Tara (musingt)]

A few community members have mentioned that their uploaded design previews in the gallery with extra noise.  This is on the design detail page... clicking on the image for the full-view seems to be fine.  

I remember we had a similar issue when working on the Community Store, and this was a fix we made before we went live.  I think artists are pretty picky about how their work is displayed, and considering that most people will probably not click through to the full-size view (and will not be able to unless they are registered), it would be pretty important to fix this.  Not suggesting that it's a blocker for Wednesday, but it would be great if we can fix this before going live - if not soon after.  I'm cc-ing Ryan Doherty on this bug, since he worked on the Community Store and might be able to offer some tips from his experience.

Thanks.

Comment 1

[Ryan Snyder [:ryansnyder] [:rsnyder] [:rysny]]

We're currently storing the full size image at 100% quality, whereas we are storing the large images that are displayed on the design details page at 75% of the original upload quality, in order to reduce image filesize on the server.  I a

We're currently storing the larger images at 75% of the original upload quality, in order to reduce image filesize on the server.  I will increase that percentage to 85%, which should pacify the users.  It will, however, increase the filesizes of the images stored on the server... which may have implications in the longrun.

==

Sending        application/models/design.php
Transmitting file data .
Committed revision 49403.

Comment 2

[Ryan Doherty (:rdoherty)]

Two quick notes:

The issue we had with image quality was due to the use of imagecopyresized() instead of imagecopyresampled(). Not sure which Kohana uses, might be worth taking a look.

And if you add a 'r' in front of the svn revision number, it gets auto-linked by Bugzilla, which is handy. r49403

Comment 3

[Ryan Snyder [:ryansnyder] [:rsnyder] [:rysny]]

Thanks Ryan D - The Kohana Image::resize() uses imagecopyresized() first, then follows that up with imagecopyresampled().  The code comments state it is using  imagecopyresized() in order to speed up the resizing process, but at a quick glance it doesn't make sense to me why they are using both methods within the resize() method.  I'll keep that in mind if we're still having problems in the future.

I'll keep the svn revisioning in mind in future commits.

Comment 4

[Tara (musingt)]

Thanks guys !!

Comment 5

[Tara (musingt)]

Hi guys

I'd like to reopen this bug...as I still see noise around the designs at 85%.  Can we please increase that to something higher, even 100%, to make the designs display nice and crisp?  If I see these pixels, so do the artists who are far more picky about their work than we might be.  Since it's a design site, and a gallery, all designs should be displayed in their best light.  That's pretty important...so, lets take it up a notch, or all the way to 100%, please.

Comment 6

[Ryan Snyder [:ryansnyder] [:rsnyder] [:rysny]]

Do you have an example of an image that has been uploaded this morning, after the fix was posted?  This fix will not retroactively fix already uploaded images, it will only affect the images that are uploaded after the fix.

Comment 7

[Tara (musingt)]

Oh, I see.  I do not.  My comment was based on previous images.  Is there any way to make this a retroactive fix?

Comment 8

[Tara (musingt)]

Here's an example of a design that is being displayed with quite a bit of noise: http://mcc.stage.mozilla.com/designs/105  Also attached.  Hope this helps.

Comment 9

[Tara (musingt)]

Attachment: noisy image display

Comment 10

[Ryan Snyder [:ryansnyder] [:rsnyder] [:rysny]]

MCC is currently resizing uploaded design images at an 85% quality ratio and design full (original) images at a 100% quality ratio. 

Here are file sizes for 1 file that was uploaded at each of the quality ratio percentages:

* 75% - 37.55 KB
* 80% - 43.33 KB
* 85% - 51.69 KB
* 90% - 66.94 KB
* 95% - 100.84 KB
* 100% - 234.84 KB

The quality ratio was changed after Craig expressed his concern about the larger file sizes for images saved at 100%.  Considering how those file sizes would affect page load times and server usage problems once search engines started crawling those sites, I reduced the quality ratio.  We could probably go with 90% and be ok.  But I'm concerned about files that are saved at > 90%. I've changed this to 90% in the code and have committed it. 

The important piece here, is that the full design images are saved at 100%.  We've made MCC require that a user be logged-in in order to view the full design images.

==

Updating to 90%:

Sending        application/models/design.php
Transmitting file data .
Committed revision r49423.

Comment 11

[Stephen Donner [:stephend] Not actively reading bugmail]

Tara, is this better on staging?

Comment 12

[Stephen Donner [:stephend] Not actively reading bugmail]

(In reply to comment #11)
> Tara, is this better on staging?

Tara, on production?  Thanks!