Guía del usuario Cancelar

Exportar activos de diseño

Conozca cómo exportar activos listos para la producción de Adobe XD a los formatos de archivo PNG, SVG, JPG y PDF.

Puede exportar activos, como imágenes de mapa de bits, iconos y patrones de fondo, texto y mesas de trabajo como XD a PNG, SVG, JPG y PDF. Estos activos exportados se han optimizado para su implementación en iOS, Android o las aplicaciones web.

Si utiliza XD en macOS, también puede incorporar sus diseños a integraciones de terceros, como Zeplin, Avocode, Sympli, Kite Compositor y Protopie.

Seleccionar activos y mesas de trabajo para exportar

macOS

Seleccione un objeto o una mesa de trabajo, vaya a Archivo > Exportar o pulse Cmd + E.    

Windows

Seleccione un objeto o una mesa de trabajo y vaya a Archivo > Exportar.  

  • Lote: puede exportar por lotes los activos marcados con la opción Marcar para exportación en el Inspector de propiedades. Para exportar varios objetos en forma de un único activo, debe agrupar los objetos antes de exportarlos.
  • Seleccionados: puede seleccionar y exportar activos específicos.
  • Todas las mesas de trabajo: puede seleccionar todas las mesas de trabajo para exportar en un proyecto de diseño.
  • After Effects: puede seleccionar el activo para exportarlo a After Effects.

Marcar capas para exportación

Las capas marcadas para exportación se incluyen como activos en las especificaciones de diseño. Para marcar activos para exportación, seleccione cualquier capa en el lienzo y use cualquiera de las siguientes opciones: 

  • Haga clic con el botón derecho en la capa del lienzo y elija Marcar para exportación en el desplegable. 
  • Abra el panel de capas y haga clic en la marca del icono de exportación  situado al lado del nombre de la capa. 

Exportar activos a diferentes formatos de archivo

Los activos son archivos de diseño que necesitan los desarrolladores para recrear en un sitio web lo que usted ha diseñado, utilizando para ello HTML/CSS/JS o lenguajes nativos como Swift o Java en aplicaciones iOS y Android.

En general, los activos más comunes son las imágenes de mapa de bits, los iconos y los patrones de fondo que puede exportar en estos formatos: PNGSVGPDFJPG.

Con XD 57 y versiones posteriores, puede exportar activos JPG, PNG y PDF con representaciones de color uniformes. Para lograrlo, cambie el perfil de color del documento a sRGB. Si intenta exportar un activo desde un documento que tiene un perfil de color no gestionado, recibe un mensaje que le informa sobre una posible discrepancia de color en el activo exportado. Para obtener más información, consulte Gestión de color.

Exportar como PNG

Elija un tamaño de exportación común o específico de una plataforma, o establezca un tamaño de exportación personalizado:

  • Tamaño de exportación predeterminado o personalizado: elija uno de los tamaños de exportación predeterminados: 0,5x, 1x, 1,5x, 2x, 3x, 4x. También puede ingresar tamaños de exportación personalizados desde 0.1x hasta 10x.
  • Web: los activos se exportan en resoluciones 1x y 2x.
  • iOS: los activos se exportan en resoluciones 1x, 2x y 3x.
  • Android: los activos de diseño se optimizan y exportan para las siguientes densidades de pantalla de Android:
    • ldpi - Baja densidad (75 %)
    • mdpi - Densidad media (100 %)
    • hdpi - Alta densidad (150 %)
    • xhdpi - Extra alta densidad (200 %)
    • xxhdpi - Extra extra alta densidad (300 %)
    • xxxhdpi - Extra extra extra alta densidad (400 %)

Exportar como SVG

Cuando exporta objetos o mesas de trabajo como SVG, puede establecer las siguientes opciones:

Estilos visuales:

  • Atributos de presentación: utiliza atributos XML separados para cada propiedad de estilo individual en cada etiqueta SVG. Este formato es necesario para usar activos de SVG con Android Studio.
  • CSS interno: utiliza una sola etiqueta de estilo con clases de CSS y comparte la configuración de estilo entre objetos con los mismos estilos, por lo que los archivos generados son de menor tamaño.

Imágenes incrustadas o vinculadas:

  • Incrustar: la imagen de mapa de bits está codificada en el archivo SVG.
  • Vincular: la imagen de mapa de bits se almacena por separado, con una referencia al archivo SVG.

Exportar como PDF

Puede exportar activos como PDF de las formas siguientes:

  • Archivo PDF único: puede seleccionar varios activos o mesas de trabajo y exportarlos como un único archivo PDF. 
  • Múltiples archivos PDF: puede seleccionar varios activos o mesas de trabajo y exportarlos como archivos PDF individuales. Se crean archivos PDF diferentes para cada uno de los activos o mesas de trabajo seleccionados.

Exportar como JPG

Cuando exporta activos como JPG, puede establecer las siguientes opciones:

Calidad: elija 20 %, 40 %, 60%, 80 % o 100 %.

Tamaño de exportación:

  • Tamaño de exportación predeterminado o personalizado: elija uno de los tamaños de exportación predeterminados: 0,5x, 1x, 1,5x, 2x, 3x, 4x. También puede ingresar tamaños de exportación personalizados desde 0.1x hasta 10x.
  • Web: los activos se exportan en resoluciones 1x y 2x.

Los JPG no se convierten a PDF. Las imágenes rasterizadas se importan como imágenes y, por lo tanto, parecen convertirse en archivos PDF.

Exportar activos a aplicaciones de terceros

También puede llevar sus diseños desde XD a otras aplicaciones como Zeplin, Avocode, Sympli, Kite Compositor y Protopie

Veamos un ejemplo de flujo de trabajo de XD en macOS con Zeplin:

  1. Seleccione una mesa de trabajo o capa en su archivo XD y haga clic en Archivo > Exportar > Zeplin.

    Si tiene varias aplicaciones integradas con XD, el método abreviado de teclado (⌥⌘E) permite ejecutar la última integración que haya utilizado.

    Exportación de activos a Zeplin
    Exportación de activos a Zeplin

  2. Haga clic en Importar. Para reemplazar las pantallas existentes en Zeplin con el mismo nombre, seleccione Reemplazar pantallas con el mismo nombre. Zeplin la agrega como una nueva versión de esa misma pantalla, sin perder sus notas.

    Si tiene problemas al trabajar con Zeplin en XD, consulte No se puede ver la aplicación de terceros compatible en las opciones de Exportación para soluciones.

Solución de problemas

¿Tiene problemas con la exportación de activos? Para solucionar problemas relacionados con la exportación, consulte ¿Por qué no puedo importar o exportar archivos en Adobe XD?

¿Tiene alguna pregunta o idea?

Pregunte a la comunidad

¿Desea que su herramienta de diseño favorita tenga flujos de trabajo de exportación adicionales? Vote o añada su solicitud en XD UserVoice
.

Si tiene alguna pregunta que hacer o una idea que compartir, venga y participe en la Comunidad de Adobe XD. Nos gustaría conocer sus comentarios y ver sus creaciones.

Obtén ayuda de forma más rápida y sencilla

¿Nuevo usuario?