lianasvet.ru

Casi studio / Sito d’autore · Benessere

Un sito bello che respira, e resta leggero.

Liana Svetlanova è kinesiologa e osteopratica: pratiche per le donne, estetica senza iniezioni, «reset» e kinergetica, a Goryachy Klyuch, a Krasnodar e online. Al suo laboratorio, «Zvuchanie zhenshchiny», serviva un sito all’altezza di un lavoro fatto di lentezza e attenzione. L’abbiamo costruito attorno al respiro: ogni movimento della pagina segue lo stesso ciclo, c’è una mappa del corpo in 3D — e niente di tutto questo si paga in velocità o accessibilità.

lianasvet.ru ↗

lianasvet.ru
Il primo schermo della home di lianasvet.ru su desktop: la fotografia e il titolo che compare riga per riga

Il problema

Un sito bello, di solito, è un sito pesante.

Nel benessere il sito è il primo incontro: chi arriva deve sentire calma e cura prima ancora di leggere. Per questo i siti personali del settore spesso puntano tutto sull’effetto — foto enormi, animazioni, magari un po’ di 3D. Il conto lo paga il telefono: pagine che si caricano a scatti, un movimento che distrae invece di accompagnare, e chi naviga da tastiera o mal sopporta le animazioni resta fuori.

E c’è un secondo rischio, più sottile: promettere troppo. Chi lavora con il corpo parla di sonno, tensione, viso — ed è facile scivolare in affermazioni che nessuno studio sostiene. Un sito bello che promette troppo non ispira fiducia.

La nostra risposta

Il design segue il respiro, e ogni effetto giustifica il suo peso.

Abbiamo dato al sito un solo ritmo: quello di un respiro lento. Da lì discendono tutte le animazioni, scritte da noi in un motore minuscolo invece che con una libreria pesante. Il pezzo forte — la mappa del corpo in 3D — è stato ridotto a una frazione del suo peso originale. E i testi separano con chiarezza ciò che è dimostrato da ciò che è esperienza. È la cura che mettiamo in ogni sito d’autore: la bellezza sì, ma senza lasciare indietro nessuno.

✓Tutto il movimento nasce da un solo ciclo di respiro, di 10,9 secondi
✓Un motore di animazione nostro, di circa 2 KB compressi
✓Mappa del corpo in 3D: da 37,2 MB a 0,55 MB, usabile anche da tastiera
✓Con «riduci movimento» attivo nel sistema, ogni animazione si spegne

Il ritmo del respiro

Ogni movimento segue lo stesso respiro.

Cinque respiri e mezzo al minuto: un ciclo completo dura 10,9 secondi. Su questo numero si regola tutto il sito — ogni durata è ricavata dallo stesso ciclo, così niente si muove a caso o di fretta. Anche il titolo respira: il disegno delle lettere cambia piano, lungo un asse di un font variabile. Il visitatore non conta i secondi, ma sente che la pagina ha un passo calmo e coerente, lo stesso da una sezione all’altra.

lianasvet.ru/telo
La mappa del corpo su lianasvet.ru/telo dal telefono: il titolo «Dove il corpo trattiene la tensione», la figura con i punti e l'invito a trascinarla per ruotarla

La mappa del corpo dal telefono: luce morbida, la figura con i punti — si ruota con un dito.

01Righe che emergono. I titoli escono da sotto una maschera, una riga alla volta.
02Cornici e profondità. Le cornici delle immagini si aprono, i piani scorrono con una parallasse leggera.
03Numeri e linee. I contatori salgono, le linee si disegnano sotto gli occhi.
04Luce viva. Bagliori tenui che danno calore alla pagina senza distrarre dal testo.
05Circa 2 KB. Tutto questo è un motore nostro, compresso a circa 2 KB, al posto di una libreria di animazione pesante.

E se nelle impostazioni del dispositivo è attivo «riduci movimento», il sito lo rispetta fino in fondo: tutte le animazioni si spengono, il contenuto resta.

Mappa del corpo · 3D

Un corpo in 3D che non rallenta nessuno.

Sulla pagina /telo c’è un modello tridimensionale del corpo con sei punti: ognuno apre il suo pannello. Il 3D appesantisce un sito in fretta — il modello di partenza pesava 37,2 MB. L’abbiamo ridotto a 0,55 MB, da 831.198 a 41.550 triangoli. La scena 3D si carica a parte, e la home, che deve aprirsi subito, il WebGL non lo usa affatto.

01Da 37,2 MB a 0,55 MB. Il modello passa da 831.198 a 41.550 triangoli.
02Sei punti, veri pulsanti. Si raggiungono con il tasto Tab e si aprono dalla tastiera, non solo con il mouse o con il dito.
03Si carica a parte. La scena 3D arriva separata dal resto della pagina; se non è disponibile, al suo posto resta una silhouette.
04In home, niente WebGL. Due render statici sostituiscono la scena 3D, così la pagina principale resta leggera.
lianasvet.ru/telo
La mappa 3D del corpo su lianasvet.ru/telo: la figura con i punti e, a destra, l'elenco dei sei punti — nuca, mascella, collo e clavicole, spalle e parte alta della schiena, diaframma, basso ventre

Il modello 3D e, accanto, l’elenco dei sei punti: ognuno apre il suo pannello. Tutti e sei i punti sono pulsanti veri, raggiungibili da tastiera.

Contenuti · foto · autonomia

Onesto nei testi, coerente nelle immagini.

La bellezza di un sito d’autore non sta solo nel movimento. Sta nel tono dei testi, nella coerenza delle immagini — e nel fatto che l’autrice possa curarlo da sé, senza chiamare uno sviluppatore per ogni virgola.

01Un cerchio per respirare. Sulla pagina /rezet c’è un cerchio del respiro da seguire lì, sulla pagina stessa: la pratica si può provare subito.
02Dimostrato ed esperienza, separati. Le pagine delle direzioni hanno blocchi che distinguono ciò che è dimostrato da ciò che è esperienza pratica.
03Una serie fotografica sola. Le foto, fornite dalla cliente e nate da servizi diversi, sono state uniformate nel colore da uno script: ora sembrano un unico racconto.
04Testi in mano alla cliente. Un pannello leggero le permette di modificare i suoi testi da sola, con istantanee per tornare a una versione precedente.

Le quattro direzioni del laboratorio:

Pratiche femminiliEstetica senza iniezioniResetKinergetica
lianasvet.ru/rezet
La pagina /rezet di lianasvet.ru dal telefono, con il cerchio del respiro da seguire

Il cerchio del respiro della pagina /rezet, da seguire con gli occhi direttamente dal telefono.

Come è fatto

Bello sì, ma prima veloce, trovabile e accessibile.

Sotto la superficie c’è un sito moderno e sobrio: React e TypeScript, costruito con Vite; three.js entra in gioco solo per la mappa del corpo. La build genera per ogni pagina un HTML già pronto, con il suo contenuto, pensato per chi arriva — persona o motore di ricerca — prima ancora che parta il JavaScript.

Il sito è in russo e si rivolge alle donne; è online da settembre 2026.

VelocitàPrimo schermo da 1.081 KB a 191 KB, LCP da 2,9 s a 1,5 s — misura di laboratorio dello sviluppatore
SEOPer ogni indirizzo title, canonical, Open Graph e dati strutturati (Person, Service, FAQPage, BreadcrumbList); sitemap automatica; una 404 onesta; favicon secondo i requisiti di Yandex
AccessibilitàLink «salta al contenuto», menu chiuso escluso dall’ordine di tabulazione, «riduci movimento» che spegne ogni animazione
AutonomiaPannello leggero per i testi, con istantanee per tornare indietro
Struttura10 indirizzi: 7 pagine e 3 articoli del diario
TempiDall’8 agosto al 16 settembre 2026

Il risultato

Una bellezza che non si paga in velocità.

191KB

il peso del primo schermo, da 1.081 KB — misura di laboratorio

1,5s

di LCP, da 2,9 s — misura di laboratorio dello sviluppatore

0,55MB

il modello 3D del corpo, da 37,2 MB di partenza

REALIZZATO DA STUDIO REMARKA PER IL CLIENTE — VERIFICABILE SU lianasvet.ru

Interessati a questo progetto?

Vi serve un sito o un’app su misura? Parliamone.

Progettiamo e sviluppiamo siti e web app su misura per aziende e professionisti. Raccontateci la vostra idea: rispondiamo con un’analisi o un preventivo chiuso.

  • Preventivo chiuso entro 24 ore
  • Prezzo chiaro, senza sorprese
  • I vostri dati restano nell’UE

Richiesta rapida

Preferite raccontare tutto con calma? Compilate il brief →