Guía del usuario Cancelar

Crear vínculos de anclaje en Adobe XD

Buscar

Última actualización el 21 feb. 2023

Guía del usuario de Adobe XD
Introducción
Diseño
1. Mesas de trabajo, guías y capas
2. Formas, objetos y trazados
3. Texto y fuentes
  1. Trabajar con herramientas de dibujo y texto
  2. Fuentes en Adobe XD
4. Componentes y estados
5. Máscaras y efectos
6. Maquetación
7. Vídeos y animaciones de Lottie
Prototipo
Compartir, exportar y revisar
Sistemas de diseño
Documentos en la nube
Integraciones y complementos
XD para iOS y Android
1. Vista previa en dispositivos móviles
2. Preguntas frecuentes de Adobe XD para dispositivos móviles
Solución de problemas
1. Problemas conocidos y resueltos
  1. Problemas conocidos
  2. Problemas resueltos
2. Instalación y actualizaciones
3. Inicio y cierre inesperado
4. Documentos en la nube y bibliotecas Creative Cloud
5. Crear prototipos, publicar y revisar
6. Importar, exportar y usar otras aplicaciones

Aprenda a crear vínculos de anclaje para mejorar la experiencia de navegación en una mesa de trabajo.

Adobe XD le permite crear vínculos de anclaje durante la creación de prototipos y le ayuda a desplazarse a secciones específicas en una mesa de trabajo. Utilice vínculos de anclaje para una navegación más rápida y una mejora de uso al diseñar un formulario de página larga o un artículo de texto largo.

¿Desea simular su experiencia de desplazamiento navegando rápidamente a secciones específicas en una mesa de trabajo? Siga estos pasos para comenzar.

Cambie a modo Prototipo. Seleccione el objeto de la mesa de trabajo al que desea agregar un vínculo de anclaje.
Arrastre el cable de creación de prototipos hacia abajo de la mesa de trabajo hasta llegar al punto en el que desea establecer el vínculo.
Haga clic en el cable de creación de prototipos para ver el Panel de interacción que aparece en Inspector de propiedades con las siguientes opciones:
- Desencadenador: establézcalo en Pulsar.
- Tipo de acción: establézcalo en Desplazarse a. ¿Desea asignar varias acciones a un solo desencadenador? Lea este artículo para obtener más información.
- Destino: seleccione la capa de destino.
- Desplazamiento Y: introduzca el valor del desplazamiento Y que es relativo a la parte superior del objeto cableado. Arrastre el controlador de desplazamiento Y a la izquierda de la mesa de trabajo y observe que cambia el valor de desplazamiento Y. Cualquier valor por encima del objeto cableado es un desplazamiento negativo y por debajo es un desplazamiento positivo.
- Suavizado: seleccione una opción para simular efectos de suavizado. Por ejemplo, seleccione Suavizar salida si quiere que se suavice la salida de sus animaciones con respecto al prototipo.
- Duración: introduzca la duración. El tiempo máximo que puede establecer para la transición entre dos mesas de trabajo es de cinco segundos.
A. Seleccionar el tipo de desencadenador B. Seleccionar un tipo de acción para Desplazarse a C. Seleccionar la mesa de trabajo de destino D. Introducir el valor de desplazamiento Y E. Seleccionar los efectos de suavizado F. Introducir la duración
Para obtener una vista previa del efecto de desplazamiento en la mesa de trabajo, seleccione .

Más información

“Utilice vínculos de anclaje para crear una adorable página de aterrizaje para un libro de animales con una interacción de principio a fin”. Comenta Howard Pinksy, promotor experto en XD de Adobe.

Vea este vídeo para obtener más información.

Duración: 3 minutos

Ahora que ya sabe cómo crear vínculos de anclaje, descargue el ejemplo de kit de interfaz de usuario que contiene varios ejemplos de diseños web de una sola página y pruébelos.

Archivo de muestra

Próximos pasos

Hemos empezado a agregar vínculos de navegación en su diseño. Dé un paso adelante y aprenda a añadir varias interacciones mediante comando de voz y reproducciones a su diseño.

¿Tiene alguna pregunta o idea?

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.