ayris-legal-main/.impeccable/critique/2026-08-16T01-13-38Z__app.md

target, total_score, max_score, na_heuristics, p0_count, p1_count, timestamp, slug

target	total_score	max_score	na_heuristics	p0_count	p1_count	timestamp	slug
app	18	24	7,10	0	2	2026-08-16T01-13-38Z	app

Design Critique: app (AyrisLegal Web Application & Landing Surface)

Method: dual-agent (A: e6f7d208-1fbc-4daa-b3a3-962cc0a92ccc · B: a945c7f8-9c10-46ce-aeef-f16ddea465de)
Target: app (app/[locale]/page.tsx, components/contact-form.tsx, app/globals.css)
Design Reference: DESIGN.md ("The Modern Jurist Studio") & PRODUCT.md

---

Design Health Score

Mode: Persuade (Marketing & Conversion Landing Surface). Heuristics 7 & 10 scored n/a per mode-applicability rules.

#	Heuristic	Score	Key Finding / Rationale
1	Visibility of System Status	3/4	Clear "Gönderiliyor…" and confirmation states on form; live pulse in hero. Minor gap: no inline field-level entry feedback.
2	Match System / Real World	4/4	Exceptional. Speaks authentic Turkish legal terminology (Tensip zaptı, Esas/Karar, Bilirkişi raporu, Çelişki tespiti, UDF/UYAP). Zero generic fluff.
3	User Control and Freedom	3/4	Annual/monthly pricing toggle is smooth and reversible; clear section navigation. Success state lacks in-place reset.
4	Consistency and Standards	2/4	Severe token drift between globals.css (Dark Navy/Teal), page.tsx (White/Red), and login (Blue). Form placement rule violated on home page.
5	Error Prevention	2/4	Contact form has noValidate with no client-side regex or length validation. Unrestricted phone input formatting.
6	Recognition Rather Than Recall	3/4	Clear side-by-side pricing tier inclusions and visible document artifact previews.
7	Flexibility and Efficiency	n/a	Mode: Persuade. Accelerators and power-user shortcuts are not applicable to a landing page.
8	Aesthetic & Minimalist Design	3/4	Strong typographic hierarchy with Archivo and JetBrains Mono. Undersized text (<11px) and repetitive eyebrow kickers add minor noise.
9	Error Recovery	1/4	Critical gap in ContactForm: API 400 errors collapse into a generic message without field-level error highlights or recovery guidance.
10	Help and Documentation	n/a	Mode: Persuade. In-depth app docs not applicable; key questions handled in SSS accordion.
Total		18/24	Good (75%) (Renormalized over 8 applicable heuristics)

---

Design Specificity Verdict

• Domain Specificity: High. Real Turkish judicial procedural artifacts (Kira Tespiti Bilirkişi Raporu, 2024/100 Esas Tensip Zaptı, Yargıtay Ceza Genel Kurulu) anchor the product deeply in authentic attorney workflows.
• Architectural Clichés Identified: Repetitive uppercase eyebrow chips above 5 headings, numbered 01 / 02 / 03 section tags, and an abrupt full-dark section inversion (bg-zinc-950) in the security module.
• Deterministic Scan Summary: 14 findings detected. True issues confirmed for gradient-text, legacy codex-grid-background in globals.css, undersized UI text (<11px in document badges), low-contrast text (text-zinc-400 @ 2.59:1), and generic blue-600 styling in login/page.tsx.
• False Positives Dismissed: Deep ambient card shadows (0 30px 70px -25px rgba(...)) and the LivePulse red status dot were verified as intentional tokens documented in DESIGN.md.

---

Priority Issues

1. [P1] Architecture & Scope Violation: Contact Form embedded on Homepage instead of dedicated /iletisim

   • Why it matters: Violates explicit project rules in AGENTS.md and PRODUCT.md ("İletişim formu sadece /iletisim sayfasında — ana sayfada olmaz"), cluttering homepage conversion and eliminating dedicated landing routes.
   • Fix: Create app/[locale]/iletisim/page.tsx with the complete lead form; replace the homepage bottom section with an editorial CTA card linking to /iletisim.
   • Suggested Command: /impeccable layout app/[locale]/page.tsx

2. [P1] Contact Form Payload Mismatch & Error Recovery Breakdown

   • Why it matters: In contact-form.tsx, org is sent as barNo and phone as message. Furthermore, noValidate bypasses browser validation and API 400 responses swallow field-specific feedback.
   • Fix: Align payload keys with backend schema, implement accessible inline validation, visible focus rings, and aria-live alert regions.
   • Suggested Command: /impeccable harden components/contact-form.tsx

3. [P2] Design System Token & Palette Schism (globals.css vs DESIGN.md vs login)

   • Why it matters: globals.css configures Dark Navy + Teal, while DESIGN.md and page.tsx use Paper White + Zinc + Ayris Red, and login uses generic blue-600.
   • Fix: Align globals.css :root tokens directly with DESIGN.md (--primary: #E61919, --background: #FFFFFF, --border: #E4E4E7, --muted-foreground: #71717A), purge unused teal/orb styles, and update login/page.tsx.
   • Suggested Command: /impeccable typeset app/globals.css

4. [P2] Mobile Loss of Core Feature Demonstration (Çelişki Avcısı) & Legibility Deficits

   • Why it matters: The signature Çelişki Avcısı card is hidden on mobile screens (hidden sm:block), depriving mobile lawyers of the primary differentiator. Additionally, multiple metadata tags use undersized text (<10px) and low-contrast zinc-400.
   • Fix: Inline the contradiction detection callout into the mobile document stream, enforce a minimum 11px font size floor, and update text-zinc-400 to WCAG-compliant text-zinc-500.
   • Suggested Command: /impeccable adapt app/[locale]/page.tsx

---

Persona Red Flags

• "Jordan" (Confused First-Timer Attorney): Hero CTA promises "Ücretsiz Deneyin" (implies self-serve trial), but links to a form stating "Kurucu ekipten biri sizi arar — 15 dakikalık canlı demo". This creates expectation mismatch and friction.
• "Casey" (Distracted Mobile Attorney on the go): Loses the entire Çelişki Avcısı demonstration on screens under 640px. Pricing toggle buttons have tight touch targets.
• "Av. Mehmet" (Litigation Lawyer): Sees only tenancy disputes (Kira Tespit Davası) in previews; wants proof that AyrisLegal handles complex criminal or heavy commercial court dockets.