Desarrollo creativo
Las herramientas a las que recurrimos para crear una funcionalidad visual: animación, visualización, 3D, física y pizarras, cada una con nuestra opinión.
Animación
anime.js v4
OSSLigera, con tree-shaking: el punto justo para el movimiento en interfaces.
La usamos en el hero que acabas de ver.
GSAP
freemiumEl caballo de batalla en producción. El estándar del sector desde hace más de 20 años.
Recurre a ella cuando anime no te basta. Licencia de pago para unas pocas funciones, gratis en el 99 % de los casos.
Motion
OSSPrimitivas de animación declarativa para apps de React.
Lo que eliges cuando React con movimiento declarativo supera el estilo imperativo de anime.
Rive
freemiumAnimaciones interactivas creadas por diseñadores, en archivos .riv.
Para cuando quien diseña contigo quiere publicar la animación por su cuenta.
3D
Babylon.js
OSSEl primo más pesado de Three.js, pensado para juegos y física exigente.
Elígela si vas más allá de lo que da de sí el rendimiento de Three.
React Three Fiber
OSSThree.js expresado con componentes de React.
Nuestra elección cuando el 3D es un componente dentro de una app más grande, no la app entera.
Three.js
OSSLa librería WebGL por defecto.
Enorme, bien documentada y lenta de aprender, pero por algo la usan todas las apps 3D de la web.
Visualización
D3.js
OSSEnlace de datos al DOM a bajo nivel: potente y con aristas.
Sigue siendo el kit más completo; combínala con Observable Plot para resultados rápidos.
Apache ECharts
OSSApache ECharts trae más de 50 tipos de gráfico listos para producción.
Para cuando necesitas gráficos que ya funcionen en cualquier navegador e idioma.
Observable Plot
OSSLa hermana más amable de D3, del mismo equipo.
Con una línea queda bien desde el primer momento: nuestra opción por defecto para gráficos de datos puntuales.
visx
OSSPrimitivas de React que envuelven las escalas y ejes de D3.
El puente entre React y D3 sin los dolores de cabeza de React-D3.
Pizarras
Excalidraw
OSSEstilo dibujado a mano para charlas y documentación.
Para cuando quieres que tus diagramas parezcan un boceto, no un plano de ingeniería.
tldraw
freemiumSDK de pizarra integrable con un lienzo que se siente real.
La usamos internamente para bocetos de arquitectura: se integra en 10 líneas.
