¿Qué es SVG?

SVG (gráficos vectoriales escalables) es un lenguaje de formato XML para describir imágenes bidimensionales. Los archivos SVG ofrecen gráficos HiDPI en un formato compacto, independientes de la resolución, para su uso en Internet y en dispositivos móviles y para su impresión. Puede diseñar SVG con CSS y su compatibilidad con scripts y animaciones hacen de SVG una parte integral de la plataforma web.

Algunos formatos de imagen comunes en Internet, como GIF, JPEG, y PNG son muy grandes y tienen una resolución muy baja. El formato SVG es más eficaz ya que describe imágenes en términos de formas vectoriales, texto y efectos de filtro. Los archivos SVG son compactos y ofrecen gráficos de alta calidad en Internet y en dispositivos portátiles con restricciones de recursos. Se puede aumentar la vista de una imagen SVG en la pantalla sin perder enfoque, detalle o claridad. Además, el formato SVG ofrece mejor compatibilidad con texto y colores, lo que garantiza que las imágenes se verán tal y como aparecen en el escenario. El formato SVG está totalmente basado en XML y ofrece muchas ventajas tanto para desarrolladores como para otros usuarios.

Nota:

Ahora puede exportar archivos SVG de Animate sin que se creen definiciones ni identificadores no deseados en el proceso. La composición en SVG está mejorada en la versión 19.1 de Animate. Esta opción de exportación aumentará la calidad de los archivos SVG que se importen en Character Animator.

Flujo de trabajo de exportación a SVG en Animate CC

Animate CC permite exportar al formato SVG, versión 1.1. Puede crear ilustraciones enriquecidas con las herramientas de diseño potentes disponibles en Animate y, a continuación, exportarlas a SVG.

En Animate CC, puede exportar fotogramas y fotogramas clave seleccionados de una animación. Asimismo, como las imágenes exportadas son vectoriales, la resolución de imagen es superior incluso si se escala a diferentes tamaños.

La función de exportación a SVG sustituye a la exportación a FXG (eliminada de Animate CC (junio de 2013)). Observará que el rendimiento de la función de exportación a SVG y la calidad de la salida son muy superiores. Asimismo, en comparación con FXG, la pérdida de contenido en SVG es mínima.

Ilustración con efectos de filtro

Con SVG, los efectos de filtro no se mostrarán exactamente igual que en Animate, ya que no hay una asignación equivalente entre los filtros disponibles en Animate y SVG. Sin embargo, Animate Pro aprovecha las combinaciones de diferentes filtros simples de SVG para simular un efecto similar.

Control de varios símbolos

La exportación de SVG puede controlar varios símbolos sin problemas ni pérdida de contenido. El resultado es similar a la ilustración en el escenario en Animate.

Exportación de ilustraciones en formato SVG

  1. En Animate CC, es posible arrastrar o mover la cabeza lectora hasta el fotograma que desee.
  2. Seleccione Archivo > Exportar > Exportar imagen. O bien seleccione Archivo > Configuración de publicación (opción Imagen SVG de la sección Otros formatos.)
  3. Introduzca o acceda hasta la ubicación en la que quiera guardar el archivo SVG. Asegúrese de que selecciona SVG en Guardar como.
  4. Haga clic en Aceptar.
  5. En el diálogo Exportar SVG, elija Incorporar o Vincular al archivo SVG.
    • Incluir capas ocultas: exporta todas las capas ocultas del documento de Animate. Si se anula la selección de Exportar capas ocultas se evita que todas las capas (incluidas las anidadas dentro de clips de película) marcadas como ocultas se exporten en el archivo SVG resultante. De esta forma puede probar distintas versiones de documentos de Animate con capas invisibles.
    • Incorporar: incorpora un mapa de bits en el archivo SVG. Utilice esta opción si desea incorporar mapas de bits directamente en el archivo SVG.
    • Vincular: proporciona un vínculo a la ruta de los archivos de mapa de bits. Utilice esta opción si no desea incorporar, sino proporcionar un vínculo a los mapas de bits del archivo SVG. Si selecciona la opción Copiar imágenes en la carpeta, los mapas de bits se guardarán en la carpeta Imágenes creada en la ubicación donde se exporta el archivo SVG. Cuando no se selecciona la opción Copiar imágenes en la carpeta, se hace referencia a los mapas de bits en el archivo SVG desde su ubicación original. Si la ubicación del mapa de bits de origen no está disponible, se incorporarán en el archivo SVG.
    • Copiar imágenes en la carpeta /Imágenes: permite copiar el mapa de bits en la carpeta/Imágenes. Si todavía no existe la carpeta /Imágenes se crea en la ubicación de exportación del SVG.
export-to-svg
  1. Haga clic en Aceptar.

Nota:

El formato SVG no admite algunas funciones de Animate. Durante la exportación, el contenido creado mediante estas funciones se eliminará o se cambiará de forma predeterminada a una función admitida. Para obtener más información, consulte este artículo.

Si lo prefiere, puede utilizar el cuadro de diálogo Configuración de publicación para exportar archivos SVG desde Animate CC (Archivo > Configuración de publicación). Seleccione la opción SVG de la sección Otros formatos para exportar archivos SVG.

Nota:

Se recomienda visualizar los archivos SVG únicamente en navegadores modernos con las últimas actualizaciones. Esto se debe a que algunos filtros gráficos y efectos de color no se procesarán correctamente en versiones anteriores de navegadores como Internet Explorer 9.

Intercambio de archivos SVG con Adobe Illustrator

Animate CC permite el intercambio de contenido con Adobe Illustrator. Este flujo de trabajo sustituye a la función de exportación de FXG que se eliminó en Animate CC (13.0). Puede exportar archivos SVG desde Animate e importarlos en Adobe Illustrator. Para obtener más información sobre el uso de archivos SVG en Adobe Illustrator, consulte este tema de la ayuda.

Utilice este flujo de trabajo si desea realizar ediciones granulares en las ilustraciones y añadir detalles enriquecidos. También puede utilizar Illustrator para añadir efectos, como sombras, a la ilustración.

Para editar archivos SVG en Adobe Illustrator y usar el contenido editado en Animate, haga lo siguiente:

  1. En Animate CC, exporte a SVG.
  2. Abra el archivo SVG en Adobe Illustrator para editar la ilustración.
  3. Guarde el archivo SVG como un archivo .ai e impórtelo en Animate. Para obtener más información sobre el uso de archivos de Illustrator en Animate.
Print

Esta obra está autorizada con arreglo a la licencia de Reconocimiento-NoComercial-CompartirIgual 3.0 Unported de Creative Commons.  Los términos de Creative Commons no cubren las publicaciones en Twitter™ y Facebook.

Avisos legales   |   Política de privacidad en línea