Verificator de diferențe de imagine
Încărcați două imagini și vedeți o diferență vizuală precisă la pixeli între ele, cu comparație YIQ perceptivă și evidențiere conștientă de anti-aliasing - 100% local în browser.
Rezultat
Ați expediat o modificare CSS și doriți să știți exact ce s-a mutat? Compararea a două capturi de ecran pentru o verificare de regresie vizuală QA? Vă întrebați ce s-a schimbat de fapt între două versiuni exportate ale aceleiași fotografii? Derularea înainte și înapoi între două imagini și mijirea pentru diferențe este lentă și nesigură - acest instrument le suprapune pe cele două și vă arată fiecare pixel modificat într-o singură imagine.
Comparația este matematică reală de diferențiere a pixelilor, aceeași familie de algoritmi utilizate de instrumente precum pixelmatch: fiecare pixel al ambelor imagini este convertit din RGB în spațiu de culoare YIQ (Y = luma, I și Q = axele de crominanță NTSC), iar distanța euclidiană dintre cele două puncte YIQ este calculată. Distanța respectivă este comparată cu un prag stabilit de cursorul de sensibilitate - crește sensibilitatea pentru a surprinde schimbări subtile de culoare, reduce-o pentru a ignora zgomotul de compresie și îți pasă doar de modificările evidente.
O comparație naivă pe pixel ar lumina fiecare margine anti-aliased ca fiind „diferită”, chiar și atunci când nu s-a schimbat nimic semnificativ, deoarece netezirea schimbă o mână de pixeli de margine cu câteva nuanțe. Acest instrument rulează o adevărată euristică anti-aliasing pe ambele imagini: un pixel este tratat ca o diferență reală doar dacă NU se află într-un gradient de netezire - în mod concret, dacă propriul său vecinătate de 3x3 în nicio imagine sursă nu conține deja atât un pixel mai deschis, cât și unul mai întunecat decât el însuși, care este amprenta unei margini netezite AA, mai degrabă decât conținutul real.
Încărcați imaginea A și imaginea B, reglați sensibilitatea dacă este necesar și apăsați pe Executare. Obțineți un procent exact de pixeli care diferă plus o imagine diferită cu fiecare schimbare reală evidențiată în magenta strălucitor peste o versiune estompată a originalului - descărcați-l și atașați-l direct la raportul de eroare sau la notele de control al calității. Ambele imagini trebuie să aibă aceleași dimensiuni; dacă nu, instrumentul vă spune clar în loc să decupați sau să întindeți în tăcere unul dintre ele. Nimic nu părăsește browserul dvs. în niciun moment.