En CSS, ¿cuál es la mejor herramienta para animar formas de polígonos?

Si quieres una animación decente y un poco de control, te sugiero que uses GIF animados. CSS es genial, pero, no importa cómo sepas CSS (y, como dijiste, no eres un experto en absoluto) no podrás lograr nada . Simplemente tome cualquier programa de edición de fotos (solo inicie una búsqueda en Google; hay muchos programas gratuitos que pueden crear GIF animados) y cree uno.

Algunas de las ventajas de los GIF animados son:

  1. Flexibilidad Puedes crear básicamente cualquier animación. ¿Quieres polígonos? OKAY. Puede crear desvanecimientos, transparencias y otros efectos que desee.
  2. Facilidad El GIF animado no necesita ninguna codificación adicional una vez que está hecho. Simplemente lo importa en un archivo HTML y hace su trabajo.

¿Y si desea animar el GIF solo cuando se activa un determinado evento? Bueno, entonces usarías un poco de JavaScript para detectar ese evento, y luego, cuando se active, cambia el GIF estático al GIF animado. ¡Es bastante fácil!

SVG es la mejor opción.

Gráficos vectoriales escalables ( SVG ) es un formato de imagen vectorial basado en XML para gráficos bidimensionales con soporte para interactividad y animación.


Introducción a svg : https://en.m.wikipedia.org/wiki/


Aprenda de w3school: http://www.w3schools.com/svg/


Los SVG son livianos, fácilmente personalizables y se verán igual en la pantalla grande también.

Le sugiero que busque en gráficos vectoriales escalables (SVG). El formato es ampliamente compatible, el gráfico se puede transformar a través de CSS. Además, los SVG se pueden colocar en la página sin solicitarlos al servidor (por ejemplo, no como una imagen), pero el código SVG se puede insertar directamente en el HTML, o incluso en CSS a través de pseudoelementos. Esto hace que este método para gráficos animados sea realmente versátil.

Le recomiendo que lea sobre los artículos de Sara Soueidan sobre el tema: https://sarasoueidan.com/tags/svg/