Impaginare con la simmetria dinamica

I metodi compositivi che si possono utilizzare per l’impaginazione di un layout sono numerosi. Alcuni, tipici della tradizione libraria, seguono le regole della proporzione classica e si avvalgono di una strutturazione modulare simmetrica; altri, di recente introduzione, hanno un’indole più dinamica, maggiormente adatta all’impaginazione delle pubblicazioni periodiche, dei libri molto illustrati, dei moderni stampati di comunicazione pubblicitaria o delle pagine web.

Lo scopo, in ogni caso, è lo stesso: definire la sintassi costruttiva del progetto grafico attraverso la segmentazione dello spazio, nell’intento di armonizzare i vari elementi che compongono il layout – titoli, testi, immagini ecc.

È bene precisare che la costruzione della griglia di impaginazione non va intesa come un sistema rigido, ma come una struttura flessibile, utile per sistemare le componenti nella pagina in maniera logica ed equilibrata. Grazie ad essa, il visual designer dispone di una guida che gli consente di usare istinto e creatività mantenendo la coerenza progettuale, senza che la casualità e l’improvvisazione prendano il sopravvento.

Il metodo compositivo che presento in questo articolo prende il nome di simmetria dinamica. Si tratta di un sistema proporzionale usato sin dall’antichità in architettura, descritto in dettaglio dall’artista, scrittore e matematico canadese-americano Jay Hambidge (1867-1924) nella sua opera principale The Elements of Dynamic Symmetry.

La simmetria dinamica consente di scomporre armonicamente una superficie in sezioni spaziali decrescenti proporzionali a quella di partenza. Il metodo si basa sui rettangoli dinamici, cioè quei rettangoli caratterizzati da un valore irrazionale del rapporto tra i due lati adiacenti: in parole più semplici, dividendo il lato maggiore per il lato minore (o viceversa) si ottiene un numero irrazionale. Un esempio di rettangolo dinamico è il ben noto rettangolo aureo, che presenta un rapporto tra il lato maggiore e il lato minore pari a 1,6180339887…, numero conosciuto come sezione aurea e indicato con φ. Altri rapporti irrazionali usati nella simmetria dinamica sono √2, √3, √4 e √5.

Vediamo in pratica come funziona la simmetria dinamica nella suddivisione armonica di un layout rettangolare, in verticale o in orizzontale. Può trattarsi di un elaborato destinato alla stampa così come dell’impianto di un sito web.

Si parte dal quadrato ABCD. Si traccia la diagonale BD e la si ribalta sul lato BC, ottenendo in tal modo il rettangolo armonico ABEF di radice 2 che avrà come lato minore il lato del quadrato AB e come lato maggiore BE=AB√2:

A questo punto si traccia la diagonale BF e la si ribalta sul lato BE, ottenendo così il rettangolo armonico ABGH di radice 3 che avrà come lato minore il lato del quadrato AB e come lato maggiore BG=AB√3:

Si prosegue reiterando il processo con la diagonale BH, ottenendo il rettangolo di radice 4 ABIL, e con la diagonale AL, ottenendo il rettangolo di radice 5 ABMN:

In questo modo si ricavano delle suddivisioni armoniche via via decrescenti, proporzionali al quadrato di partenza che, ad esempio, possono essere utilizzate per identificare le sezioni principali della pagina e per disporre i vari elementi grafici.

Il rettangolo dinamico di radice 5 presenta una singolare relazione con la sezione aurea e, in particolare, con il rettangolo aureo. Se infatti si procede alla nota costruzione geometrica di quest’ultimo a partire dal quadrato e la si ribalta simmetricamente, la figura che si ottiene è proprio un rettangolo di radice 5:

Questa circostanza può essere sfruttata per operare una divisione euritmica dello spazio a disposizione.

La simmetria dinamica è utile anche per suddividere in maniera equilibrata un rettangolo dinamico. Prendiamo come esempio il rettangolo di radice 2, particolarmente interessante poiché su di esso si basa lo standard ISO 216 per i formati di carta comunemente utilizzati in Europa per usi tipografici (come i formati A4 e A3).

Si parte tracciando le diagonali del rettangolo; poi si disegnano le linee verticali e orizzontali passanti per i punti di intersezione tra le diagonali e il lato del quadrato costruito su ciascuno dei lati minori, come nella figura seguente:

Vengono a crearsi, così, degli spazi armonici da usare per collocare le componenti nel layout. Soprattutto, si formano diversi rettangoli che a loro volta conservano la caratteristica di essere dinamici di radice 2:

Su questi è possibile ripetere la suddivisione appena descritta ottenendo ancora una ripartizione ben proporzionata.

Una variante della procedura precedente riguarda la suddivisione armonica di un rettangolo aureo. In questo caso, si traccia una diagonale del rettangolo e, dai vertici opposti, si fanno partire le perpendicolari alla diagonale; in corrispondenza dei punti individuati, si disegnano le linee verticali e orizzontali, come nella figura seguente:

I 4 punti di intersezione si chiamano nodi aurei e valorizzano tutto ciò che viene lì posizionato, richiamando lo sguardo e l’interesse di chi osserva la composizione. Inoltre, come in precedenza, la segmentazione dello spazio porta alla formazione di una serie di rettangoli anch’essi aurei, sui quali si può ripetere il procedimento:

Chiudo la panoramica sulla simmetria dinamica parlando di un particolare tipo di rettangolo dinamico, il rettangolo argenteo, che ha un rapporto tra il lato maggiore e il lato minore pari a 2,41421356237…, valore esprimibile anche come 1 + √2 e che prende nome di sezione argentea (δS). Questo, al pari del rettangolo aureo, presenta una costruzione geometrica ricorsiva: se dal rettangolo si rimuovono due quadrati (e non uno, come nel caso della sezione aurea) aventi come lato il lato minore del rettangolo, la figura che rimane è anch’essa un rettangolo argenteo:

Tale implicazione è interessante perché consente di scomporre ripetutamente il rettangolo mantenendo un rapporto costante tra le superfici man mano ottenute.

Da notare, infine, che se dal rettangolo argenteo viene rimosso uno solo dei due quadrati, la figura che rimane è un rettangolo dinamico di radice 2, per il quale valgono le considerazioni fatte in precedenza: