Ierarhia erorilor și evidențierea priorităților

1) De ce aveți nevoie de o ierarhie de eroare

• explica ce a mers prost
• arată de ce contează,
• sugerează ce să fac în continuare,
• prioritizați dacă există mai multe erori.
• Ierarhia erorilor reduce sarcina cognitivă, accelerează corecția și crește conversia treptelor (înregistrare, plăți, KYC).

2) Modelul de severitate

1. Info - "Profilul este incomplet, poate fi completat mai târziu. "Nu blochează.

2. Notă - "Limita este aproape epuizată. "Vă recomandăm să acţionaţi.

3. Avertisment - "Format nepotrivire, date parțial salvate. "Poate interveni.

4. Eroare - "Formatul invalid/câmpul necesar este gol. "Blochează o acţiune specifică.

5. Critic - "Plata negată/Riscul de securitate. "Blochează scriptul, necesită un pas imediat.

• Un ecran - un status principal.
• Pentru mai multe erori: afișați critic de sus și derulați stabil la prima eroare.

3) Principiile evidențierii priorităților

1. Ierarhia vizuală: culoarea/pictograma/grosimea/contrastul crește cu criticalitate.
2. Proximitatea spațială: o eroare în apropierea câmpului/zonei căreia îi aparține.
3. Focus and scroll: auto-scroll to the first error + focus to the problem field.
4. Un apel principal: banner general/alertă despre o problemă critică + solicitări locale.
5. Secvență token: culorile/pictogramele/fonturile pentru Informații/Avertizare/Eroare sunt neschimbate în întregul produs.
6. Durata de viață: erori locale - nu au fost încă fixate; bannere - înainte de închidere/fixare.
7. Nu confundați afirmațiile: „gol” ≠ „eroare”, „așteptare” ≠ „eroare”.

4) Limbaj vizual (UI jetoane)

• Info - albastru neutru/gri,
• Notificare - chihlimbar/galben,
• Avertizare - portocaliu,
• Eroare - roșu,
• Critic - roșu bogat + fundal contrastant.
• Icoane: info ⓘ, notificare, eroare/, succes.

• Mesaj inline sub câmp (cadru minim).
• Apel rând pe linie/card.
• Page-alert (banner) - pentru general/critic.
• Microanimații: aspect moale, fără „convulsie” aspectul.

5) Texte de eroare: formulă și exemple

Formula: Ce este greșit + Cum să fixați + (De ce/constrângere).

"Formatul de dată nevalidă. Introduceți în format DD. MM. AAAA"

"Fișierul este prea mare (max. 10 MB). Vă rugăm să descărcați un fișier mai mic"

"Nivel insuficient de verificare. Ia KYC - durează ~ 2 minute"

"Plata a fost refuzată de bancă. Încercați o altă metodă sau contactați banca"

Anti-modele: „Eroare 400”, „Ceva nu a mers bine”, umor în pași stresanți.

6) Ierarhia în formulare complexe (înregistrare/ACC/plăți)

1. Validarea inline pe blur: prindem imediat erorile locale.
2. Verificare globală pentru trimitere: afișați bannerul „Câmpuri marcate corect” și lista/ancorele.

3. Eroare de navigare: tastatură/tab, „Du-te la eroare # 1/# N.”

4. Ordinea corecției: prima blocare (Eroare/Critică), apoi Avertizare/Notificare.
5. Salvare context - Intrarea nu se pierde atunci când apare o eroare.

7) Specificitatea scenariilor

7. 1 Plăți/retrageri

Critică: respingerea de către furnizor/bancă, activitate suspectă.
Eroare: card/câmp IBAN, limite de cantitate/frecvență.
Atenție: rețea lentă/timeout.

Text: "Plata refuzată de bancă. Încercați o altă metodă sau contactați banca. Taxa nu a fost percepută"

7. 2 CSC/siguranţă

Critic: document falsificat/blocat country/multi-account.
Eroare: neconcordanță document/dată necitită.

Text: "Fotografia documentului este neclară. Încărcați o imagine mai clară în lumină bună"

7. 3 Căutare/filtre

Aceasta nu este o greșeală, ci un rezultat zero.

Text: "Nu există rezultate pentru "{query}" Eliminați filtrul „Furnizor: X” sau încercați „{alt}”. [Resetare filtre]"

8) Disponibilitate (A11y) și specificații

Erorile sunt declarate scenaristului: aria-live = „asertiv” pentru critici, „politicos” pentru alții.
Câmpuri cu eroare: aria-invalid =” true”, aria-descriptby per message.
Focus trece la prima eroare; ordinea tabbing păstrează logica.
Contrast prin WCAG AA; pictograma nu înlocuiește textul.
Textul trebuie citit cu voce tare, fără a pierde sensul.

9) Localizarea și acuratețea legală

Evitați jargonul și metaforele culturale.
Conveniți asupra termenilor (glosar): „plată respinsă”, „limită depășită”, „verificare”.
Specificați termenii și restricțiile în format local: „până la 15 minute”, valute/date.

10) Măsurători de calitate

Rata de eroare pe câmp/pas.
Timp-la-Fix.
Drop-off după o eroare (cât de mult pleacă fără a fixa).
Reapariția de către utilizator/sesiune.
Suport apeluri de tip eroare.
Pas de conversie înainte/după modificări în ierarhie.

• Defilare automată și focalizare vs numai culoare/text.
• Formularea exactă a motivului vs general.
• Comanda de iluminare din spate (banner → inline în primul rând) vs (numai în linie).
• Adaugă o legătură Afișează cerințele lângă eroare.

11) Lista de verificare înainte de lansare

• Fiecare eroare are un nivel (Info/Notice/Warning/Error/Critical).
• Culoarea/pictograma/containerul corespunde nivelului.
• Există defilare la prima eroare și schimbarea focalizării.
• Mesajul explică ce/cum/de ce.
• Termeni meci glosar; localizare verificată.
• Disponibilitate: atribute aria, contrast, lizibilitate cu voce tare.
• Datele nu se pierd pe eroare.
• Stările „rezultat zero” și „așteptare” nu sunt marcate ca erori.

12) Înainte/după exemple

Forma datei

Înainte de: „Eroare 400”

După: "Formatul de dată nevalidă. Utilizați DD. MM. AAAA"

Plata

Înainte: „Plata a eșuat”

După: "Plata a fost refuzată de bancă. Încercați o altă metodă sau contactați banca. Taxa nu a fost percepută"

KYC

Înainte: „Documentul nu este acceptat”

După: "Documentul nu a putut fi recunoscut. Încărcați o fotografie fără strălucire, colțurile și textul sunt vizibile"

Căutare zero (nu o eroare!)

Înainte: „Eroare: nimic găsit”

După: „Nu există rezultate pentru „ruleta live. „Scoateți filtrul „High-limit” sau încercați „ruletă. „[Resetare filtre]”

13) Proiectarea componentelor sistemului

''

Пропсы: 'mesaj', 'severitate', 'ariaDescriptedBy', 'compact'.
Randare: text + pictogramă, culoare prin 'severitate'.

''

Пропсы: „titlu”, „descriere”, „severitate”, „acţiuni []”.
Opțiuni: „informații | notificare | avertizare | eroare | critică”.

''

Listă de erori cu ancore la câmpuri, navigare tastatură, „Du-te la # 1”.

'' (logică)

Reguli de câmp/formă/pas, priorități, scheme (de exemplu, JSON-Schema), localizarea mesajelor.

14) modele de fraze rapide

15) Procesul de încorporare

Proiectarea textelor simultan cu logica de validare.
Stoca linii în i18n lângă componente, versionize.
În lista de verificare PR: conformitatea nivelului, atributele ariei, localizarea corectă.
Revizuirea periodică a erorilor metrice și feedback-ul de sprijin.

Foaie de trișat finală

Niveluri de digitizare: Info → Critical.
Arată prioritatea vizual și în centrul atenției.
Explicați corecția pe scurt și în mod specific.
Nu numi golul o greşeală.
Măsurați și îmbunătățiți: rata de eroare, Time-to-Fix, drop-off.