Prototyping multi-screen application


At this moment I am working on a design with multiple screens with a shared menu for navigation. When prototyping, I would like to do navigation between boards so the menu is working like a real menu.

I know I can drag between them, but this is not very easy / efficient for screens not close to each other. When I open the destination list there is a huge list of boards (nested items). Is there a way to filter the list of destinations, by example only showing the root-level boards?

Another question, is it possible to use a shared menu component where I can configure the interaction to all boards and all screens will use the shared component? I did use a component, but interactions doesn’t seem to share between instances.

HI @Qodeer, welcome to the community! I have some trouble understanding what you try to do – such things are hard to describe in text, maybe it works better with a few screenshots?

1 Like

Hi @jdittrich,

I removed some content of the design to simplify it, so I hope the screenshots help to explain it.

So I have multiple pages with the same base layout; sidebar with a menu and a topbar with some basic information. The sidebar is a component which is reused at every page. Now I have to add interaction on every instance of the sidebar. Is it possible to configure it once on the main component (so on page 1 - 8 all page 1 buttons go to page 1, page 2 to page 2 etc.)?

I have named all my page components pages/, but if I search in the list there are a lot of items in it, (see the scroll length) making it harder to find the board I need. Even all atoms are showing up in the list. Is there a way to include/exclude specific items from this list, so this will be much shorter and easier to find items?