Guía del usuario Cancelar

Crear prototipos utilizando comandos de voz y reproducción

  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. Requisitos del sistema
      1. Requisitos de hardware y software
      2. Adobe XD, Big Sur y Apple Silicon | macOS 11
    5. Conceptos básicos del espacio de trabajo
    6. Cambiar el idioma de la aplicación en Adobe XD
    7. Acceder a kits de diseño de interfaz de usuario
    8. Accesibilidad en Adobe XD
    9. Métodos abreviados de teclado
    10. Consejos y trucos
    11. Opciones de suscripción de Adobe XD
    12. Cambios en el plan de inicio de XD
  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
  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 y crear prototipos mediante comandos de voz, reproducción de voz y reproducción de audio.

Puede utilizar comandos de voz para desencadenar una interacción entre mesas de trabajo o estados de componentes, o para reproducir voz, audio, vídeo o Lottie.

Establezca Voz como el desencadenador e introduzca el comando de voz. Como tipo de acción, elija Transición, Animación automática, Superponer, Desplazarse a, Mesa de trabajo anterior, Reproducción de audioReproducción de voz, Reproducción de vídeo Reproducción de Lottie. Por ejemplo, si va a integrar una búsqueda por voz en una aplicación móvil, puede usar Voz y Reproducción de voz para realizar una transición entre mesas de trabajo.

Añadir un comando de voz a un prototipo

  1. Cambie a modo Prototipo.

  2. Para definir una interacción, haga clic en el conector azul del objeto de origen, el estado del componente o la mesa de trabajo. Establezca las siguientes opciones en el Inspector de propiedades:

    • Desencadenante: establecer en Voz.
    • Comando: introducir el comando de voz como texto.
    • Acción: establecer en Transición.
    • Destino: establecer la mesa de trabajo de destino o el estado del componente.
    • Animación: establecer animaciones según las opciones disponibles.
    • Suavizado: establecer el suavizado según las opciones disponibles.
    • Duración: establecer la duración en segundos.
    Establecer desencadenadores por voz
    Establecer desencadenadores por voz para mesas de trabajo

    A. Establecer los desencadenadores en forma de voz B. Introducir comandos de voz como texto 

    Establecer desencadenadores de voz para estados del componente
    Establecer desencadenadores de voz para estados del componente

    A. Establecer los desencadenadores en forma de voz B. Introducir comandos de voz como texto C. Establecer Destino en un estado del componente 

  3. Para definir más de una interacción para un objeto, estado del componente o mesa de trabajo:

    1. Selecciónelo y haga en + en ella. Como alternativa, haga clic en + en el Inspector de propiedades.
    2. Establezca las propiedades en el Inspector de propiedades.

     Puede aplicar los desencadenadores Pulsar, Arrastrar, Pasar el ratón, y Hora solo una vez y VozTeclas y mando de juego muchas veces. 

    2
    Usar múltiples desencadenadores para definir más interacciones

  4. Para ver los cambios actualizados, seleccione el botón Vista previa de escritorio .

  5. Para obtener una vista previa de la transición a la siguiente mesa de trabajo o estado del componente, mantenga presionada la barra espaciadora y repita el comando de voz.

Añadir una reproducción a un prototipo

Añadir una reproducción de audio

Use la acción Reproducción de audio para añadir efectos de sonido a sus prototipos. Por ejemplo, una confirmación de audio después de la entrega correcta de un correo electrónico. Puede importar un audio como MP3 o archivo WAV.

Para añadir reproducción de audio en un objeto o mesa de trabajo, realice los siguientes pasos:

  1. En el modo Prototipo, seleccione el objeto o la mesa de trabajo.

  2. En el Inspector de propiedades, establezca las siguientes opciones:

    • Haga clic en + para añadir la interacción. 
    • Desencadenante: establézcalo en Pulsar.
    • Acción: se establece en Reproducción de audio, y luego se busca y se añade el archivo de audio. 

     La reproducción automática de audio funciona en Safari solo si ha habilitado la reproducción automática en la configuración de Safari. Para habilitar la reproducción automática para vínculos a prototipos XD, consulte Habilitar la reproducción automática de sonido en Safari.

Añadir varias acciones en un solo desencadenador

Puede añadir una acción sin transición, como una Reproducción de audio con una acción de transición primaria, como Transición o Animación automática. Por ejemplo, al hacer clic con el ratón se emite un sonido al pasar de una mesa de trabajo a otra.

Para añadir múltiples acciones a su prototipo, realice los siguientes pasos:

  1. En el modo Prototipo, seleccione el objeto o la mesa de trabajo en la que desea añadir varias acciones. 

  2. En el Inspector de propiedades, establezca las siguientes opciones:

    • Haga clic en + para añadir la interacción. 
    • Desencadenante: establézcalo en Pulsar.
    • Establezca el botón de la primera Acción + (acción de transición) en Transición, Animación automática, Superposición, Desplazarse a o Mesa de trabajo anterior
    • Elija el botón de la segunda Acción + (acción sin transición) en Reproducción de audio o Reproducción de voz
    acciones múltiples
    Establecer múltiples acciones para un objeto o una mesa de trabajo

     El botón de la segunda Acción + en el Inspector de propiedades está habilitado solo cuando elige Tocar como el desencadenador. Además, si elige una acción sin transición, como Reproducción de audio o Reproducción de voz como primera acción, el botón de la segunda Acción + no estará habilitado.

Añadir una reproducción de voz

Para añadir reproducción de voz en un objeto o en una mesa de trabajo, realice los siguientes pasos:

  1. Arrastre un cable desde la mesa de trabajo de origen hasta la mesa de trabajo de destino.

  2. Para añadir una reproducción de voz, en el Inspector de propiedades, establezca las siguientes opciones:

    • Desencadenante: establézcalo en Tiempo.
    • Retardo: establezca el retardo de tiempo (en segundos) para definir cuándo se debe iniciar la reproducción de voz. 
    • Acción: establézcala en Reproducción de voz.
    • Voz: elija una voz para la reproducción de voz.
    • Voz: escriba el texto que desea reproducir con voz.
    Usar reproducción de voz
    Usar reproducción de voz

    A. Establecer el desencadenador en Tiempo B. Establecer el tiempo de espera en segundos C. Establecer la acción en Reproducción de voz D. Establecer voz  E. Escribir el texto para la reproducción de voz 

  3. Para obtener una vista previa de los cambios, haga clic en el botón Vista previa de escritorio.

  4. Para obtener una vista previa de la transición de la reproducción de voz a la siguiente mesa de trabajo, mantenga pulsada la barra espaciadora y repita el comando de voz. 

    Vista previa de la reproducción de voz
    Vista previa de la reproducción de voz

Añadir una narración de voz a un prototipo

  1. En modo Prototipo, seleccione la Pantalla Inicio donde se haya establecido el inicio del flujo y haga clic en el botón Vista previa de escritorio.

  2. Seleccione la flecha desplegable próxima al botón de grabación y elija la opción Habilitar micrófono (macOS). Si está en Windows, habilite el micrófono a través de un control de nivel de sistema operativo en Gamecenter. Al grabar, observe el icono rojo que parpadea en la interfaz.

  3. Guarde la grabación como archivo MP4 y compártala con los interesados o publíquela en las redes sociales. 

     Esto no captura directamente la salida de audio de XD, como la reproducción de voz. El micrófono escucha o graba la salida en función de la configuración del usuario (el micrófono del sistema escucharía a los altavoces del sistema reproducir la reproducción de la voz).

Compartir y revisar el vínculo de prototipo o especificaciones de diseño en la Web

  1. En la aplicación de escritorio, haga clic en el icono Compartir de la parte superior derecha y elija Compartir para revisión (para prototipos) o Compartir para desarrollo (para especificaciones de diseño).

  2. Al obtener una vista previa de un prototipo, puede hacerlo de la manera siguiente:

    • Escritorio o portátil: mantenga pulsada la barra espaciadora.
    • Aplicación móvil Adobe XD (iOS/Android): utilice un gesto de pulsación larga en cualquier lugar de la pantalla. Coloque el dedo en la pantalla (sin moverlo) y use el comando de voz antes de volver a levantar el dedo.
    • Navegador móvil en un smartphone: mantenga presionado el icono del micrófono en la esquina inferior derecha de la pantalla.
  3. Al obtener una vista previa de especificaciones de diseño, los desarrolladores pueden leer o ver los comandos de voz y la reproducción de voz como texto. 

     Las especificaciones de diseño no admiten interacciones de voz.

Habilitar la reproducción automática de sonido en Safari

De forma predeterminada, la reproducción automática de sonido está deshabilitada en Safari. Para habilitar la reproducción automática de sonido en vínculos a prototipos XD, siga los pasos que se indican a continuación:

  1. Abra un vínculo al prototipo XD en Safari.
  2. En la barra de menú de macOS, vaya hasta Safari > Preferencias.
  3. En la pestaña Sitios web , seleccione Reproducción automática en el panel izquierdo.
  4. En la ventana Permitir que los siguientes sitios web reproduzcan medios automáticamente, elija Permitir la reproducción automática de todo junto a xd.adobe.com

Esta configuración garantiza que el sonido en los vínculos al prototipo XD funcione automáticamente en el futuro.

Habilitar la reproducción automática de medios en Safari
Habilitar la reproducción automática de medios en Safari

Habilitar sonido en Chrome

Al ejecutar un prototipo en Chrome, si recibe un error de que se produjo un problema con la acción de reproducción, habilite el sonido en la configuración de Chrome.

Siga los pasos que se indican a continuación para habilitar el sonido en vínculos a prototipos XD en la configuración de Chrome:

  1. En la barra de direcciones de Chrome, escriba chrome://settings/content/sound. Pulse Intro.
  2. En la sección Comportamientos personalizados, haga clic en Agregar al lado de Permitido reproducir sonido y agregue https://xd.adobe.com.

Esta configuración asegura que el audio se reproduce en los enlaces prototipo de XD en el futuro.

Habilitar el sonido para los vínculos al prototipo XD en la configuración de Chrome
Habilitar el sonido para los vínculos al prototipo XD en la configuración de Chrome

Solucionar los problemas de interacción de voz utilizando notificaciones

Ya es posible solucionar problemas de las interacciones desencadenadas por voz durante las vistas previas de prototipo en escritorio o la Web. Los interesados que revisan las especificaciones de diseño también pueden usar esta función para conocer mejor cómo interactuar con su prototipo en Adobe XD.

Antes de hablar al prototipo durante la vista previa, asegúrese de que esté marcada la opción de menú Mostrar notificaciones. De forma predeterminada, esta opción del menú está en estado marcado al iniciar Adobe XD.

Mostrar notificaciones
Mostar notificaciones de prototipos de voz

Cada comando que diga a XD se compara frente a todos los desencadenadores de voz presentes en la mesa de trabajo o estado del componente actuales. Si no se encuentra ninguna coincidencia, recibirá una notificación indicando No se han encontrado coincidencias para: {el comando que haya pronunciado}. El ver qué es lo que ha escuchado XD ayuda a determinar por qué no se produce una coincidencia cada vez que hable.

Puede haber diferentes razones por las que no se puede encontrar una coincidencia. Quizás el comando de voz pronunciado no se esté utilizando en ninguna interacción de esa mesa de trabajo o estado del componente. O tal vez el servicio de voz a texto está devolviendo un resultado inesperado.

Por ejemplo, puede haber decidido agregar la frase dos dólares como comando de voz en una interacción. Sin embargo, al pronunciarla, el servicio de voz a texto puede devolver un resultado de $2,00. Al sustituirse las palabras por números en la notificación, ahora sabrá que debe cambiar la interacción para usar números en lugar de palabras.

Logotipo de Adobe

Inicia sesión en tu cuenta