Links

In Adobe XD, each artboard represents a webpage that can be connected to each other or other external websites via Links.

Anima supports the following Adobe XD native Prototype Interaction features:

• Trigger - Tap
• Action - Transition, Overlay, Previous Artboard, Auto-Animate

Anima also includes:

• External Links - A link to an external website
• Scroll To Links - A type of link that directs the user to a specific section of the same artboard (webpage).

Adobe XD Links

To connect artboards in the same Adobe XD document, use the Tap action and Transition type:

❗️* IMPORTANT

• Only Tap triggers and Transition, Overlays, Previous Arboard actions types are supported
• Animation, Easing, and Duration settings are not currently supported

External Links

Many times you want to create links to external websites that aren’t a part of your website, for example, links to Facebook, Twitter, App Stores, etc..

To create an External Link:

1. Select the layer which will trigger the navigation event (i.e.: a social media icon or email address).
2. Click Link in the Flow section
3. Select External Link from the Link Type drop-down menu
4. Enter the full URL for the external website or enter ‘mailto: info@example.com’ to link to an email address

Overlays

An Overlay is a link type that lets you display another artboard on top of the existing one rather than as a separate destination screen.

When you create a Tap trigger Overlay using Adobe XD, it automatically populates as an Anima Overlay.

1. Make the overlay artboard the same width as the artboard it will go over
2. If you want its background to be transparent or see-through, change the overlay artboard’s background’s opacity accordingly
3. Placement of the overlay component is adjusted on its artboard

❗️*IMPORTANT

• Only Transition and Overlays triggers are supported
• Animation, Easing, and Duration settings are not currently supported

Scroll To Links

You can create Links to a different section in the same artboard (webpage).

To create an Scroll To Link:

1. Select the layer which will trigger the navigation event*
2. Click Link in the Flow section
3. Select Scroll To Link from the Link Type drop-down menu
4. With your mouse, select the layer that the link will scroll to
5. Click Done to apply it

❗️IMPORTANT

• Scroll To links can only be created on the same artboard.

Edit or Remove Links

If you created an Anima Link and now you want to remove it:

1. Select the Layer with the link you want to remove
2. Click the Trash Icon in the Link section

Adobe XD Triggers and actions can be edited or deleted in Prototype mode.