La matematica nascosta nelle curve di un carattere

Ingrandite una lettera sullo schermo. I bordi restano lisci, anche quando il carattere diventa enorme. Dove sono nascosti tutti quei punti?

Scrivete una «a» in un programma di word-processing o di grafica e aumentatene la dimensione. A prima vista sembra fatta di inchiostro digitale; se la osserviamo più da vicino, però, non troviamo una fotografia più dettagliata. Troviamo un contorno descritto da pochi punti e da regole capaci di ricostruire la forma a qualunque scala.

Come può una manciata di punti disegnare una curva morbida? La risposta attraversa automobili, caratteri tipografici, illustrazioni vettoriali e animazioni: sono le curve di Bézier, uno degli esempi più concreti di matematica che lavora ogni giorno sotto i nostri occhi.

Una lettera non è una griglia di pixel

Un’immagine fotografica associa un colore a ciascun pixel. Se la ingrandiamo abbastanza, la griglia diventa visibile. Un carattere vettoriale segue un’altra logica: memorizza contorni composti da segmenti rettilinei e curvi. Al momento della visualizzazione, il software calcola quali pixel debbano essere accesi alla dimensione richiesta.

La figura mostra il contorno reale della lettera «a» nel font libero DejaVu Sans. I punti dorati appartengono al bordo; i rombi rossi sono punti di controllo e non devono necessariamente trovarsi sulla curva. Il formato TrueType descrive questi profili con Bézier quadratiche. Altri formati OpenType, come CFF e CFF2, usano curve cubiche. Dire semplicemente che «tutti i font sono cubici» sarebbe quindi sbagliato: la matematica è la stessa famiglia, ma il grado dipende dal formato.

Il vantaggio è decisivo. Lo stesso carattere può apparire piccolo in una nota a piè di pagina o enorme su un manifesto: il contorno non viene stirato come una fotografia, ma ricalcolato. La rasterizzazione e gli eventuali suggerimenti tipografici, detti hint, aggiungono poi accorgimenti per rendere leggibili le lettere alle dimensioni più piccole.

Quattro punti, una curva

Consideriamo la versione cubica, molto comune nella grafica vettoriale. Scegliamo quattro punti P₀, P₁, P₂ e P₃. La curva parte da P₀ e termina in P₃. I due punti intermedi non sono, in generale, attraversati: agiscono come calamite geometriche che orientano la traiettoria.

La formula raccoglie questa idea in un parametro t compreso fra 0 e 1:

B(t) = (1 − t)³P₀ + 3(1 − t)²tP₁ + 3(1 − t)t²P₂ + t³P₃.

Quando t vale 0, tutti i termini scompaiono tranne P₀; quando vale 1, resta P₃. Fra questi estremi, i quattro coefficienti sono non negativi e sommano sempre a 1. Perciò B(t) è una media pesata dei punti di controllo e rimane dentro il loro involucro convesso, la più piccola regione convessa che li contiene.

C’è un’altra informazione visibile. La tangente iniziale ha la direzione che va da P₀ a P₁; quella finale segue la direzione da P₂ a P₃. Spostare una maniglia cambia quindi il modo in cui la curva esce da un estremo o vi arriva. Il progettista non deve correggere centinaia di punti del bordo: modifica pochi controlli e la forma intera si aggiorna.

La costruzione nascosta: dividere segmenti

La formula può sembrare elaborata, ma la stessa curva nasce da un gesto elementare: scegliere punti nello stesso rapporto lungo alcuni segmenti. È l’algoritmo di de Casteljau.

Fissiamo, per esempio, t = 0,35. Su ciascuno dei tre lati consecutivi del poligono di controllo prendiamo un punto al 35% del percorso: otteniamo Q₀, Q₁ e Q₂. Ripetiamo l’operazione sui due segmenti che uniscono i Q e troviamo R₀ e R₁. Un’ultima divisione, ancora nello stesso rapporto, produce B(0,35), un punto della curva.

Variando t da 0 a 1, il punto finale percorre l’intera Bézier. Il procedimento usa soltanto interpolazioni lineari: in ogni passaggio calcola una posizione fra due punti. È geometricamente trasparente e numericamente stabile; inoltre suddivide naturalmente una curva in due tratti che, riuniti, restituiscono esattamente quella di partenza.

Dalle carrozzerie alla tipografia

Queste curve non nacquero per disegnare lettere. Alla fine degli anni Cinquanta e nei primi anni Sessanta l’industria automobilistica cercava un modo per tradurre in numeri le forme morbide delle carrozzerie. Paul de Casteljau sviluppò per Citroën un metodo ricorsivo di interpolazione; Pierre Bézier, lavorando in Renault, sviluppò e rese noto un sistema affine per progettare curve e superfici nel CAD. Il nome di Bézier rimase legato alle curve, mentre l’algoritmo porta quello di de Casteljau.

Il passaggio dalla lamiera alla lettera è meno strano di quanto sembri. In entrambi i casi occorre descrivere una forma liscia con pochi dati, modificarla senza perdere il controllo e trasferirla fra scale e strumenti diversi. La stessa idea è entrata nel PostScript, nel PDF, nei font, nei programmi di disegno e nelle interfacce che animano un oggetto lungo una traiettoria.

Unire più curve senza vedere la cucitura

Una sola Bézier cubica non basta per il contorno complesso di una lettera. Si usano più segmenti consecutivi. Per non lasciare un buco, la fine di un segmento deve coincidere con l’inizio del successivo: è la continuità di posizione, spesso indicata con C⁰.

Se vogliamo evitare anche uno spigolo, le due tangenti devono avere la stessa direzione nel punto di giunzione. Allineando l’ultimo punto di controllo del primo tratto, il punto comune e il primo controllo del tratto successivo otteniamo una transizione visivamente liscia. Per una continuità parametrica C¹ serve anche coerenza nella grandezza delle derivate; per il solo aspetto geometrico può bastare una condizione più debole. È il motivo per cui le maniglie dei programmi vettoriali appaiono spesso allineate quando un nodo è impostato come “morbido”.

Le Bézier non riproducono automaticamente ogni curva con un unico tratto e non passano per tutti i controlli. La loro forza è un compromesso: pochi parametri, comportamento prevedibile e grande facilità di modifica. Le coniche, incontrate in un’altra esplorazione, sono oggetti diversi; alcune richiedono curve razionali per essere rappresentate esattamente.

Prova anche tu

Disegna su un cartoncino quattro punti P₀, P₁, P₂ e P₃ e uniscili in ordine con il righello. Costruiamo B(0,5), quindi useremo sempre i punti medi. Segna i tre punti medi dei segmenti P₀P₁, P₁P₂ e P₂P₃. Unisci i tre nuovi punti; sui due segmenti ottenuti segna ancora i punti medi. Uniscili e prendi, per l’ultima volta, il loro punto medio: quello è esattamente B(0,5).

Ripeti su un foglio trasparente dopo aver spostato soltanto P₁. Confrontando i due disegni vedrai cambiare la partenza e gran parte della curva, mentre gli estremi restano fermi. Se vuoi tracciare più punti, ripeti la costruzione con rapporti 1/4, 1/2 e 3/4. Non stai approssimando la definizione con un trucco grafico: stai eseguendo l’algoritmo che calcola davvero la curva.

L’idea matematica da portarsi via

Una forma complessa può essere controllata da pochi punti e da una regola semplice di interpolazione. Le curve di Bézier trasformano il gesto intuitivo di tirare una maniglia in un polinomio preciso. La matematica non sostituisce il lavoro del disegnatore: gli offre un oggetto che conserva forma, scala e modificabilità.

La prossima volta che leggerete una parola sullo schermo, provate a immaginarne il contorno: dietro l’inchiostro apparente c’è una piccola architettura di punti, segmenti e medie pesate. Altre forme da osservare con questo sguardo sono raccolte in Scoprire la matematica.

DALLA MIA BIBLIOTECA

Curve e superfici, di Marco Abate e Francesca Tovena. Un testo universitario di geometria differenziale: è il riferimento della biblioteca per approfondire il linguaggio matematico delle curve oltre la costruzione grafica elementare.

La matematica: Suoni, forme, parole, a cura di Claudio Bartocci e Piergiorgio Odifreddi. È pertinente per il dialogo fra matematica e cultura visiva: forme, prospettiva, architettura e linguaggi mostrano come un’idea matematica diventi anche uno strumento espressivo.

Fonti e approfondimenti

MIT OpenCourseWare, Bézier Curves and Splines: base di Bernstein, costruzione e suddivisione con de Casteljau. UC Berkeley, Introduction to Geometry, Splines and Bézier Curves: formulazione geometrica e uso nella grafica.

Microsoft, Comparison of “glyf”, CFF and CFF2 tables: curve quadratiche nei contorni TrueType e cubiche nei formati CFF/CFF2. Adobe, PostScript Language Reference: tracciati e curve cubiche nel modello grafico PostScript.