Rive

Goal

Rive permite a los desarrolladores crear y enviar hermosas animaciones interactivas a cualquier plataforma. Sus motores de ejecución (runtimes) de código abierto hacen posible que los creadores animen una vez y luego las lancen en cualquier plataforma que deseen.

Sin embargo, esto no siempre fue así. Al principio, el equipo pasaba mucho tiempo gestionando el ciclo de desarrollo: manteniendo diferentes paquetes web del lado del cliente para gran parte de la funcionalidad de la interfaz de usuario, un proceso de compilación personalizado, operaciones de desarrollo (dev ops) personalizadas, pruebas personalizadas, análisis de código (linting), servidores de lenguaje y más, todo desde paquetes independientes que requerían mantenimiento y actualizaciones constantes.

En su lugar, el equipo quería un framework que englobara todas estas cosas, garantizando la compatibilidad entre estos aspectos del flujo de trabajo para poder concentrarse más en el desarrollo y menos en el mantenimiento. Y para dar soporte a su robusta interfaz de usuario con animaciones sin fallas en tiempo real, Rive necesitaba una herramienta que pudiera manejar el renderizado de gráficos pesados en múltiples navegadores y plataformas. Fue entonces cuando recurrieron a Flutter.

Why Flutter?

La primera versión de Rive se escribió completamente con JavaScript ES5 y DOM, lo cual funcionaba muy bien para la web, pero no para mucho más. Así que luego probaron React con ES6. Utilizaron webpack y una versión temprana de CanvasKit, pero mantener todas las plataformas diferentes requería un esfuerzo significativo.

Casi al mismo tiempo, Rive estaba colaborando con el equipo de Flutter en el evento Flutter Interact. Cuanto más aprendían sobre Flutter, mejor parecía adaptarse a Rive. Ofrecía una plataforma cohesiva con excelentes herramientas, un lenguaje de programación fuertemente tipado y potentes herramientas de análisis de lenguaje, incluyendo un formateador estandarizado, análisis de código integrado, servidores de lenguaje para los entornos de edición más populares y la capacidad de realizar pruebas directamente desde los entornos de edición.

Their solution

El equipo decidió darle una oportunidad a Flutter. Construyeron un prototipo con CanvasKit en Flutter y notaron una mejora de inmediato. Además de ofrecer una verdadera solución multiplataforma, también se volvió mucho más fácil incorporar nuevos ingenieros. También les gustaron mucho las capacidades de prueba integradas, lo que facilitó enormemente mantener la calidad y estabilidad de la aplicación.

Results

Rive lanzó su editor construido completamente en Flutter. Su base de código ahora es mucho más fácil de mantener y permite a los ingenieros incorporarse y comenzar a escribir código de inmediato.

También descubrieron que es muy fácil agregar piezas personalizadas en Flutter. La creación de funciones es más sencilla y divertida, y los diseñadores tienen una capacidad mucho mayor para experimentar y construir prototipos. Esto les ha permitido desarrollar experiencias mucho más enriquecidas en Rive, incluyendo animaciones, gráficos interactivos y diseños fluidos y reactivos.

La estabilidad general de la aplicación también ha mejorado. Gracias a las funciones de prueba integradas, ahora ejecutan miles de pruebas por compilación, lo que les ha dado la confianza para pasar a un ciclo de lanzamiento diario.

Basándose en su éxito, el equipo ahora está trabajando en lanzar una aplicación de escritorio para macOS. Para este lanzamiento, el equipo dice que ni siquiera tienen que hacer mucha personalización, ya que la abstracción ya está hecha. También descubrieron que es muy fácil agregar piezas personalizadas en Flutter. La creación de funciones es más sencilla y divertida, y los diseñadores tienen una capacidad mucho mayor para experimentar y construir prototipos. Esto les ha permitido desarrollar experiencias mucho más enriquecidas en Rive, incluyendo animaciones, gráficos interactivos y diseños fluidos y reactivos.