# Design di un caso studio: problema, lavoro e risultato

[Canonical HTML page](https://gradiently.design/it/guide/case-study-design)

La maggior parte dei casi studio è una galleria con un paragrafo sopra. Quelli che fanno vincere incarichi raccontano una storia seguibile in un minuto: struttura chiara, immagini che la reggono e un formato per ogni luogo.

## The short version

- Un buon caso studio racconta una storia in tre parti: il problema, il lavoro e il risultato.
- Il risultato dovrebbe comparire nella prima schermata o sulla prima slide, perché molti lettori non scorrono mai fino in fondo.
- Ogni sezione di un caso studio dovrebbe avere la sua immagine, da un’immagine del prima agli schizzi del processo fino al lavoro finito in uso.
- Dichiara solo risultati che sai mostrare e ottieni il permesso del cliente prima di nominarlo o condividere cifre.
- Un caso studio può essere pubblicato come pagina web, PDF, slide di una presentazione commerciale e carosello social se condivide un unico look coerente.

Un forte **design di caso studio** segue tre atti: il problema, il lavoro e il risultato. Apri con un titolo che dichiara l’esito, mostra cosa non andava prima, ripercorri le decisioni che lo hanno cambiato, poi dimostra che ha funzionato con il pezzo finito in uso reale. Dai a ogni atto la sua immagine e tieni brevi le parole. Un potenziale cliente dovrebbe capire cosa hai fatto e perché contava nel tempo che serve a scorrere una schermata.

## La struttura di un buon caso studio

Designer, agenzie, consulenti e aziende di software scrivono tutti casi studio, e la forma che funziona è la stessa per ciascuno. Si legge come un breve racconto con un chiaro punto di svolta, e mette il finale all’inizio oltre che alla fine.

1. **Titolo: l’esito** «Un menu che ha dimezzato le domande sugli ordini» batte «Rebranding di un ristorante». Nomina il cliente e il lavoro in una riga sotto.
2. **Il problema** Cosa non andava, per chi e perché contava per l’attività. Due o tre frasi e un’immagine del prima.
3. **L’approccio** Le due o tre decisioni che hanno fatto la differenza, e perché. Non ogni passaggio che hai fatto.
4. **Il lavoro** I pezzi finiti, mostrati in grande e nel contesto: su un telefono, su uno scaffale, in una strada.
5. **Il risultato** Cosa è cambiato, con le parole del cliente o numeri che hai il permesso di condividere.
6. **Il passo successivo** Una riga che invita chi ha un problema simile a contattarti.

> **Chiedi prima di condividere** Controlla il contratto e chiedi al cliente prima di nominarlo, mostrare lavori non ancora usciti o pubblicare qualsiasi cifra. Se non puoi condividere numeri, descrivi il cambiamento a parole che approvi insieme a lui.

Scegli con la stessa cura quali progetti raccontare. Tre casi studio in linea con i clienti che vuoi avere dopo valgono più di dieci che coprono tutto ciò che hai fatto. Se vuoi più lavoro con i ristoranti, apri con il ristorante; se vuoi clienti di software, apri con la dashboard, anche se era un lavoro più piccolo.

## Immagini per ogni parte della storia

Un muro di mockup finiti dice al lettore che sai fare cose belle. Non gli dice che sai risolvere il suo problema. Abbina ogni sezione a un’immagine che dimostri il punto di quella sezione.

| Sezione | Immagine che lo dimostra | Evita |
| --- | --- | --- |
| Problema | La vecchia versione, una schermata confusa, uno scaffale disordinato | Prendere in giro il vecchio lavoro del cliente |
| Approccio | Schizzi, una moodboard, due opzioni affiancate, il brief | Decine di foto del processo |
| Lavoro | Il pezzo finito in uso reale, poi i dettagli chiave | Solo mockup fluttuanti su grigio |
| Risultato | Una breve citazione del cliente, un numero approvato in grande, il lavoro nel mondo reale | Affermazioni vaghe senza fonte |

Un’immagine di prova per sezione basta. Con più di tre immagini di fila la storia si blocca.

Una slide orizzontale di un caso studio intitolata Il problema, che afferma che i clienti non trovavano i piatti vegani in un menu

Una slide del problema: la questione detta chiaramente, dal lato del cliente, in una riga.

Una slide orizzontale coordinata intitolata Il risultato, con il titolo Domande sugli ordini dimezzate sullo stesso gradiente

La slide del risultato nello stesso stile. L’esito è il titolo, con la fonte indicata sotto.

L’esempio qui sopra è inventato per mostrare la forma, ma guarda la riga della fonte sotto il risultato. Un numero con un’attribuzione si legge come prova; un numero da solo si legge come marketing. La [gerarchia visiva](https://gradiently.design/it/guide/visual-hierarchy) aiuta a decidere cosa mettere in grande.

## Impaginazione di un caso studio su una pagina web

Su un portfolio o sul sito di un’azienda, un caso studio è una pagina lunga. La maggior parte dei visitatori legge la prima schermata, scorre i titoli e guarda le immagini. Progetta proprio per questo.

### Evita

- Un’immagine hero a schermo intero senza parole
- Il risultato nascosto in fondo in fondo
- Lunghi paragrafi tra le immagini
- Tutte le immagini della stessa dimensione
- Nessun modo di contattarti alla fine

### Fai

- Titolo, cliente ed esito nella prima schermata
- Un breve riquadro riassuntivo: cliente, ruolo, tempi, risultato
- Titoli che raccontano la storia anche letti da soli
- Grandi immagini hero, immagini di dettaglio più piccole
- Un passo successivo chiaro e un link al caso studio seguente

Uno sfondo coerente per separatori di sezione, citazioni e riquadri dei risultati fa sentire una pagina lunga come un solo pezzo e dà all’occhio un posto dove riposare tra le immagini. I [consigli per il portfolio di un designer](https://gradiently.design/it/guide/designer-portfolio-tips) e il [portfolio di uno sviluppatore](https://gradiently.design/it/guide/developer-portfolio-design) trattano il sito più ampio che lo circonda.

## Un caso studio in più formati

Un caso studio è troppo lavoro per pubblicarlo una volta sola. La stessa storia può vivere come pagina del tuo sito, PDF da allegare alle proposte, due slide in una presentazione commerciale e un carosello su LinkedIn o Instagram. Ognuno ha bisogno del suo formato.

- Slide 1920×1080: 1920 × 1080
- PDF A4 2480×3508: 2480 × 3508
- Carosello 1080×1350: 1080 × 1350
- Copertina Behance 1616×1264: 1616 × 1264

Quattro case per un solo caso studio, disegnate in scala. La storia resta la stessa; cambiano ritaglio e numero di parole.

- **Carosello:** una slide per atto, più una copertina e una slide di contatto. I [caroselli di LinkedIn](https://gradiently.design/it/guide/linkedin-thought-leader-content) mostrano il formato.
- **Presentazione commerciale:** una slide del problema e una del risultato, come nella coppia qui sopra.
- **PDF:** da due a quattro pagine A4 o Letter; vedi il [design di una one pager](https://gradiently.design/it/guide/one-pager-design) per i riepiloghi su un solo foglio.
- **Siti di portfolio:** una copertina nel formato della piattaforma, come il [formato della copertina Behance](https://gradiently.design/it/guide/behance-cover-size).

Gradiently qui aiuta perché un Mark viene disegnato da zero a ogni dimensione: progetta il caso studio una volta e Pro lo ridimensiona in ogni formato in un passaggio, con lo stesso sfondo e gli stessi caratteri sulla slide, sul PDF e sulle pagine del carosello.

## FAQ

### Cosa dovrebbe includere un caso studio?

Un titolo con l’esito, il problema, il tuo approccio, il lavoro finito nel contesto, il risultato e un passo successivo per il lettore.

### Quanto dovrebbe essere lungo un caso studio di design?

Abbastanza da mostrare il punto di svolta e non di più. La maggior parte di quelli buoni si scorre in un minuto e si legge per intero in cinque.

### Posso scrivere un caso studio senza dati sui risultati?

Sì. Usa una citazione del cliente o una descrizione di ciò che è cambiato che il cliente approva. Non inventare mai numeri.

### Dove va messo il risultato in un caso studio?

Nel titolo o nella prima schermata, e di nuovo in modo più dettagliato alla fine. Molti lettori non arrivano mai in fondo.

### Che formato dovrebbe avere un caso studio?

Una pagina web è la casa principale, con un PDF per le proposte, slide per le presentazioni e un carosello per i social, tutti nello stesso stile.
