Adobe XD Prototype master components

[johnw6761]

I am wondering if you can you prototype master components so the same interactions are added to every instance of that element across all artboards. I am working on a website global nav and dont want to repeat the same actions for every single artboard that the nav appearas on.

[Atul_Saini]

Hi Johnw6761,

Thanks for using Adobe XD, here is what you may try, create a navigation bar with all the links and navigation. Make it a master component. Then, go to prototype mode and copy it to all the artboards as shown in the screenshot below.

I hope it works for you. Please update this discussion in case you need further assistance.

Thanks,

Atul_Saini

[Peter Villevoye]

I also tried some test with the new Components, but I noticed that when I copied the component consisting of the linked menu buttons from one screen to another screen, the button with its link to its own screen would automatically lose its link within that instance of the component. Copying this altered instance again, would not restore the link, so you're copying a crippled component...

You need to create the original for the component off any referred screen, and copy this original instance to the other screens !

[Peter Villevoye]

And apart from my test above, creating and spreading the components before linking the buttons, and linking the component afterwards, doesn't work. The added links in the original instance are not trickling through in other instances of the components on their screens...

[LHeathMcWork]

I've tried this as well. I really need to be able to add links to a master component and have them be retained with instances. Really have links behave similar to other component attributes where they persist unless overridden.

[Sjaani]

As mentioned above you can create a master links group and paste it with active links in the Prototype step rather than creating and putting in place in the design step.
One of the current drawbacks in XD is that you can't link to the same page that you have the object on.
So even though copying and pasting within the Prototype area does maintain links it doesn't keep them for the current page.

In order to produce the result you're after with complete accuracy you would need two copies of each page so that you could always give the appearance that a menu button linked back to itself.

I think the most practical is shown in both the above examples, create the master nav off the artboards, create the links then in Prototype mode alt drag into position.

[Highside1340]

Hi - is there a  requirement to improve this in the public backlog (so I can go vote for it)? Really surprised and disappointed in the function and required work around. Thanks.

[gurs2die4]

I have also struggled with keeping the nagivation/links consistent when re-using master components.  As suggested above, I first created the master component on the canvas (not on any artboard) in Design mode and then assigned links in Prototype mode.  Then I added that master component to individual artboards by Alt-dragging the master to the desired artboard.  If you try to add the component to an artboard by dragging that component over from the Components pane, the navigation settings are lost.  But if you Alt-drag, navigation settings are maintained.  This does not solve XD's inability to link to the same artboard on which a component is located, so self-linked artboards are lost on that particular artboard, but are still present on other artboards.

[tylery28]

Agreed! This is an absolute necessity for working with any type of app/site navigation. Copying and pasted (suggested) becomes miserable when you have 10+ artboards using this the same component.

[defaultivzx422mmicr]

Has there been any update on this? I started using Adobe XD for my website prototype, but the absence of possibility to just have a master navigation bar, which can appear on every page just like an InDesign master page, is just a real massive issue! Making a real website may save me more time than prototyping it with XD at this point...