Magento 2 Expert Needed: Fix Product Image Quality / Catalog Image Cache Issue

Magento 2 Developer — Fix Blurry Product Images (Catalog Image Cache / view.xml Configuration) We run a Magento 2 e-commerce site and are having a recurring issue with product image quality across our category listing pages, product detail pages, and thumbnails. **The problem:** We have large, high-resolution master images (2048x2048px, transparent PNG) for our products. Our required display sizes are: - Category product listing: 225px × 180px - Product detail page: 451px × 416px - Thumbnail: 94px × 50px We tested uploading source images close to the actual display dimensions (rather than the large master), and image quality got noticeably worse — blurry product outlines and illegible label text, especially on high-DPI/Retina screens. We believe the correct approach is: - Upload the large master image as the single source - Let Magento's catalog image cache generate properly sized derivatives for each image role (thumbnail / small_image / image), including 2x variants for high-DPI displays - Keep per-page load weight reasonable by serving the correctly-sized derivative, not the full master We need someone who can confirm this approach, diagnose why our current setup isn't producing sharp images, and implement the fix. **What we need help with:** 1. Audit our current Magento 2 image configuration (`view.xml`, image role mapping, theme image settings) 2. Confirm whether the catalog image cache is generating correct derivatives for each placement (listing, PDP, thumbnail) 3. Set up or correct 2x/high-DPI image variants so images are sharp on Retina screens 4. Verify CSS isn't stretching cached images beyond their native resolution 5. Regenerate the image cache correctly (`bin/magento catalog:images:resize` or equivalent) and confirm via browser dev tools that the correct file sizes/dimensions are being served per placement 6. Check whether WebP conversion (if enabled) is over-compressing images 7. Recommend the ideal source image dimensions for our master files given the above **To apply, please answer:** - Briefly explain how Magento 2's catalog image cache and image roles (thumbnail/small_image/image) work, and how they relate to `view.xml` - Have you configured high-DPI (2x) image variants in Magento 2 before? Briefly describe your approach - What's your process for regenerating the image cache after a configuration change? **Requirements:** - Proven Magento 2 experience (not Magento 1) — please specify Open Source vs. Adobe Commerce experience - Experience with `view.xml`, image role configuration, and the catalog image cache pipeline - Familiarity with frontend/CSS image rendering best practices (object-fit, responsive images, srcset) - Strong communication — we want clear explanation of root cause, not just a quick patch - Portfolio/examples of prior Magento image performance or quality fixes preferred **Scope:** Fixed-price audit + fix engagement preferred, but open to hourly for the right candidate.