Conozca cómo diseñar prototipos interactivos, mallas metálicas y gráficos utilizando Adobe XD.
Guía del usuario Cancelar

Diseñar, crear prototipos y compartir con Adobe XD

  1. Guía del usuario de Adobe XD
  2. Introducción
    1. Novedades de Adobe XD
    2. Preguntas habituales
    3. Diseñar, crear prototipos y compartir con Adobe XD
    4. Gestión de color
    5. Requisitos del sistema
      1. Requisitos de hardware y software
      2. Adobe XD, Big Sur y Apple Silicon | macOS 11
    6. Conceptos básicos del espacio de trabajo
    7. Cambiar el idioma de la aplicación en Adobe XD
    8. Acceder a kits de diseño de interfaz de usuario
    9. Accesibilidad en Adobe XD
    10. Métodos abreviados de teclado
    11. Consejos y trucos
  3. Diseño
    1. Mesas de trabajo, guías y capas
      1. Empezar a usar mesas de trabajo
      2. Usar guías y cuadrículas
      3. Crear mesas de trabajo con desplazamiento
      4. Trabajar con capas
      5. Crear grupos de desplazamiento
    2. Formas, objetos y trazados
      1. Seleccionar, redimensionar y rotar objetos
      2. Mover, alinear, distribuir y organizar objetos
      3. Agrupar, bloquear, duplicar, copiar y voltear objetos
      4. Establecer el trazo, el relleno y las sombras paralelas de objetos
      5. Crear elementos repetidos
      6. Crear diseños en perspectiva con transformaciones 3D
      7. Editar objetos utilizando operaciones booleanas
    3. Texto y fuentes
      1. Trabajar con herramientas de dibujo y texto
      2. Fuentes en Adobe XD
    4. Componentes y estados
      1. Trabajar con componentes
      2. Trabajar con componentes anidados
      3. Añadir varios estados a componentes
    5. Máscaras y efectos
      1. Crear una máscara con formas
      2. Usar efectos de desenfoque
      3. Crear y modificar degradados
      4. Aplicar efectos de mezclas
    6. Maquetación
      1. Redimensionado interactivo y restricciones
      2. Establecer relleno fijo para componentes y grupos
      3. Crear diseños dinámicos con pilas
    7. Vídeos y animaciones de Lottie
      1. Cómo usar los vídeos
      2. Crear prototipos mediante vídeos
      3. Usar animaciones de Lottie
  4. Prototipo
    1. Crear prototipos interactivos
    2. Animar prototipos
    3. Propiedades de objetos compatibles con la animación automática
    4. Crear prototipos con teclado y mando de juego
    5. Crear prototipos utilizando comandos de voz y reproducción
    6. Crear transiciones temporizadas
    7. Añadir superposiciones
    8. Diseñar prototipos de voz
    9. Crear vínculos de anclaje
    10. Crear hipervínculos
    11. Previsualizar diseños y prototipos
  5. Compartir, exportar y revisar
    1. Compartir mesas de trabajo seleccionadas
    2. Compartir diseños y prototipos
    3. Establecer permisos de acceso de vínculos
    4. Usar prototipos
    5. Revisar prototipos
    6. Trabajar con especificaciones de diseño
    7. Compartir especificaciones de diseño
    8. Inspeccionar especificaciones de diseño
    9. Controles de las especificaciones de diseño
    10. Revisar y comentar especificaciones de diseño
    11. Exportar activos de diseño
    12. Exportar y descargar activos de especificaciones de diseño
    13. Grupos compartidos para empresas
    14. Hacer copias de seguridad de recursos de XD o transferirlos
  6. Sistemas de diseño
    1. Sistemas de diseño con Bibliotecas Creative Cloud
    2. Trabajar con activos de documentos en Adobe XD
    3. Trabajar con Bibliotecas Creative Cloud en Adobe XD
    4. Migrar activos vinculados a Bibliotecas Creative Cloud
    5. Trabajar con tokens de diseño 
    6. Usar activos de Bibliotecas Creative Cloud
  7. Documentos en la nube
    1. Documentos en la nube en Adobe XD
    2. Colaborar y coeditar diseños
    3. Coeditar documentos que compartan con usted
  8. Integraciones y complementos
    1. Trabajar con activos externos
    2. Trabajar con activos de diseño de Photoshop
    3. Copiar y pegar activos desde Photoshop
    4. Importar o abrir diseños de Photoshop
    5. Usar activos de Illustrator en Adobe XD
    6. Abrir o importar diseños de Illustrator
    7. Copiar vectores de Illustrator en XD
    8. Complementos para Adobe XD
    9. Crear y administrar complementos
    10. Integración de Jira para XD
    11. Complemento Slack para XD
    12. Complemento Zoom para XD
    13. Publicar diseño de XD en Behance
  9. XD para iOS y Android
    1. Vista previa en dispositivos móviles
    2. Preguntas frecuentes de Adobe XD para dispositivos móviles
  10. Solución de problemas
    1. Problemas conocidos y resueltos
      1. Problemas conocidos
      2. Problemas resueltos
    2. Instalación y actualizaciones
      1. XD aparece como incompatible en Windows
      2. Código de error 191
      3. Código de error 183
      4. Problemas al instalar complementos de XD
      5.  Solicitud para desinstalar y volver a instalar XD en Windows 10
      6. Problemas con la migración de preferencias
    3. Inicio y cierre inesperado
      1.  XD se cierra al iniciar la aplicación en Windows 10
      2.  XD se cierra al cerrar sesión en Creative Cloud
      3. Problema con el estado de suscripción en Windows
      4. Aviso de aplicación bloqueada al iniciar XD en Windows
      5. Generación de volcados de fallos en Windows
      6. Recopilación y uso compartido de registros de errores
    4. Documentos en la nube y bibliotecas Creative Cloud
      1. Problemas con documentos en la nube de XD
      2. Problemas con componentes vinculados
      3. Problemas con bibliotecas y enlaces
    5. Crear prototipos, publicar y revisar
      1. No se pueden grabar interacciones de prototipos en macOS Catalina
      2. Problemas con flujos de trabajo de publicación
      3. Los vínculos publicados no aparecen en los navegadores
      4. Los prototipos no se renderizan correctamente en los navegadores.
      5. El panel de comentarios aparece repentinamente en los vínculos compartidos
      6. No es posible publicar bibliotecas
    6. Importar, exportar y usar otras aplicaciones
      1. Importar y exportar en XD
      2. Archivos de Photoshop en XD
      3. Archivos de Illustrator en XD
      4. Exportar a After Effects desde XD
      5. Archivos de Sketch en XD
      6. Aplicaciones de terceros que no aparecen en Exportar

Conozca cómo diseñar prototipos interactivos, mallas metálicas y gráficos utilizando Adobe XD.

Adobe XD permite a los diseñadores de UX diseñar experiencias de usuario interactivas para aplicaciones web y móviles, utilizando una sola aplicación.

Puede realizar diseños rápidos y sencillos en las mesas de trabajo de XD. Luego, cablee las mesas de trabajo para crear un prototipo interactivo que pueda compartir e iterar con los interesados. También puede usar complementos para repetir automáticamente operaciones o partes de flujos de trabajo de diseñador que resulten tediosas, complejas o repetitivas. 

Adobe XD se integra perfectamente con Photoshop, Illustrator y After Effects.

Puede continuar diseñando en sus aplicaciones preferidas, llevar los activos a XD y luego usar XD para crear y compartir prototipos. XD admite archivos SVG y de mapa de bits, sin ninguna pérdida de fidelidad. Luego puede mejorar aún más los activos en Adobe XD o usarlos para desarrollar prototipos interactivos. 

Flujo de trabajo general

Diseñar, crear prototipos y compartir con Adobe XD
Diseñar, crear prototipos y compartir con Adobe XD

En pocas palabras, el flujo de trabajo puede resumirse en los siguientes pasos de alto nivel:

  • Diseño: cree elementos de formato de diseño, agregue mesas de trabajo e importe recursos desde otras aplicaciones, como Adobe Illustrator, Adobe Photoshop y Adobe After Effects. También puede usar complementos para repetir automáticamente operaciones o partes de flujos de trabajo de diseñador que resulten tediosas, complejas o repetitivas.
  • Prototipo: seleccione objetos o mesas de trabajo del diseño y cree interacciones entre las mesas de trabajo.
  • Compartir: una vez que su proyecto esté listo para revisar, puede compartir prototipos o especificaciones de diseño con los interesados, o bien exportarles el proyecto o los activos.

Siga leyendo para obtener más detalles sobre el diseño, creación de prototipos y compartición en XD.

Diseño

Introducción a Adobe XD

Introducción a Adobe XD

De Dani Beaumont

Seleccione un tamaño preestablecido de las mesas de trabajo. Si desea trabajar con un tamaño personalizado, escriba la anchura y la altura, en píxeles, en los campos de texto de la opción personalizada.  Si desea especificar un tamaño personalizado, haga clic en el icono Tamaño personalizado.

Reúna los activos de una de las siguientes maneras:

  • Use las herramientas de diseño de Adobe XD para diseñar sus activos desde cero. Para obtener más información, consulte Herramientas de dibujo y Herramientas de texto.
  • Copie sus diseños desde Photoshop, Sketch, After Effects o Illustrator y péguelos en la mesa de trabajo de Adobe XD. También puede importar, arrastrar o copiar y pegar un archivo JPG, SVG, PNG o GIF desde:
    • Explorador de archivos (en Windows)
    • Finder (en Mac) 
    • Navegador web
    • Portapapeles del SO

 

Mejore los objetos del diseño. Por ejemplo, combine o enmascare objetos, cambie las propiedades de trazo y relleno, use la superposición para apilar contenido sobre una mesa de trabajo de base y mueva o gire objetos, o use el redimensionamiento inteligente para diseñar activos para múltiples tamaños y diseños de pantalla. Use activos vinculados para crear y mantener una versión única de los kits de interfaz de usuario, hojas de pegatinas o guías de estilo, y compartirla entre documentos para conseguir una escalabilidad de diseño y unos complementos coherentes para automatizar las operaciones de repetición o las partes de flujos de trabajo de diseñador que sean tediosas, complejas o repetitivas.

Para obtener más información, consulte:

Distribuya sin esfuerzo elementos repetidos usando la función Repetir cuadrícula para crear una cuadrícula a partir de contenidos existentes, sin tener que duplicarlos manualmente. Para obtener más información, consulte Crear elementos de repetición.

Puede usar complementos para repetir automáticamente operaciones o partes de flujos de trabajo de diseñador que resulten tediosas, complejas o repetitivas. Para obtener más información, consulte Crear y administrar complementos.

Agregue más mesas de diseño a cada una de las pantallas que necesite en el prototipo. Para obtener más información, consulte Trabajo con mesas.

Prototipo

Puede crear prototipos interactivos utilizando las posibilidades voz, animación automática, gestos de arrastre y transiciones temporizadas. Para obtener más información, consulte Diseño y creación de prototipos por voz en XD, Crear prototipos usando animación automática y gestos de arrastre y Usar transiciones temporizados.

Puede obtener una vista previa de la interactividad de los prototipos y, mientras lo hace, grabar la interacción en forma de archivo MP4.

Para vincular mesas de trabajo o establecer interactividad, seleccione una mesa de trabajo o un objeto y haga clic en la flecha de la derecha. Aparecerá un cable. Simplemente, arrastre y conecte el cable a otro objeto o a otra mesa de trabajo. En la ventana emergente que aparecerá, especifique las opciones de transición y la duración de la transición.

También puede usar la superposición para simular el concepto de transiciones, sin duplicar contenido por varias mesas de trabajo. Para obtener información detallada, consulte Crear prototipos interactivos.

Haga clic en el icono Vista previa de la parte superior derecha de la aplicación. XD muestra una pantalla de vista previa que le permite ver las diferentes páginas y navegar por ellas. La pantalla Vista previa tiene un icono Grabar que le permite grabar el flujo entre páginas y guardarlo en formato MP4. 

Para obtener más información, consulte Obtener una vista previa de interacciones y grabarlas.

Compartir

Comparta prototipos para revisión de diseño, presentación o prueba de usuario. También puede publicar prototipos y especificaciones de diseño para el desarrollo, o personalizar la experiencia de visualización según sus preferencias. Para obtener más información, consulte Compartir diseños y prototipos.

 Adobe

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

¿Nuevo usuario?