Înapoi la Laborator
Explorare în curs
animation

Câmp
elastic

Un câmp de puncte pe o grilă. Cursorul le desparte — fiecare sare în afară cu cât ești mai aproape — și în clipa în care pleci, sar înapoi acasă.

Focus

Un sistem elastic care cedează la presiune și își recapătă forma.

Mediu

Framer Motion

Durată

În curs

Actualizat

iunie 2026

00 / Intro

Mișcă cursorul printre punctele de mai sus. Fiecare sare în afară proporțional cu cât de aproape ești, încălzindu-se pe măsură ce se mișcă; pleacă, și arcurile trag tot câmpul înapoi în grila lui.

01 / Note

De ce
aceasta.

Sistemele bune sunt elastice, nu rigide. Împinge în ele și cedează — local, proporțional — apoi își recapătă forma fără să păstreze urma loviturii. Asta e valabil pentru un roadmap rezilient, o echipă sănătoasă, o interfață bine făcută. Lucrurile rigide crapă; cele fragile rămân îndoite. Aici e elasticitatea fără nimic altceva atașat.

02 / Note

Cum
funcționează.

Framer Motion și fizica lui de arcuri — o idee diferită de un timeline GSAP. Nu există nicio animație pe keyframe-uri aici: fiecare punct își derivă un offset țintă din poziția vie a cursorului (o motion value), iar un arc urmărește continuu acea țintă. Scoate input-ul și ținta revine la zero, așa că arcul aduce totul acasă de unul singur.

Următorul experiment · animation

Cascadă

Deschide caietul