Porovnání obrázků

Poslali jste úpravu CSS a chcete přesně vědět, co se posunulo? Porovnáváte dva screenshoty při vizuální regresní kontrole? Zajímá vás, co se skutečně změnilo mezi dvěma exportovanými verzemi stejné fotky? Překlikávání mezi dvěma obrázky a mhouření očí je pomalé a nespolehlivé – tento nástroj oba obrázky překryje a ukáže vám každý změněný pixel v jednom obraze.

Porovnání využívá skutečnou matematiku pixelového diffu, stejnou rodinu algoritmů, jakou používají nástroje jako pixelmatch: každý pixel obou obrázků se převede z RGB do barevného prostoru YIQ (Y = luma, I a Q = chrominanční osy NTSC) a vypočte se euklidovská vzdálenost mezi těmito dvěma body YIQ. Tato vzdálenost se porovná s prahovou hodnotou nastavenou posuvníkem citlivosti – vyšší citlivost odhalí i jemné barevné posuny, nižší ignoruje kompresní šum a zaměří se jen na zjevné změny.

Naivní porovnání pixel po pixelu by každou vyhlazenou hranu označilo jako „odlišnou“, i když se nezměnilo nic podstatného, protože vyhlazení posune několik hraničních pixelů o pár odstínů. Tento nástroj provádí na obou obrázcích skutečnou heuristiku proti aliasingu: pixel se považuje za opravdový rozdíl jen tehdy, pokud se NEnachází uvnitř vyhlazovacího přechodu – konkrétně pokud jeho okolí 3×3 pixely v žádném ze zdrojových obrázků neobsahuje současně světlejší i tmavší pixel, než je on sám, což je charakteristický znak vyhlazené hrany, nikoli skutečného obsahu.

Nahrajte obrázek A a obrázek B, v případě potřeby upravte citlivost a stiskněte Provést. Získáte přesné procento pixelů, které se liší, a diff obrázek, kde je každá skutečná změna zvýrazněna jasně purpurově na ztlumené verzi originálu – ten si můžete stáhnout a připojit přímo k hlášení o chybě nebo do poznámek ke kontrole kvality. Oba obrázky musí mít stejné rozměry; pokud je nemají, nástroj vás na to upozorní, místo aby jeden z nich v tichosti ořízl nebo roztáhl. Z vašeho prohlížeče mezitím nic neunikne.