When creating hand-off documents I like to showcase user flows by using arrows between different UI elements. I have to use plugins to create these arrows at the moment. When playing with Figjam I notice it had a connector option - this is great. I would love it if we could also have this connector option inside Figma as it would be a HUGE timesaver for hand-off.
I would like to think this would be a super easy update given that we can already edit connectors inside Figma. We just need a connector button in the toolbar like so:
Page 3 / 6
where is it?
Named sections in Figma would be great for organizing related screens or a flow within a page. Zooming in and out would allow you to see the section name regardless of the zoom level.
Yeah this works, it sucks you can’t put a connector line in a frame to make it a library component. That would be almost as good as having it native to regular figma.
It’s a useful tools to show the connection between screens and elements and it should be created directly in Fig Design. Waiting to use it soon on next releases 🙃
Oh? Didn’t knew that, hidden features!
I’m hoping they bake this in ASAP to Figma so we don’t have to copy from Figjam. And the thing is the connectors behave so, so hacky and downright goofy. Not being able to just drop a completely connector around independently drives me nuts. In my company we have to design the exact same flows for two brands and if I could just copy/paste and drag the exact same connector lines to the respective brand flows… my productivity could go so much further.
*drag a complete connector.
Sections for design files would help organize them especially when diferent people work in the same file
OMG, yes we need it too
That apps separation makes me mad
Hey @thread, I made a plugin to do these boring pasting-and-dragging
Probably a temporary workaround before connectors officially being support in Figma files. Feel free to let me know if there’s bugs or anything.
I just stopped creating flows in Figma because it is such a pain. Instead I just have to verbally explain this during handoff. I know FigJam is a better tool for diagrams, but honestly I have no time to copy and paste screens (plus more maintaining with two separate files).
Just as there is Design/Prototype/Inspect mode, I wish there would be a Diagramming mode, so arrows could be “toggled” on/off
+1. Agreed
I was just about to write a suggestion on the same topic, but found this thread. Seems like a no-brainer to add this into figma as well, it would be EXTREMELY helpful while working with large user flows in a team setting. Manually drawing lines for this purpose is really finicky.
We can’t create component using FigmaJam connectors on Figma file either
Trying to do this right now, an upon finding this post, realise it’s not possible 😕
I know you can copy and paste Connectors from Figjam, but what about something like that?
Yes please!
Agree, very useful, just add it as a type of shape.
We’re going to edit & merge your topic to ensure the team still gets your feedback regarding connectors & arrows.
@dvaliao Thank you, I love it! I did find one bug in setting x/y values of a section where it doesn’t move the contents (dragging the section works).
Connector lines are not just useful as a meta/diagramming tool, but also as a design element. Perhaps the arrow tool can be upgraded to include the connector line behaviors,
especially the ability to attach to other elements and reposition when those elements move.
Also, adding connector lines to components. This is not currently possible with the copy/paste workaround.
That would be great!
Does this mean connectors are coming next? 🤞
Not for me. First, they’re functionally limited. For example, you can’t group them or use text styles on their labels.
Also, adding them will trigger the missing fonts warning with an empty field (well, there is a comma there). Clicking the target icon highlights the connectors; that’s how I know they’re the cause.
I’ve also had times where they’ll disappear when creating a component or grouping other items on same page. Though, I admit I haven’t encountered this issue in a while.
So for me, it’d be great if they were first-class citizens in Figma files. 🙏
Yes please! I’d like to use the ability of specifying exact width and height shapes for scale diagrams in figma, but use the flexible figjam connectors to connect them.