Cómo exportar a PNG en Figma

Ya sea que desee exportar capas, grupos o marcos de imágenes como JPG, PNG o SVG, Figma lo tiene cubierto .

Pero en caso de que no sepa cómo exportar imágenes en varios formatos o qué tipos de opciones de exportación tiene, este artículo le proporcionará algunas pautas y consejos sobre cómo mejorar su experiencia con Figma.

Exportar a PNG

Exportar imágenes PNG es probablemente la primera opción de todos. El proceso es el mismo sin importar el formato que desee: PNG, JPG, SVG, etc.

• Seleccione una imagen.

• Seleccione la sección «Exportar» en la barra lateral derecha.

• Haga clic en el signo «+».

• Seleccione el formato de imagen PNG.

• Haga clic en el botón Exportar imagen.

Antes de exportar, asegúrese de usar la función de vista previa para asegurarse de que tiene la imagen correcta y no requiere más modificaciones.

Exportar seleccionado a PNG

Si desea exportar el elemento seleccionado, el proceso es lo más simple posible.

• Seleccione un elemento o marco para exportar.

• Vaya al panel de Propiedades.

• Desplácese hacia abajo para encontrar la sección Exportar.

• Haga clic en el signo «+».

• Seleccione el formato de imagen PNG.

• Establezca un tamaño de elemento diferente si es necesario.

• Exportar el elemento seleccionado.

Métodos de exportación PNG alternativos

Si tiene una imagen en Figma que desea compartir, exportarla desde la aplicación no es la única forma.

Una de las mejores funciones es la opción «Copiar como PNG». Así es como funciona.

• Seleccione una imagen en Figma .

• Haga clic derecho en la imagen para abrir el menú.

• Seleccione la opción «Copiar como PNG».

• Pegue la imagen en otra aplicación.

Esta función le permite copiar la versión PNG de la imagen u objeto deseado en Figma directamente al portapapeles. Esta será la versión 1x predeterminada de la imagen si el objeto no tiene otra configuración de exportación.

Para hacerlo aún más fácil, puede usar los siguientes atajos de teclado.

• «Ctrl + Shift + C» es el atajo de teclado para dispositivos Windows.

• «Comando + Shift + C» es el atajo de teclado para dispositivos Mac.

El uso de este método le brinda una forma más rápida de compartir una copia PNG de un objeto en Figma. Sin embargo, exportar una imagen PNG usando el método clásico te dará más control sobre la calidad de la imagen.

Exportar múltiples capas como un PNG

Si intenta seleccionar varias capas y exportarlas como PNG, obtendrá un archivo zip con cada capa individual en un formato PNG separado.

Si bien esto es excelente para exportar varios archivos a la vez, no ayudará a los usuarios que necesitan fusionar todas las capas en un solo archivo PNG.

Ahí es donde entra en juego la función «Grupo». Puede seleccionar varias capas en Figma y ponerlas en un grupo. Luego puede exportar el grupo como un archivo PNG, lo que le dará un archivo con todas las capas seleccionadas.

• Seleccione las capas deseadas.

• Seleccione «Grupo» en el menú.

• Seleccione un grupo y vaya a la sección «Exportar».

• Haga clic en el signo «+».

• Selecciona el formato PNG.

• Exportación de grupo.

Como la mayoría de las otras acciones en Figma, esto también se puede simplificar. Por ejemplo, puede crear un grupo usando métodos abreviados de teclado.

• «Ctrl + G» es el atajo de teclado para dispositivos Windows.

• «Comando + G» es el atajo de teclado para dispositivos Mac.

Si no está satisfecho con su selección de capa, presione «Mayús+Ctrl+G» o «Mayús+Comando+G» para desagrupar su selección.

Configuración de calidad de exportación PNG

De forma predeterminada, Figma admite archivos PNG RGBA de 32 bits. Esto es útil ya que le permite controlar la opacidad de los píxeles.

A menudo se prefiere el formato PNG porque la calidad de la imagen no se ve afectada cuando se comprime el recurso. Esto no significa que no pueda tener problemas. Muchos usuarios de Figma se quejan de que la calidad PNG se ve afectada cuando suben sus fotos a la web. Pero ese no es necesariamente el problema de Figma. A menudo, esto se debe a la compresión realizada por los servidores que procesan su descarga.

Hay algo que puede hacer para ajustar la calidad para que su imagen no sufra tanto cuando se comprime en otro servidor.

• Seleccione una imagen.

• Seleccione la sección «Exportar» en la barra lateral derecha.

• Haga clic en el signo «+».

• Seleccione el formato de imagen PNG.

• Elija el tamaño «2x».

• Haga clic en el botón Exportar imagen.

Exportar a 2x dará como resultado una resolución PNG más alta. Esto reducirá la posibilidad de que sus fotos se vuelvan borrosas o pierdan calidad al subirlas a las plataformas de redes sociales.

Si es un usuario más avanzado o tiene requisitos de imagen especiales, no dude en ajustar el valor del multiplicador de píxeles antes de exportar el objeto como PNG.

Cómo exportar a otros formatos desde Figma

También podría estar interesado en aprender cómo exportar rápidamente objetos en Figma a varios formatos de archivo que puede guardar en su dispositivo.

Exportar como JPG

Utilice el siguiente método para exportar capas o marcos de imágenes como un archivo JPG.

• Seleccione un objeto en Figma.

• Haga clic en el icono «+» en la sección «Exportar».

• Seleccione el formato JPG en PNG.

• Haga clic en el botón «Exportar» después de realizar los cambios, si es necesario.

Exportar como SVG

Exportar un archivo en formato SVG puede ser muy útil para muchos usuarios. Así es como se hace.

• Seleccione uno o más recursos en su Figma.

• Vaya a la sección «Exportar».

• Haga clic en el signo «+».

• Seleccione un SVG de la lista.

• Haz clic en «Exportar».

También puede hacer esto haciendo clic en un formato de archivo ya seleccionado. Figma recuerda el último formato de archivo que exportaste.

Esto significa que puede hacer clic en un formato de archivo preparado para abrir un menú desplegable y seleccionar SVG desde allí. El signo «+» y los botones de formato de archivo se colocan cerca uno del otro, por lo que cualquiera de los dos métodos funciona igual de rápido.

Exportar como PDF

Si está trabajando en un folleto o una presentación, puede exportar rápidamente su trabajo como PDF directamente desde Figma.

• Seleccione los marcos que desea incluir en el PDF.

• Vaya a la sección «Exportar».

• Haga clic en el signo «+».

• Seleccione PDF en el menú desplegable.

• Haz clic en «Exportar».

Tenga en cuenta que, a veces, Figma no puede organizar sus marcos en el orden correcto. Para evitar esto, puedes usar un compresor de imágenes .

Esta es una herramienta amigable para principiantes para reducir y comprimir imágenes de Figma y exportarlas a varios formatos como PNG, JPG, PDF, GIF, WebP y más.

Software que es fácil de usar

Figma es una herramienta de diseño web bastante simple. Si ha usado un par de editores de fotos antes, familiarizarse con Figma es fácil.

La interfaz de usuario simplificada hace que el software sea intuitivo. Además, tiene control total sobre la calidad de salida con Figma, lo que le permite configurar sus propios multiplicadores de píxeles para evitar la pérdida de calidad al comprimir fuera del sitio.

¿Has usado alguno de estos consejos de Figma para tus propias imágenes? Cuéntanos cómo te fue en la sección de comentarios a continuación.