Image Optimizer - METINAS

Kategorie

Vývoj na míru

Klient

METINAS s.r.o.

Realizace

1 týden

Image Optimizer - METINAS — Vývoj na míru | Metinas

Image Optimizer je webová aplikace, kterou jsme vyvinuli jako vlastní alternativu k placeným nástrojům na optimalizaci obrázků. Po letech práce s omezenými a předraženými řešeními jsme se rozhodli postavit kompletně vlastní nástroj, který dělá přesně to, co potřebujeme: konvertuje PNG do WebP, JPEG do AVIF, optimalizuje obrázky v hromadném režimu a výsledky jsou připraveny ke stažení za pár sekund. Bez registrace, bez měsíčních poplatků, bez limitu na počet souborů. Aplikace je volně dostupná na image-optimizer.metinas.dev a denně ji používáme při vývoji webových stránek a e-shopů pro naše klienty.

(VIZE)

Placené nástroje na optimalizaci obrázků nás roky omezovaly. TinyPNG s limitem na počet souborů. Kraken.io s měsíčním předplatným za funkce, které potřebujete dvakrát za měsíc. Squoosh bez hromadného zpracování. Každý nástroj něco řešil, ale žádný nedělal přesně to, co jsme potřebovali: jednoduše, rychle a bez zbytečných omezení. Rozhodli jsme se vzít věci do vlastních rukou a postavit nástroj, který používáme sami každý den. S příjemným rozhraním, bez registrace a s podporou formátů, které moderní weby skutečně potřebují, především WebP a AVIF.

(PROBLÉM)

Neoptimalizované obrázky jsou nejčastější příčinou pomalého načítání webových stránek, se kterou se u klientů setkáváme. Fotka z telefonu nahraná přímo na web má 4 až 8 MB. Po převodu do WebP nebo AVIF s inteligentní kompresí má 150 až 400 KB, bez viditelného rozdílu v kvalitě. To je úspora 90 až 95 %. Problém je, že většina dostupných nástrojů buď stojí peníze, které se při běžném používání nevyplatí, nebo mají limity, které vás nutí platit za něco, co by mělo být samozřejmé. Náš Image Optimizer tato omezení nemá, protože jsme ho stavěli pro vlastní potřebu a teprve potom zpřístupnili ostatním.

(NÁŠ POSTUP)

Celý nástroj stojí na jednoduchosti. Přetáhnete soubory do okna, vyberete cílový formát a za několik sekund máte optimalizované verze. Podporujeme převody, které skutečně řeší rychlost webů: PNG do WebP, PNG do AVIF, JPEG do WebP, JPEG do AVIF, WebP do AVIF a samozřejmě optimalizaci v rámci původního formátu. U každého souboru si uživatel vybere mezi bezeztrátovou kompresí (lossless), která zachová původní kvalitu, a ztrátovou kompresí (lossy), která výrazně zmenší velikost s minimální viditelnou změnou. Automaticky odstraňujeme metadata EXIF a zmenšujeme příliš velké obrázky. Výsledky je možné stáhnout jednotlivě nebo všechny najednou jako archiv ZIP.

(POTŘEBY UŽIVATELE)

Webový vývojář potřebuje před nasazením webu převést všechny PNG a JPEG obrázky do WebP nebo AVIF, aby stránka splňovala Core Web Vitals. Marketér připravuje vizuály pro blog a potřebuje zmenšit velikost bez ztráty kvality. Majitel e-shopu přidává produktové fotky a nechce, aby každý nový obrázek zpomalil načítání katalogu. Náš klient aktualizuje obsah na webu a potřebuje jednoduché řešení, které zvládne bez technických znalostí. Pro všechny platí totéž: nahrát, převést, stáhnout. Bez registrace, bez limitů, bez placení za něco, co by mělo být zdarma.

(VÝZVY)

Hlavní výzvou bylo dosáhnout kvality komprese srovnatelné s placenými nástroji při zachování jednoduchého rozhraní. Každý formát se chová jinak. Konverze PNG do WebP vyžaduje jiný přístup než JPEG do AVIF, protože PNG pracuje s transparentností, kterou je třeba zachovat, zatímco optimalizace JPEG se zaměřuje na barevnou přesnost. Implementovali jsme logiku, která automaticky rozpozná typ obsahu a zvolí nejvhodnější nastavení komprese. Při hromadném zpracování musí backend zvládnout desítky souborů současně bez zpomalení, což si vyžádalo důkladnou optimalizaci zpracování na straně serveru.

(USER CENTRIC)

Aplikace je navržena pro člověka, který nechce řešit nastavení a předplatné. Otevře stránku, nahraje soubory, vybere cílový formát (WebP, AVIF nebo optimalizace v původním formátu) a za několik sekund má výsledek. U každého obrázku vidí porovnání velikosti před a po, takže přesně ví, kolik ušetřil. Rozhraní je čisté a příjemné, protože jsme ho navrhovali pro sebe a nechtěli jsme se každý den dívat na nepřehledný nástroj. Celá interakce od nahrání po stažení trvá méně než minutu.