Versiones de agosto de 2018, septiembre de 2018 y octubre de 2018 de Adobe XD
xd-mnemonic

Adobe XD es una herramienta basada en vectores para el diseño y la creación de prototipos de experiencias de usuarios para aplicaciones móviles y web. Cambie fácilmente entre mallas metálicas, diseño visual, diseño de interacción, creación de prototipos, vista previa y uso compartido, todo en una potente herramienta.

XD está hecho para todo tipo de creadores: diseñadores de UX/UI, diseñadores de interacción, diseñadores de experiencias, diseñadores de productos, diseñadores web, diseñadores de aplicaciones, diseñadores visuales, emprendedores y mucho más.


Nuevas funciones de Adobe XD 14

Colaboración mejorada con documentos nativos en la nube

Cloud-Doc

Adobe XD introduce los documentos en la nube, un nuevo tipo de documento nativo en la nube que ofrece un método rápido y conveniente de administrar, compartir y retener documentos actualizados entre varios dispositivos. 

Puede guardar los diseños XD como documentos en la nube, para asegurarse de que estén actualizados y sean accesibles incluso sin conexión. A continuación, puede compartirlos con otros usuarios de Creative Cloud e invitarles a colaborar. Una vez que vuelva a disponer de conexión, su trabajo se guardará automáticamente en la nube.

Los documentos en la nube también admiten activos entre documentos y permiten vincular símbolos desde un documento en la nube.

Para obtener más información sobre el trabajo con documentos en la nube, eche un vistazo a este vídeo.


La introducción de los documentos en la nube también afecta a la forma de guardar documentos en XD para móviles y de acceder a ellos. Para obtener más información, consulte Trabajar con documentos en la nube en móviles, Documentos en la nube en XD y Gestión de documentos en la nube.

Para obtener más información sobre la experiencia móvil al trabajar con documentos en la nube, eche un vistazo a este vídeo.


Diseños más rápidos y precisos, con el volteo de objetos

XD introduce la opción de voltear objetos vertical u horizontalmente. El volteo funciona en todos los elementos básicos, excepto en las mesas de trabajo, las cuadrículas de repetición y los símbolos, y tiene en cuenta el giro actual del objeto al aplicarse.

Para obtener más información, consulte Voltear objetos.

Voltear objetos
Voltear objetos

Mejoras de productividad con la búsqueda en el panel de capas

Puede usar Buscar y Filtrar en el panel de capas para buscar por nombres de capa o filtrar capas por texto, formas y categorías de imágenes. La experiencia de búsqueda está optimizada para mostrar solo las capas y mesas de trabajo relevantes que contengan la palabra clave, sin la estructura de capas (por ejemplo, grupos expandidos). Esto puede ser útil en la animación automática de capas entre mesas de trabajo.

Para obtener más información, consulte Trabajar con capas.

Buscar en el panel Capas
Buscar en el panel Capas

Vista previa de símbolos vinculados en el lienzo

Pase el cursor sobre el icono de actualización de símbolos vinculados del panel Activos para ver previamente las actualizaciones de símbolos vinculados en el lienzo antes de confirmarlas.

Obtener una vista previa de actualizaciones de símbolos vinculados
Obtener una vista previa de actualizaciones de símbolos vinculados

Cambios en la UI relativos a la compartición de flujos de trabajo

14_0-release-share
Antigua nomenclatura Nueva nomenclatura Flujos de trabajo.
ND Compartir documento Comparta documentos en la nube para revisarlos.
Publicar prototipo Compartir para revisión Publique y comparta documentos en la nube para revisarlos.
Publicar especificaciones de diseño Compartir para desarrollo Publique y comparta especificaciones de diseño con los desarrolladores para revisarlas.
Administrar vínculos publicados Administrar vínculos Administre los vínculos desde assets.adobe.com.
Grabar vídeo Grabar vídeo Grabe un vídeo de interacciones entre mesas de trabajo al trabajar con animación automática. Si hay algún prototipo interactivo, todas las interacciones se registran como un archivo.mp4.

Fidelidad visual mejorada con capas retenidas desde Adobe Illustrator

Con la copia y el pegado mejorados desde Adobe Illustrator a XD, la fidelidad visual de las capas, su estructura y sus efectos se mantienen tal y como fueron diseñados en Adobe Illustrator. Este flujo de trabajo ya es semejante a la importación desde Illustrator.

Integración mejorada con Photoshop, Illustrator y After Effects

Usa la nueva opción Archivo > Importar para agregar contenido de Photoshop o Illustrator a documentos de XD existentes al convertir contenidos de Photoshop o Illustrator. Al convertir objetos inteligentes, permanecen totalmente editables (en lugar de fundirse) y conservan las capas de ajuste de Photoshop.

Para obtener más información, consulte Trabajar con activos externos.

Visualización de prototipos en dispositivos móviles

Se han agregado varias mejoras a la visualización de prototipos en navegadores web móviles, incluyendo un modo predeterminado de pantalla completa, pellizcar para hacer aparecer flechas de navegación, el botón de inicio, información de prototipos e informar de anomalías. Para obtener más información, consulte Vista previa en dispositivos móviles.

Para obtener más información sobre la experiencia mejorada en móviles, eche un vistazo a este vídeo.


Exportación SVG mejorada

Al exportar elementos .svg desde XD o desde especificaciones de diseño, ahora puede exportar con Atributos de presentación, que mejora el estilo y la compatibilidad para escenarios de desarrollo comunes, como los SVG exportados desde XD en Android Studio.

Para obtener más información, consulte Trabajar con activos externos.

Compatibilidad mejorada con Wacom y función táctil

Adobe XD ya admite la rotación con dos dedos de los objetos seleccionados en la pantalla táctil de dispositivos con Windows, almohadillas táctiles de Mac, tabletas Wacom, paneles táctiles y anillos táctiles.

Posibilidad de comentarios web mejorados en la UI

Al abrir un prototipo web o una especificación de diseño, puede verse un marcador gris con el recuento de comentarios sobre el icono de comentario de la barra derecha. El recuento representa el número total de conversaciones de comentarios sin resolver en una mesa de trabajo. El recuento de comentarios se actualiza automáticamente al agregar un nuevo comentario o marcar un comentario existente como resuelto.

Posibilidad de comentarios web en la UI
Posibilidad de comentarios web en la UI

Nuevas funciones de Adobe XD 13

Diseño y creación de prototipos mediante comandos de voz y reproducción de voz

Comandos de voz y reproducción de voz
Comandos de voz y reproducción de voz

Adobe XD proporciona una solución fácil de usar que permite usar comandos de voz para desencadenar una interacción entre mesas de trabajo. Al igual que cuando se usa un Clic o una Pulsación como Desencadenador, puede usarse la Voz para desencadenar una interacción de prototipo y una Reproducción de voz como acción desencadenada. La reproducción de voz le ofrece acceso a un potente motor de conversión de texto a voz que ayuda a diseñar nuevas plataformas, como asistentes de voz y altavoces inteligentes. Para obtener más información, consulte Diseño de voz y creación de prototipos.

Para obtener más información sobre el uso de comandos de voz y reproducción de voz, eche un vistazo a este vídeo.


Creación y reproducción con animación automática y gestos de arrastre

Auto-aminamte--1(source)
Animación automática en el trabajo

Animación automática permite crear prototipos fácilmente, con transiciones animadas inmersivas. Simplemente, duplique mesas de trabajo, modifique las propiedades de los objetos, como el tamaño, la posición y la rotación, y aplique una acción de animación automática para crear una transición animada entre mesas de trabajo. Para utilizar Animación automática, asegúrese de que los objetos que desea animar tengan el mismo nombre de capa entre dos mesas de trabajo. Para obtener más información, consulte Crear prototipos utilizando la animación automática.

El gesto de arrastre en XD lleva la función Animación automática un paso adelante, al permitirle simular la experiencia de arrastre de dispositivos habilitados para función táctil. Para obtener más información, consulte Gestos de arrastre en el trabajo.

Para obtener más información sobre Animación automática, eche un vistazo a este vídeo.


Uso compartido de activos entre documentos con símbolos vinculados

Linked-Symbol-Concept

A medida que los equipos de diseño crecen dentro de las organizaciones, junto con las superficies de diseño cada vez mayores, los diseñadores deben colaborar para crear diseños coherentes y escalables. Con los símbolos vinculados, los diseñadores pueden compartir símbolos entre documentos y asegurarse de que estén siempre actualizados.

Los símbolos vinculados permiten crear y mantener una fuente única de referencia para los kits de UI, hojas de calcomanías o guías de estilo, y utilizarlos en otros documentos de Adobe XD. Al modificar un símbolo vinculado en el documento de origen, XD advierte de los documentos con instancias de dicho símbolo vinculado con esas actualizaciones. Desde allí, puede obtenerse una vista previa de los cambios y elegir aceptarlos o rechazarlos. Para obtener más información, consulte Trabajar con símbolos vinculados.

Para obtener más información sobre símbolos vinculados, eche un vistazo a este vídeo.


Diseño de innovación de herramientas a través de complementos

Plugins-updated

Adobe XD lanza la primera ola de complementos que ayudan a automatizar tareas, integrarse con otras herramientas, aprovechar los datos en los diseños y mucho más. Esto también incluye integraciones con algunas de las mejores aplicaciones de colaboración y productividad del mercado, incluyendo Slack, JIRA y Microsoft Teams.

Para obtener información sobre cómo iniciarse con los complementos, consulte Complementos para XD.

Transferencia perfecta de activos con Illustrator y After Effects

Importar desde Illustrator
Importar desde Illustrator

Desde Adobe XD 13.0, puede transferir diseños de disposiciones y activos desde Illustrator abriendo archivos .ai desde dentro de Adobe XD. El nuevo flujo de trabajo, rápido y adecuado, ayuda a transferir sin problemas activos con correspondencia nativa de capas, mesas de trabajo, ilustraciones y vectores con la mayor fidelidad visual, y a optimizar los entornos de colaboración en diferentes etapas del proceso de UX. Para obtener más información, consulte Abrir archivos de Illustrator en XD.

Ventajas de las funciones:

  • Uso sin problemas de activos de Illustrator en prototipos: transfiera iconos, logotipos y otros activos vectoriales a XD y use kits de UI o bibliotecas completas creadas en Illustrator, manteniendo las capas, con completa capacidad de edición y fidelidad visual.
  • Colaborar para crear diseños interactivos: abra archivos de Illustrator en XD y use las sofisticadas funciones de colaboración y creación de prototipos de XD.

Para obtener más información sobre la integración con Illustrator, eche un vistazo a este vídeo.


Animar con After Effects
Animar con After Effects

Con Adobe XD 13.0, puede exportar fácilmente diseños XD (capas seleccionadas o mesas de trabajo completas) a After Effects para crear animaciones y microinteracciones de UI. Puede exportar capas, mesas de trabajo, ilustraciones y vectores a la perfección con idéntica fidelidad visual y usar el potente ecosistema de complementos de After Effects para optimizar su colaboración con los desarrolladores. Para obtener más información, consulte Exportar activos a After Effects..

Ventajas de las funciones:

  • Obtener control total de las animaciones: los diseñadores pueden usar After Effects para crear animaciones y microinteracciones personalizadas, ajustar las transiciones o usar activos de vídeo activos en los diseños.
  • Transferencia perfecta de activos: con esta integración, puede disfrutar de una rápida transferencia de activos y concordancia nativa de capas, vectores e ilustraciones, consiguiendo un pase más rápido del diseño a las animaciones personalizadas.
  • Aprovechar complementos: puede ampliar las animaciones y la colaboración con los desarrolladores utilizando el ecosistema de complementos de After Effects adaptado al proceso de diseño de UX.

Vista previa del dispositivo Win10 en vivo en iOS

Mobile-Preview

A partir de XD 13.0, los diseñadores con SO Windows pueden usar una conexión USB para obtener una vista previa de sus diseños en iOS. Para obtener más información, consulte Vista previa en dispositivos móviles.

Nuevas funciones de Adobe XD 12

 La versión de septiembre de 2018 de XD dispone de nuevas funciones interesantes:

Entre las mejoras se encuentran las siguientes:

Siga leyendo para saber más.

Redimensionado interactivo y restricciones

Al diseñar hoy en día para un entorno de dispositivos múltiples, es importante tener en cuenta la gran variedad de tamaños de pantalla disponibles en las resoluciones de móviles, tabletas y escritorios. Dado que no todos los diseñadores utilizan dispositivos similares, es necesario considerar cómo funciona el contenido en múltiples tamaños de pantalla. 

Para resolver este problema de los usuarios, Adobe XD ha desarrollado una función denominada redimensionado interactivo que permite cambiar el tamaño de los objetos manteniendo simultáneamente las relaciones espaciales en diferentes tamaños, para adaptarse mejor a múltiples tamaños de pantalla. Para obtener más información sobre el redimensionado interactivo y las restricciones, consulte Redimensionado interactivo.

Para obtener más información sobre el redimensionado interactivo, eche un vistazo a este vídeo.


Redimensionado interactivo
Resultado del redimensionado interactivo
Configuración de restricciones en grupo de objetos
Configuración de restricciones en grupo de objetos

Transiciones temporizadas

Las transiciones temporizadas aplican una combinación de Retraso y duración como un nuevo tipo de Desencadenador temporal para realizar la transición entre mesas de trabajo y crear flujos o bucles de incorporación rápidos.

Con la adición de Tiempo, ya puede realizar la transición entre mesas de trabajo en función de un retardo de tiempo específico. Esto es útil para la incorporación de prototipos o flujos de decisión.

Al crear una transición entre dos mesas de trabajo en modo Prototipo, ahora puede seleccionar Tiempo en lugar de Pulsación, definir la duración del retardo y la transición que desea utilizar. A continuación, XD guarda los atributos de la misma pantalla y los ofrece como predeterminados para más pantallas. Para obtener más información sobre transiciones temporizadas, consulte Utilizar transiciones temporizadas.

Para obtener más información sobre transiciones temporizadas, eche un vistazo a este vídeo.


Establecer transiciones temporizadas
Establecer transiciones temporizadas

A. Establecer el desencadenador en Tiempo B. Establecer el retardo en Segundos C. Establecer la acción en Transición D. Establecer la duración en Segundos 

Corrector ortográfico integrado

Adobe XD introduce una función de corrección ortográfica integrada que ofrece la corrección ortográfica en tiempo real directamente en los lienzos de diseño. Esta función se basa en el lenguaje a nivel de SO para sugerir correcciones. También tiene la posibilidad de agregar nuevas palabras al diccionario.

Tradicionalmente, los usuarios tenían que copiar o pegar su contenido en una aplicación separada para comprobar la ortografía y los errores tipográficos. 

A partir de esta versión, puede ejecutar la revisión ortográfica en el texto seleccionado, viendo y corrigiendo los errores ortográficos.

Nota:

Antes de iniciar la revisión ortográfica, asegúrese de haber habilitado la función de revisión ortográfica en el menú Editar.

Revisión ortográfica
Revisión ortográfica

Para obtener más información sobre la revisión ortográfica, consulte Usar el corrector ortográfico.

Mejoras en la visualización a pantalla completa de prototipos web

Adobe XD presenta un comportamiento mejorado en el modo de pantalla completa, que ofrece una experiencia de usuario mejorada al ver diseños en el navegador.

Las mesas de trabajo web y personalizadas se muestran ahora desde la parte superior del navegador sin problemas de rellenos negros. Sin embargo, las mesas de trabajo móviles siguen centradas en la pantalla en modo de pantalla completa.

Estas mejoras proporcionan una experiencia más realista al ver en el navegador una mesa de trabajo de tamaño web.

Para obtener más información sobre las mejoras de visualización en pantalla completa de los prototipos web, eche un vistazo a este vídeo.


Full-screen-(Before)
Comportamiento anterior
Escalado mejorado en el modo de pantalla completa para prototipos web
Comportamiento mejorado

Esto imita el comportamiento real de los navegadores, ya que el color de fondo de estos es siempre blanco y no agregan un color de fondo de manera predeterminada.

Mejoras en la vista estándar y en pantalla completa:

  • Si la anchura de la mesa de trabajo es mayor que el espacio horizontal disponible, el prototipo se escala para ajustarse, sin desplazamiento horizontal.
  • Si ha definido la altura de la ventana gráfica (establecida en el Inspector de propiedades), el prototipo se ajusta primero a la altura y escala proporcionalmente la anchura para mantener la relación de aspecto. También puede desplazarse verticalmente para ver contenido que se encuentre por debajo de la altura de la ventana gráfica.
  • Si el prototipo diseñado es una web o una mesa de trabajo personalizada, el vínculo publicado en el navegador web en modo de pantalla completa representa el contenido desde la parte superior de la ventana del navegador. Los diseños en móviles y tabletas siguen estando alineados con el centro de la pantalla.
  • El color de fondo en modo de pantalla completa es blanco en lugar de negro. Esto imita el auténtico comportamiento del navegador, ya que los navegadores no agregan un color de fondo negro de manera predeterminada.

Mejoras en la vista de las mesas de trabajo en móviles:

  • El contenido se ajusta adecuadamente a la anchura, para mantener la relación de aspecto.
  • Si ve el vínculo publicado en modo de pantalla completa en un navegador web, el contenido se representa en el centro de la ventana del navegador. 

Nuevas funciones de Adobe XD 11

La versión de agosto de 2018 de XD dispone de nuevas funciones interesantes:

Entre las mejoras se encuentran las siguientes:

Siga leyendo para saber más.

Extraer activos para especificaciones de diseño

A partir de XD 11.0, puede incluir capas marcadas para exportación por lotes como activos en las especificaciones de diseño, y los desarrolladores pueden descargar todas estas capas marcadas desde el vínculo de especificaciones de diseño.

Los desarrolladores pueden entonces optar por descargar los activos vectoriales como activos SVG, PNG y PDF, y los activos de mapas de bits como PNG y PDF.

Exportar activos
Exportar por lotes
Exportar por lotes

Para obtener más información, consulte Extraer activos para especificaciones de diseño.

Reordenar activos en el panel Activos

Con esta versión de Adobe XD, puede organizar y reordenar sus activos arrastrando uno o varios activos por el panel Activos.

Reordenar activos
Reordenar activos

Para obtener más información, consulte Reordenar elementos en el panel Activos.

Invitaciones privadas en la Web

Adobe XD le permite compartir invitaciones seguras solo por nombre (vínculos públicos y privados) para especificaciones de diseño y prototipos desde la interfaz web. Cuando un diseñador publica una invitación segura por nombre, el diseñador puede usar la opción Invitar para invitar a más revisores internos y externos.

Enviar invitaciones privadas a usuarios desde el navegador
Enviar invitaciones privadas a usuarios desde el navegador

Nota:

La opción Invitar es visible solo para el diseñador que posee el documento y los interesados invitados no pueden invitar a otros a menos que el diseñador lo permita.

Para obtener más información, consulte Uso de invitaciones privadas en la Web.

Soporte de mención por @ de comentarios

Puede usar la mención por @ para ver los nombres de los usuarios invitados a acceder a una invitación de diseño privada. En el caso de prototipos públicos y especificaciones de diseño, solo los usuarios que hayan comentado al menos una vez aparecen en la lista de revisores. El revisor mencionado por @ con el nombre recibirá un correo electrónico o una notificación de la aplicación de escritorio de Creative Cloud. Al hacer clic en la notificación, se le dirigirá a la mesa de trabajo referenciada.

Mención por @
Mención por @

Para obtener más información, consulte Flujo de trabajo de revisor.

Soporte de especificaciones de diseño para tipos de trazo

A partir de XD 11.0, los usuarios pueden seleccionar cualquier objeto en las especificaciones de diseño compartidas y hacer clic en sus bordes para mostrar los trazos utilizados en la pantalla. 

Tipos de trazo
A. Tipos de trazo 

Para obtener más información, consulte Inspeccionar especificaciones de diseño.

Esta obra está autorizada con arreglo a la licencia de Reconocimiento-NoComercial-CompartirIgual 3.0 Unported de Creative Commons.  Los términos de Creative Commons no cubren las publicaciones en Twitter™ y Facebook.

Avisos legales   |   Política de privacidad en línea