# Design Patterns

_Framework: agency_v3_1 | Estratto: 2026-03-09_
_Usato da: agency-creative-director, agency-design-system, agency-ux-copy_

## Sommario

Pattern UI riusabili per siti agency/services. Strutture, non stile.

---

## Card Grid (Services / Features)

**Quando usarlo:**
- Overview servizi
- Differentiatori
- Step del processo

**Regole:**
- Max 6 card desktop, 3-4 mobile
- Titolo breve + payoff 1 riga + micro-CTA
- Icone solo se aggiungono semantica (non decorative)

**Varianti:**
- Icon + title + 2 bullets
- Number + title + paragraph (per process)
- Split card (testo + mini proof)

---

## Split Layout (Text + Visual)

**Quando usarlo:**
- Spiegare un concetto o metodo
- Mostrare case study teaser

**Regole:**
- Testo a sinistra per lingue LTR (scansione naturale)
- 1 solo focus visual (non collage)
- Includere 1 proof nello stesso blocco (numero, logo, quote)

---

## Section Header (Headline + Support)

**Pattern:**
- Overline (categoria)
- Headline (promessa)
- Supporting copy (beneficio concreto)
- Optional: inline CTA

**Regole:**
- Headline: 6-12 parole
- Supporting: 1-2 frasi, senza gergo

---

## Logo Wall (Credibility)

**Quando usarlo:**
- Subito dopo hero o dopo services

**Regole:**
- Max 12 loghi visibili (se più, carousel o "view all")
- Testo di contesto (es. "Trusted by" o "We worked with")
- Evitare loghi non autorizzati

---

## Testimonial Block

**Varianti:**
- Quote singola "hero testimonial"
- Grid di 3 testimonial
- Testimonial + risultato (numero)

**Regole:**
- Migliore se contiene un risultato specifico
- Includere nome/ruolo/azienda quando possibile
- Se anonimo: spiegare perché (settore sensibile)

---

## FAQ (Objections)

**Quando usarlo:**
- Prima della CTA finale
- Su services e contact

**Regole:**
- 5-8 domande
- Domande reali (prezzo, tempi, processo, revisioni)
- Risposte brevi e pratiche

---

## Footer (Actionable)

**Include:**
- CTA compatta
- Contatti chiari
- Link legali
- Social (se utili)

**Regola:**
- Footer deve "chiudere" il funnel, non solo link.

---

_Reference generato da framework-translator_