Cambie a modo Prototipo. Seleccione el objeto de la mesa de trabajo al que desea agregar un vínculo de anclaje.
Última actualización el
10 feb. 2023
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.
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: Seleccionar 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 tu mesa de trabajo, selecciona .
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.
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.
Diseñar prototipos de experiencia de usuario con Adobe XD
Crea bocetos interactivos para sitios web y aplicaciones móviles.
