Visual Verification Rules

Last Verified: 2026-02-17 | Owner: John 
 
 Rule: Visual Verification — Razlike prvo, sličnosti nikad 
 Kad se primjenjuje 
 Svaki put kad agent mijenja UI kod ili poredi vizualni output sa referencom. 
 Pravilo 
 0. REFERENCA PRIJE KODA 
 Prije bilo kakve UI promjene — PRVO pročitaj source of truth dizajn: 
 
 Drop: mockups/figma-make-export/src/components/ (Make export) 
 Ostali projekti: Figma export ili mockup direktorij iz CLAUDE.md 
 Ako nema dizajn referenci — PITAJ prije nego kodiraš 
 
 Zabranjeno: Mijenjati UI kod pa TEK ONDA provjeriti dizajn. Redoslijed je: dizajn → kod → verifikacija. 
 1. RAZLIKE PRVO 
 Kad poredim dva vizualna elementa, PRVI korak je nabrojati sve razlike. Ne sličnosti. 
 Pitanje NIJE: "Šta se poklapa?"
Pitanje JESTE: "Šta se NE poklapa?" 
 2. EKSPLICITNA LISTA 
 Svaka razlika mora biti zapisana sa: 
 
 Element: (npr. tagline, font, ikona, boja, spacing) 
 Referenca: šta kaže dizajn (font, boja, stil) 
 Build: šta imam ja 
 Severity: critical / minor / acceptable 
 
 3. NULA RAZLIKA = SUMNJA 
 Ako ne mogu naći nijednu razliku — ne gledam dovoljno pažljivo.
Minimum provjera: 
 
 Font family (serif vs sans-serif?) 
 Font weight i size 
 Boje (ne "zelena" nego hex value) 
 Italic/normal 
 Spacing i padding 
 Ikone (detaljne vs placeholder?) 
 Border radius 
 Shadow 
 
 4. NIKAD "POKLAPA SE" BEZ LISTE RAZLIKA 
 Zabranjena rečenica: "Poklapa se sa dizajnom."
Dozvoljena rečenica: "Uporedio sam X elemenata. Našao Y razlika: [lista]. Ostalo se poklapa." 
 5. AKO JE UI/DESIGN TASK 
 Obavezno u evidence: 
 
 Screenshot builda 
 Screenshot/slika reference dizajna 
 Tabela razlika (element | referenca | build | match?) 
 Eksplicitna lista nepodudarnosti 
 
 Zašto 
 Task #850/#853: Agent tri puta proglasio login "gotov" i "poklapa se". Font bio pogrešan, tagline stil pogrešan, ikone drugačije. Nijedan mehanički check (build, JSON, file existence) ovo ne hvata. Samo pažljivo GLEDANJE hvata vizualne razlike.