Spring GDS 25è Aniversari
Una empresa de logística que envia a 190 països va construir alguna cosa per enviar-se a si mateixa.
Framer Motion és una llibreria d'animació per a React. Et permet descriure com es mouen, s'esvaeixen i responen a la interacció els elements mitjançant una API declarativa, així que escrius com hauria de veure's una animació en comptes d'avançar manualment fotograma a fotograma. Un sol motion.div amb una prop animate reemplaça una pila de keyframes CSS i codi de temporització en JavaScript.
Va sortir de Framer, l'eina de disseny, i es va alliberar com a llibreria de React independent. El 2024 va passar a anomenar-se Motion i es va ampliar per donar suport a JavaScript pur i altres frameworks, tot i que la majoria encara l'anomena Framer Motion. Resol bé les parts difícils del moviment: física de molles que se sent natural, gestos com arrossegar i hover, animacions de layout que transicionen elements amb suavitat quan el DOM es reorganitza, i seqüències orquestrades a través de molts components. Un equip de producte que afegeix una transició satisfactòria quan una targeta s'expandeix en un panell complet recorreria normalment a la seva animació de layout.
Competeix amb React Spring i amb CSS fet a mà. CSS és més lleuger quan només necessites un hover o un esvaïment simple. Framer Motion guanya el seu pes un cop les interaccions es tornen coordinades, interrompibles o lligades a l'estat del component.
Fem servir Framer Motion quan el moviment és part de com comunica una interfície, no decoració empolvorada al final. Una bona animació diu a l'usuari d'on va venir una cosa i on va anar. El portem a la feina de desenvolupament web i disseny alhora, així els enginyers que construeixen la transició i els dissenyadors que li donen forma llegeixen de la mateixa intenció.
El mantenim contingut. El moviment que es baralla amb l'usuari o frena un flux és pitjor que cap, així que el provem en dispositius reals i tallem qualsevol cosa que arrossegui. Quan un partner vol una interfície que se senti viva sense sentir-se recarregada, aquesta sol ser l'eina a la qual recorrem.
Vols moviment que guiï en comptes de distreure? Anem a dissenyar-lo junts.
Una empresa de logística que envia a 190 països va construir alguna cosa per enviar-se a si mateixa.
Convertir una marca en un negoci que funciona.
Mig milió de persones. Una app. Zero caos.















