Guía del usuario Cancelar

Crear prototipos utilizando comandos de voz y reproducción

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.

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

¿Nuevo usuario?