Create one prototype across the pages in a file

I would love to be able to create one prototype across the pages in a file that resembles an actual website. This would be ideal for bigger projects and would be easier to maintain as well. We can connect the component libraries across all the pages anyways. A way to connect the prototype would be great in my opinion and that will give Figma a big leg up on other platforms.

What do you guys think?

305 Likes

I’ve thought about this as well, but not sure how it could be implemented elegantly. For now I just make pages for each version of a component or screen, the combine all needed components into a single page for the working prototype. When you think about it you’ve have to keep each pages prototype setting consistent for this to work and it would be a nightmare.

11 Likes

I would be fine with root level special folders. The key problem here is that the tree is too hard to navigate.

5 Likes

I sometimes wonder why isn’t it available yet? Sketch had this feature for as long as I can remember and it really helped with being organized, when it came to the point where one file (feature) was divided into multiple separate flows, each flow/page contained 20-40 app screens. Prototyping via pages worked seamlessly.

23 Likes

Just wanted to write this in Product ideas, but wanted to check if already exists. :wink: It would be a great feature to have.

9 Likes

When creating a high quality prototype I felt it was necessary to link interaction with other pages. I have a page only of components of a project and I created a multi select component with dropdown interaction, among others, I simply wanted to import only the first multi select asset to a different page and it will be already linked with the interactions made on the component page . Do it for us Figma s2

8 Likes

I have many flows that are also prototyped but in creating a usability test I often have to create a new page and duplicate/move multiple pages flows into one page and try and hook them all up for the test. This means I’m left with duplicate UI everywhere.

It would be great to simply get to the end of one flow, then add an in interaction to On-click, Navigate to then select a page which would load to the Playhead for the next prototype.

A bit like ‘object-oriented’ prototyping. Anyone else would like to do this?
I wouldn’t even be worried about the lag between the jump from one pages prototype to the next.

30 Likes

Will definitely love this feature!

5 Likes

Same here.

Lots of times there is a feature I want to leave on a separate page till Dev have the time to work on it, so I can avoid distractions on the original page (where the current state of the app is shown). This requires me to do lots of duplicates if I want to provide a working prototype on the alternative page. That sucks.

Also, sometimes the project gets so large that I consider splitting features into pages. Without this ability to prototype using multiple pages that make no sense as I would have to duplicate a lot of pages and keeping control of the “current one” would be a nightmare.

7 Likes

Hey,
I would like to have this feature too. Especially in bigger projects I use pages as sections of an application. But I can’t create a prototype which links between sections of the app. I always have to create duplicates who sit on one page, just to be able to create a full prototype. Please add prototype links across pages. It could even have a different color, so you know it’s linking to another page.

14 Likes

Badly need this feature! My projects are usually huge and having them all on one page is a total mess (especially for Development)

Right now i use the “Link to” feature with the other pages prototype link but it always opens in a new tab (confusing Testers). If we could at least have it in the same tab/prototype view when linking via URL, that would already help. But linking between pages natively would be super helpful!

19 Likes

Managing main components and being able to link them to different pages is critical for my transition to Figma. Please add this feature! For me it would also be Ok to have a dedicated “Components” page so that cross-page-linking components are not spread over the whole project.

14 Likes

Usually this is not an issue for me, but now we’re trying to use Figma to house some of our onboarding documentation, and having the ability to add a prototyping link between pages is exactly what we need. Otherwise we’ll have to shove everything into one page and sacrifice ease of navigating the documentation.

3 Likes

I would love to be able to navigate across pages seamlessly. Not being able to navigate to separate pages severely restricts the types of projects I can use Figma for. Some of my projects in sketch have dozens of pages, broken into logical groups/task flows. Putting everything in one bucket doesn’t really jive with the organization methodology most designers have.

6 Likes

There is so much that could be done with this feature.
Yes, it would help organize larger project.
One nice thing would be, if you have something like dropdown menus, tooltips, global interactions, etc, those could be organized in separate pages, and then the main UX prototype page(s) could link to those interactions.

6 Likes

Honest question to the Figma team: what’s the point of supporting multiple pages if they can’t form a single prototype?
If the answer is “multiple pages let you create multiple prototypes”… I would say, that’s what separate FILES and shared LIBRARIES are for. Like all document-based software in the last 40 years, the unit of work in Figma is a file and all serious Figma projects need to be prototypes so they can useful for stakeholders, not to mention final users…

39 Likes

I didn’t check this by for hand when I checked out the possibilities of Figma. Such an oversight. I really thought this would be a thing. Invision also has this feature forever.

1 Like

+1 for ability to link from one page to another page in prototypes.

3 Likes

It is possible to link from one page to another page, but the results are not ideal:

  1. Create two pages - one named Home and one named About
  2. Put a menu on both pages with text Home and About
  3. Right-click on the Home page in Figma’s left side bar, and choose Copy link to page
  4. Enter Prototype mode
  5. On the Home page elect the Home menu text and add an interaction - On Click > Open Link, and paste the link you copied in Step 3.
  6. Repeat steps 3 - 5 for the About page.
  7. Play the Prototype
  8. Click to share the Prototype and copy the link
  9. Open a new private/incognito window and paste the prototype URL

You should now be able to click the Home and About links to navigate between pages. It does work, but the user experience is not great, as each link initially opens in a new tab and the interface changes.

Is there a better way to do this?

15 Likes

+1 Sketch has this for quite some time and I’ve used it daily…

You don’t even need a large project for it to be useful. A simple mobile app will have a tab bar. You want to control everything (including prototype links) from the tab bar component itself to centralize the logic and avoid link mistakes (which as far as I can see is very easy in Figma). You can of course have everything on the same page but then you have an even worse organizational problem without pages.

7 Likes